diff --git a/studio/frontend/src/features/settings/settings-dialog.tsx b/studio/frontend/src/features/settings/settings-dialog.tsx
index 384e359f31..3b95cb2355 100644
--- a/studio/frontend/src/features/settings/settings-dialog.tsx
+++ b/studio/frontend/src/features/settings/settings-dialog.tsx
@@ -109,10 +109,12 @@ export function SettingsDialog() {
           }
         }}
         className={cn(
-          "!max-w-none h-[560px] w-[820px] p-0 overflow-hidden",
+          // Cap at 820px but shrink to the viewport so we don't clip
+          // on iPad-portrait widths (640-820px) where the fixed
+          // `w-[820px]` overflows by 26px on each side.
+          "!max-w-[min(820px,calc(100vw-2rem))] h-[560px] w-[min(820px,calc(100vw-2rem))] p-0 overflow-hidden",
           "shadow-border rounded-xl border-border",
-          "sm:h-[560px] sm:w-[820px]",
-          "max-sm:h-dvh max-sm:w-dvw max-sm:rounded-none",
+          "max-sm:h-dvh max-sm:w-dvw max-sm:!max-w-none max-sm:rounded-none",
         )}
       >
         <DialogTitle className="sr-only">Settings</DialogTitle>