fix(dashboard): mobile layout polish for onboarding/new-agent modals + settings auth gutter

- ModelOnboardingModal: the desktop base set min-width: 640px / min-height:
  480px and the mobile media query only reset max-width — but min-width
  always wins over max-width in size resolution, so the modal stayed pinned
  at 640px and overflowed any phone narrower than that. Compounding it,
  useModalResizePersist writes inline width/height from saved desktop
  sessions (e.g. 1100px), and inline styles beat the media query. Reset
  min-width/min-height to 0 in the mobile rule and force fullscreen
  (100vw/100dvh) with !important so the persisted desktop size cannot
  re-pin the modal off-screen. Also disable resize on mobile.

- NewAgentDialog: had no mobile media query at all. Added a max-width: 768px
  block that drops the overlay padding, fills 100vw/100dvh, removes the
  border-radius, tightens header/footer/steps padding, locks body scroll
  with overscroll-behavior: contain + -webkit-overflow-scrolling: touch
  (so iOS doesn't bubble the scroll up and trap users above the footer),
  and stacks the footer buttons full-width. Also switched the desktop
  max-height from 100vh to 100dvh so iOS Safari's collapsing URL bar
  doesn't push the footer under the address bar.

- SettingsModal auth panel: reduced .auth-panel-body padding-inline from
  --space-xl (24px) to --space-md (12px) so each provider card gets more
  horizontal room — the cards are dense enough that the wider gutter
  wasted visible width without any visual benefit.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

packages/dashboard/app/components/ModelOnboardingModal.css

@@ -1226,10 +1226,23 @@
 
 @media (max-width: 768px) {
   .model-onboarding-modal {
-    max-width: 100%;
-    width: 100%;
-    max-height: 100dvh;
+    /* Reset the desktop min-width/min-height — they pin the modal at 640×480
+       and force horizontal overflow on phones (≤414px). The fullscreen
+       width/height below then take effect normally.
+       !important is required because useModalResizePersist writes inline
+       width/height from previously-saved desktop sessions, and inline styles
+       would otherwise win over the media query and re-pin the modal at e.g.
+       1100px on a 375px phone. */
+    min-width: 0 !important;
+    min-height: 0 !important;
+    max-width: 100vw !important;
+    width: 100vw !important;
+    max-height: 100dvh !important;
+    height: 100dvh !important;
     border-radius: 0;
+    /* Disable the desktop resize grip on mobile — it's useless at fullscreen
+       and the resize handle bleeds outside the safe area. */
+    resize: none;
   }
 
   .model-onboarding-header {