fix(dashboard): mobile polish, modal layout fixes, keyboard-aware terminal + add 0.7.1 changeset

- WorkflowStepManager: fix React error #310 ("Rendered more hooks than during
  the previous render") that broke the workflow steps panel from loading.
  `useOverlayDismiss` was being called after `if (!isOpen) return null`, so
  the hook count differed between open/closed renders. Move the hook above
  the early return.
- ModelOnboardingModal: API-key input + Save button now span the full card
  width on mobile via negative inline margins that bleed past the card's
  horizontal padding, so the form sits flush to the card edges instead of
  picking up a chunky left indent from the icon-row's flex start position.
- TerminalModal: same desktop-min-width-pinning bug as the onboarding modal.
  Reset min-width/min-height to 0 on mobile with `!important` so persisted
  desktop sizes from useModalResizePersist cannot re-pin the modal at 480×320
  on smaller phones. Also add `!important` to the keyboard-overlap height/
  max-height so the visual-viewport adjustment wins against the new
  fullscreen rule — without this the terminal stayed at 100dvh while the
  mobile keyboard covered the bottom of the screen.
- Add 0.7.1 changeset covering the full mobile polish + paperclip CLI parity
  + plugin runtime registry fallback + SCHEMA_VERSION bump series.

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

packages/dashboard/app/components/ModelOnboardingModal.css

@@ -1348,8 +1348,19 @@
     min-width: 0;
   }
 
+  /* Bleed the API-key form past the card's horizontal padding so the input
+     and the Save button span the full width of the card on mobile. Without
+     this the form sat inside the 12px card padding (and on Safari sometimes
+     inherited the icon-row's start indent), which read as a chunky left
+     margin on phones. Width = 100% + 2*card-padding cancels the padding
+     out; matching negative inline margins re-anchor it to the card edges.
+     A tiny --space-xs inline padding keeps the input from kissing the
+     border. */
   .onboarding-provider-card__actions--api-key {
-    width: 100%;
+    width: calc(100% + 2 * var(--space-md));
+    margin-inline: calc(-1 * var(--space-md));
+    padding-inline: var(--space-xs);
+    box-sizing: border-box;
   }
 
   /* When actions are simple buttons (Connect / Skip), make them split the

packages/dashboard/app/components/TerminalModal.css

@@ -839,18 +839,21 @@
 /* === Terminal Modal Mobile Responsive === */
 @media (max-width: 768px) {
   .modal.terminal-modal {
-    width: 100% !important;
-    max-width: 100%;
-    min-height: 100vh;
-    min-height: 100dvh;
-    height: 100vh !important;
+    /* Reset the desktop min-width: 480px / min-height: 320px — they pin the
+       modal at 480×320 on phones narrower than 480px and force horizontal
+       overflow. The fullscreen width/height below then take effect normally.
+       !important is required because useModalResizePersist writes inline
+       width/height from saved desktop sessions, and inline styles would
+       otherwise win over the media query. */
+    min-width: 0 !important;
+    min-height: 0 !important;
+    width: 100vw !important;
+    max-width: 100vw !important;
     height: 100dvh !important;
-    max-height: 100vh;
-    max-height: 100dvh;
+    max-height: 100dvh !important;
     border-radius: 0;
     border: none;
-    /* Disable user resize on mobile — fullscreen layout. !important above
-       overrides any persisted desktop dimensions. */
+    /* Disable user resize on mobile — fullscreen layout. */
     resize: none;
   }
 
@@ -1004,13 +1007,19 @@
        shrink below the full-viewport mobile default when the keyboard
        is open.  Without this, min-height keeps the modal taller than
        the available space and the bottom overlaps the keyboard. */
-    min-height: auto;
+    min-height: auto !important;
     /* Apply both height and max-height so the modal is *exactly* the
        visual viewport height — not just capped at it.  Using height
        ensures the element cannot be taller than max-height due to
-       inherited min-height or flex layout. */
-    height: var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px)));
-    max-height: var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px)));
+       inherited min-height or flex layout.
+       !important is required because the mobile fullscreen rule above
+       sets `height: 100dvh !important` to defeat persisted desktop
+       sizes from useModalResizePersist; without `!important` here, the
+       keyboard-aware shrink would lose the specificity battle and the
+       terminal would stay at 100dvh while the keyboard covered the
+       bottom of the viewport. */
+    height: var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px))) !important;
+    max-height: var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px))) !important;
     /* Clip any content that exceeds the constrained height during
        the keyboard-open transition so the terminal doesn't poke out
        below the visible area while xterm re-fits. */

packages/dashboard/app/components/WorkflowStepManager.tsx

@@ -371,10 +371,17 @@ export function WorkflowStepManager({ isOpen, onClose, addToast, projectId }: Wo
     }
   }, [addToast, loadSteps]);
 
+  // useOverlayDismiss MUST be called before any early return — otherwise the
+  // hook count differs between isOpen=false (returns early after the existing
+  // useState/useEffect/useCallback hooks) and isOpen=true (also calls
+  // useOverlayDismiss), which trips React error #310 the moment the modal
+  // is opened. That bug currently breaks the workflow steps panel from
+  // loading at all.
+  const overlayDismissProps = useOverlayDismiss(onClose);
+
   if (!isOpen) return null;
 
   const isEditing = isCreating || editingId !== null;
-  const overlayDismissProps = useOverlayDismiss(onClose);
 
   return (
     <div className="modal-overlay open" {...overlayDismissProps} data-testid="workflow-step-manager">