fix(dashboard): keep mobile terminal header on a single row

Previously the mobile terminal header used flex-wrap to stack tabs and
the action cluster on separate rows. The actions now stay pinned to the
right edge of the header row while the tab bar flexes to fill remaining
width and remains horizontally scrollable.

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

packages/dashboard/app/components/__tests__/TerminalModal.test.tsx

@@ -1679,6 +1679,16 @@ describe("TerminalModal — mobile layout contract", () => {
     });
   });
 
+  it("adds the shortcut spacing hook to the shortcuts toggle", async () => {
+    render(<TerminalModal isOpen={true} onClose={mockOnClose} />);
+
+    await waitFor(() => {
+      expect(screen.getByTestId("terminal-shortcut-toggle").className).toContain(
+        "terminal-clear-btn--shortcut",
+      );
+    });
+  });
+
   it("terminal-title section contains the status indicator for connection state", async () => {
     render(<TerminalModal isOpen={true} onClose={mockOnClose} />);