fix(maestro): collapse mobile drawer after spawning a session

mountSpawned now fires a CLOSE_DRAWER_EVENT so the sidebar gets out of
the way once the new session lands. Covers fast-forward, modal, and
command-bar spawn paths.

Closes #261

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

web/src/App.tsx

@@ -47,6 +47,7 @@ import {
   OPEN_SPAWN_EVENT,
   SESSION_SELECT_EVENT,
   SPAWN_SIMILAR_EVENT,
+  requestCloseDrawer,
   requestOpenSpawn,
   requestToggleDrawer,
 } from "./uiEvents.js";
@@ -182,6 +183,7 @@ function Shell() {
     (session: Session, opts?: { newTab?: boolean }) => {
       layoutStore.getState().openSessionBeside(session.id, opts);
       navigate({ kind: "attach", sessionId: session.id });
+      requestCloseDrawer();
     },
     [layoutStore, navigate],
   );

web/src/components/layout/Drawer.test.tsx

@@ -2,7 +2,7 @@
 import { act, cleanup, fireEvent, render } from "@testing-library/react";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
-import { OPEN_SPAWN_EVENT, SPAWN_SIMILAR_EVENT } from "../../uiEvents.js";
+import { CLOSE_DRAWER_EVENT, OPEN_SPAWN_EVENT, SPAWN_SIMILAR_EVENT } from "../../uiEvents.js";
 import { TOGGLE_DRAWER_EVENT } from "../../uiEvents.js";
 import { Drawer } from "./Drawer.js";
 
@@ -103,6 +103,19 @@ describe("Drawer (#35)", () => {
     expect(shell().classList.contains("drawer-open")).toBe(false);
   });
 
+  it("closes on the close-drawer event (after spawn lands)", () => {
+    render(
+      <Drawer sidebar={<div className="tree-leaf">row</div>}>
+        <div>content</div>
+      </Drawer>,
+    );
+    openViaToggle();
+    act(() => {
+      document.dispatchEvent(new CustomEvent(CLOSE_DRAWER_EVENT));
+    });
+    expect(shell().classList.contains("drawer-open")).toBe(false);
+  });
+
   it("closes on a backdrop click", () => {
     render(
       <Drawer sidebar={<div className="tree-leaf">row</div>}>

web/src/components/layout/Drawer.tsx

@@ -10,7 +10,7 @@
 import type { ReactNode } from "react";
 import { useEffect, useRef, useState } from "react";
 
-import { OPEN_SPAWN_EVENT, SPAWN_SIMILAR_EVENT, TOGGLE_DRAWER_EVENT } from "../../uiEvents.js";
+import { CLOSE_DRAWER_EVENT, OPEN_SPAWN_EVENT, SPAWN_SIMILAR_EVENT, TOGGLE_DRAWER_EVENT } from "../../uiEvents.js";
 
 export interface DrawerProps {
   sidebar: ReactNode;
@@ -28,10 +28,12 @@ export function Drawer({ sidebar, children, className }: DrawerProps) {
     document.addEventListener(TOGGLE_DRAWER_EVENT, onToggle);
     document.addEventListener(OPEN_SPAWN_EVENT, onClose);
     document.addEventListener(SPAWN_SIMILAR_EVENT, onClose);
+    document.addEventListener(CLOSE_DRAWER_EVENT, onClose);
     return () => {
       document.removeEventListener(TOGGLE_DRAWER_EVENT, onToggle);
       document.removeEventListener(OPEN_SPAWN_EVENT, onClose);
       document.removeEventListener(SPAWN_SIMILAR_EVENT, onClose);
+      document.removeEventListener(CLOSE_DRAWER_EVENT, onClose);
     };
   }, []);
 

web/src/uiEvents.ts

@@ -57,6 +57,15 @@ export function requestToggleDrawer(): void {
   document.dispatchEvent(new CustomEvent(TOGGLE_DRAWER_EVENT));
 }
 
+/** Close the mobile drawer unconditionally — used after a spawn lands a new
+ *  session so the content pane is visible. Unlike TOGGLE, this is idempotent:
+ *  firing it when the drawer is already closed is a no-op. */
+export const CLOSE_DRAWER_EVENT = "maestro-close-drawer";
+
+export function requestCloseDrawer(): void {
+  document.dispatchEvent(new CustomEvent(CLOSE_DRAWER_EVENT));
+}
+
 /** Toggle the help overlay from a button click (the `?` key is handled by
  *  HelpOverlay's own command set). */
 export const TOGGLE_HELP_EVENT = "maestro-toggle-help";