fix: clean up tab titles and sidebar session display

- Remove useless document.title from handleOpen (it only changed the
  caller page's title, not the new tab)
- Terminal tab title: simpler format without extra '— Headquarter' suffix
  - Single session: '{name} — Terminal'
  - Multiple sessions: '{name} · {session_name} — Terminal'
- Sidebar live sessions: show tool type in small muted text next to
  display_name so sessions aren't indistinguishable when display_name
  is just the workspace name

Quality gates: tsc --noEmit pass, npm run build pass, 82/82 tests pass

apps/web/src/components/app-shell.tsx

@@ -63,7 +63,10 @@ const SessionItem = ({ session }: { session: Session }) => {
 		>
 			<span className={`session-status ${isRunning ? "running" : ""}`} />
 			<Icon name={session.tool_icon as IconName} size="sm" />
-			<span className="session-name">{session.display_name}</span>
+			<span className="session-name">
+				{session.display_name}
+				<span className="session-tool">{session.tool_type_name}</span>
+			</span>
 		</a>
 	);
 };

apps/web/src/hooks/use-instance-actions.ts

@@ -54,7 +54,6 @@ export function useInstanceActions(
 			url = `/projects/${session.project_id}`;
 		}
 
-		document.title = `${session.display_name} — Headquarter`;
 		const w = window.open(url, `session-${session.id}`);
 		tabRefs.current.set(key, w);
 	}, []);

apps/web/src/hooks/use-terminal-page.ts

@@ -9,7 +9,6 @@ import { useTerminalSessions } from "./use-terminal-sessions";
 import type { TerminalSession } from "../api/terminal";
 import type { ModifierKey } from "./use-special-keys";
 
-
 const SESSIONS_TO_INFO = (sessions: TerminalSession[]): TerminalSessionInfo[] =>
 	sessions.map((s) => ({
 		id: s.id,
@@ -92,13 +91,20 @@ export const useTerminalPage = () => {
 	// Update document title based on active terminal session
 	useEffect(() => {
 		if (!instanceId) {
-			document.title = "Terminal — Headquarter";
+			document.title = "Terminal";
 			return;
 		}
 		const active = sessions.find((s) => s.id === activeSessionId);
-		const sessionName = active?.name ?? "Session";
-		const baseName = instanceDisplayName ?? `Instance ${instanceId.slice(0, 8)}`;
-		document.title = `${baseName} ${sessionName} — Terminal — Headquarter`;
+		const baseName =
+			instanceDisplayName ?? `Instance ${instanceId.slice(0, 8)}`;
+		// Single session: just show "{name} — Terminal"
+		// Multiple sessions: "{name} · {session_name} — Terminal"
+		if (sessions.length <= 1) {
+			document.title = `${baseName} — Terminal`;
+		} else {
+			const sessionName = active?.name ?? "Session";
+			document.title = `${baseName} · ${sessionName} — Terminal`;
+		}
 		return () => {
 			document.title = "Headquarter";
 		};

apps/web/src/styles/utilities.css

@@ -298,6 +298,14 @@ a.nav-item,
 	max-width: 140px;
 }
 
+.session-tool {
+	font-size: 10px;
+	color: var(--muted);
+	margin-left: 4px;
+	text-transform: uppercase;
+	letter-spacing: 0.03em;
+}
+
 .nav-divider {
 	height: 1px;
 	background: var(--border);