diff --git a/src/screens/Deposit.tsx b/src/screens/Deposit.tsx
index 27ca1d1..769d8b6 100644
--- a/src/screens/Deposit.tsx
+++ b/src/screens/Deposit.tsx
@@ -65,7 +65,7 @@ export function Deposit({ onDone }: DepositProps) {
   const balance = 240
 
   return (
-    <main id="main-content" style={{ maxWidth: 520, margin: '0 auto', padding: '48px 24px 80px' }}>
+    <main id="main-content" className="hb-deposit-main" style={{ maxWidth: 520, margin: '0 auto' }}>
       <Stepper step={step} />
 
       {step === 'amount' && (
diff --git a/src/screens/Withdraw.tsx b/src/screens/Withdraw.tsx
index 0d3df41..14d8442 100644
--- a/src/screens/Withdraw.tsx
+++ b/src/screens/Withdraw.tsx
@@ -53,7 +53,7 @@ export function Withdraw({ onDone, onBack }: WithdrawProps) {
   const n = parseFloat(amount) || 0
 
   return (
-    <main id="main-content" style={{ maxWidth: 520, margin: '0 auto', padding: '48px 24px 80px' }}>
+    <main id="main-content" className="hb-deposit-main" style={{ maxWidth: 520, margin: '0 auto' }}>
       {step === 'amount' && (
         <div style={panel}>
           <h1 style={hw}>{t('h1')}</h1>
diff --git a/src/styles/shell.css b/src/styles/shell.css
index ba44c07..c82472b 100644
--- a/src/styles/shell.css
+++ b/src/styles/shell.css
@@ -277,3 +277,16 @@
     background: var(--ink-06);
   }
 }
+
+/* --- Deposit/Withdraw responsive ------------------------------------------ */
+.hb-deposit-main {
+  padding: 48px 24px 80px;
+}
+
+@media (max-width: 640px) {
+  .hb-deposit-main {
+    padding: 24px 16px 64px;
+    max-width: 100vw;
+    overflow-x: hidden;
+  }
+}