diff --git a/src/screens/Portfolio.tsx b/src/screens/Portfolio.tsx
index 9ccd8b0..d3da55b 100644
--- a/src/screens/Portfolio.tsx
+++ b/src/screens/Portfolio.tsx
@@ -26,7 +26,7 @@ export function Portfolio({ onWithdraw, onDeposit }: PortfolioProps) {
     return (
       <main
         id="main-content"
-        style={{ maxWidth: 1080, margin: '0 auto', padding: '48px 32px 80px' }}
+        className="hb-portfolio-main" style={{ maxWidth: 1080, margin: '0 auto' }}
       >
         <Card
           style={{
@@ -59,7 +59,7 @@ export function Portfolio({ onWithdraw, onDeposit }: PortfolioProps) {
   }
 
   return (
-    <main id="main-content" style={{ maxWidth: 1080, margin: '0 auto', padding: '48px 32px 80px' }}>
+    <main id="main-content" className="hb-portfolio-main" style={{ maxWidth: 1080, margin: '0 auto' }}>
       <div
         style={{
           display: 'flex',
diff --git a/src/styles/shell.css b/src/styles/shell.css
index ba44c07..6c52d7a 100644
--- a/src/styles/shell.css
+++ b/src/styles/shell.css
@@ -277,3 +277,14 @@
     background: var(--ink-06);
   }
 }
+
+/* --- Portfolio responsive ------------------------------------------------- */
+.hb-portfolio-main {
+  padding: 48px 32px 80px;
+}
+
+@media (max-width: 640px) {
+  .hb-portfolio-main {
+    padding: 24px 16px 64px;
+  }
+}