diff --git a/src/layouts/MobileMenu.tsx b/src/layouts/MobileMenu.tsx
index 4116822584..ad7c7af499 100644
--- a/src/layouts/MobileMenu.tsx
+++ b/src/layouts/MobileMenu.tsx
@@ -55,9 +55,9 @@ const menuListSx = {
   // 3rem row. Only currentColor SvgIcons are caught — the language flags are `<img>` and carry
   // their own responsive box.
   '& .MuiSvgIcon-root': { fontSize: '1.5rem' },
-  // The language flags are `<img>`, not currentColor glyphs, so they scale by box rather than
-  // font-size. `:has(img)` keeps this off the Back chevron and check slots in the same list.
-  '& .MuiListItemIcon-root:has(img)': { width: 28, height: 20 },
+  // The submenus' leading icon slot (the check trails, never first) widens for 28x20 flags.
+  '& .MuiListItemIcon-root:first-child': { width: 28 },
+  '& .MuiListItemIcon-root:has(img)': { height: 20 },
 };
 
 // The hamburger (three rounded lines, per the design SVG) that morphs into an X. Rendered inside
diff --git a/src/layouts/components/SettingsSubmenuList/index.tsx b/src/layouts/components/SettingsSubmenuList/index.tsx
index 793237d61a..d1b6f5699b 100644
--- a/src/layouts/components/SettingsSubmenuList/index.tsx
+++ b/src/layouts/components/SettingsSubmenuList/index.tsx
@@ -4,9 +4,14 @@ import { ReactNode } from 'react';
 import { CheckIcon } from 'src/components/icons/CheckIcon';
 import { ChevronLeftIcon } from 'src/components/icons/ChevronLeftIcon';
 
-// Chevron/icon-to-label gap, per the design spec — the Back row runs 2px wider than an option.
-const BACK_ICON_SX = { mr: '0.625rem', color: 'fg-chevron' };
-const OPTION_ICON_SX = { mr: '0.5rem', color: 'fg-3' };
+const ICON_SLOT_SX = {
+  width: '1.25rem',
+  mr: '0.5rem',
+  justifyContent: 'center',
+  '&:has(img)': { height: '0.875rem', borderRadius: '2px', overflow: 'hidden' },
+};
+const BACK_ICON_SX = { ...ICON_SLOT_SX, color: 'fg-chevron' };
+const OPTION_ICON_SX = { ...ICON_SLOT_SX, color: 'fg-3' };
 const ROW_SX = { cursor: 'pointer', color: 'fg-1' };
 
 interface SettingsSubmenuOption {