fix(run,lanes): prompt autocomplete, per-lane Active runs, compact Changes header

- The run form's prompt box offers suggestions again: `/` lists the run
  cwd's project and user commands and skills plus the CLI built-ins
  (claude lanes only), `@` lists files under the cwd; Enter picks while
  the list is open and sends otherwise. The 2f39f4e rewrite had left a
  bare textarea that ignored both.
- Active runs lists only the current lane's runs and external sessions
  (sessions matched to the lane by longest path-boundary cwd), instead of
  every lane's.
- The Changes panel's git line and its actions are one compact row in one
  card, and the mode/range toolbar is one wrapping row.
- The lane card hides itself when it has nothing to show, instead of
  leaving an empty frame where the git row used to be.

client/src/components/lanes/LaneCard.tsx

@@ -480,7 +480,9 @@ export default function LaneCard({
     <>
       <div
         data-testid={`lane-card-${lane.id}`}
-        className="flex flex-col rounded-lg border border-border bg-surface-4 p-2.5 transition-colors hover:border-border-light"
+        // Every row below is conditional: a lane with nothing to report
+        // renders no frame at all rather than an empty box.
+        className="flex flex-col rounded-lg border border-border bg-surface-4 p-2.5 transition-colors hover:border-border-light empty:hidden"
       >
         {(lane.ci_status || lane.tool === "codex") && (
           <div className="mb-2 flex flex-wrap items-center gap-1.5 text-[11px]">

client/src/components/lanes/LaneChangesPanel.tsx

@@ -630,12 +630,12 @@ export function LaneChangesPanel({
   return (
     <div data-testid="lane-changes" className="flex min-h-0 flex-1 flex-col">
       <LaneGitHeader laneId={laneId} git={git} onChanged={rereadAll} onNewLane={onNewLane} />
-      {/* Two rows on purpose: WHERE you are (mode, and the refresh that always
-          applies) on top, HOW you are looking at it (range, layout, context,
-          whole file) underneath. One row wrapped mid-group as soon as the
-          panel was narrow, which is every panel beside a console. */}
-      <div className="mb-2 space-y-1.5">
-        <div className="flex items-center gap-1.5">
+      {/* ONE wrapping row: where you are (mode) then how you are looking at it
+          (range, layout, context, whole file), refresh last. Each group is
+          its own inline box, so a narrow panel wraps BETWEEN groups — never
+          through one, which is what made the old single row unreadable. */}
+      <div className="mb-2 flex flex-wrap items-center gap-1.5">
+        <div className="contents">
           {mode === "file" ? (
             <button
               type="button"
@@ -677,14 +677,14 @@ export function LaneChangesPanel({
             onClick={rereadAll}
             aria-label={t("changes.refresh")}
             title={t("changes.refresh")}
-            className="ml-auto shrink-0 text-fg-muted hover:text-fg-primary"
+            className="order-last ml-auto shrink-0 text-fg-muted hover:text-fg-primary"
           >
             <RefreshCw className={`h-3.5 w-3.5 ${loading ? "animate-spin" : ""}`} />
           </button>
         </div>
 
         {mode !== "history" && mode !== "browse" && (
-          <div className="flex flex-wrap items-center gap-1.5">
+          <div className="contents">
             <div className="flex items-center rounded border border-border bg-surface-2 p-0.5">
               {(["work", "branch"] as const).map((r) => (
                 <button

client/src/components/lanes/LaneGitBar.tsx

@@ -6,8 +6,8 @@
  * per-file stage/unstage/discard it commits — one way to commit, and it only
  * ever takes what the user staged.
  *
- * It renders at the top of the Changes panel (`LaneGitHeader`) rather than in
- * the lane card's ⋯ menu: that menu holds the rare and dangerous (`reset
+ * It renders at the top of the Changes panel (`LaneGitHeader`), its actions as
+ * icons on the same row as the branch line, rather than in the lane card's ⋯ menu: that menu holds the rare and dangerous (`reset
  * worktree`), and these are the ordinary moves a lane needs several times an hour.
  * Nothing here decides what an action may do; the server does (pull is always
  * --ff-only, switch refuses a dirty tree), and this only reports what it said.
@@ -30,6 +30,7 @@ function Btn({
   busy,
   disabled,
   title,
+  compact,
   onClick,
 }: {
   label: string;
@@ -37,6 +38,8 @@ function Btn({
   busy?: boolean;
   disabled?: boolean;
   title?: string;
+  /** Icon only; the label becomes the accessible name, the hint the tooltip. */
+  compact?: boolean;
   onClick: () => void;
 }) {
   return (
@@ -45,10 +48,13 @@ function Btn({
       onClick={onClick}
       disabled={disabled || busy}
       title={title}
-      className="flex items-center gap-1 rounded border border-border-light px-1.5 py-0.5 text-[11px] text-fg-secondary transition-colors hover:bg-surface-2 hover:text-fg-primary disabled:cursor-not-allowed disabled:opacity-40"
+      aria-label={compact ? label : undefined}
+      className={`flex items-center gap-1 rounded text-[11px] text-fg-secondary transition-colors hover:bg-surface-3 hover:text-fg-primary disabled:cursor-not-allowed disabled:opacity-40 ${
+        compact ? "h-6 w-6 justify-center" : "border border-border-light px-1.5 py-0.5"
+      }`}
     >
       {icon}
-      {label}
+      {!compact && label}
     </button>
   );
 }
@@ -58,9 +64,13 @@ export function LaneGitBar({
   git,
   onChanged,
   onNewLane,
+  lead,
 }: {
   laneId: number;
   git: LaneGitFacts;
+  /** Rendered at the start of the action row: the header's branch line, so
+   *  the facts and the buttons that act on them read as one row. */
+  lead?: React.ReactNode;
   /** Called after any action that could have moved the working copy. */
   onChanged: () => void;
   /** Open the Add-lane flow for a sibling worktree of this repo, optionally on
@@ -165,8 +175,9 @@ export function LaneGitBar({
   );
 
   return (
-    <div data-testid="lane-git-bar" className="mb-2 space-y-1">
-      <div className="flex flex-wrap items-center gap-1.5">
+    <div data-testid="lane-git-bar" className="space-y-1">
+      <div className="flex min-w-0 items-center gap-2">
+        {lead}
         {/* Ahead/behind first: it is the fact that decides which of the
             buttons beside it the user actually wants. */}
         {/* Null counts with an upstream named means git could not compare
@@ -176,7 +187,7 @@ export function LaneGitBar({
           <span
             data-testid="lane-git-tracking"
             title={git.upstream}
-            className="flex items-center gap-1 font-mono text-[11px] text-fg-muted"
+            className="flex shrink-0 items-center gap-1 font-mono text-[11px] text-fg-muted"
           >
             {(git.ahead ?? 0) > 0 && (
               <span className="flex items-center text-status-warning">
@@ -194,43 +205,51 @@ export function LaneGitBar({
           </span>
         ) : (
           git.hasRemote && (
-            <span className="font-mono text-[11px] text-fg-muted">{t("gitBar.noUpstream")}</span>
+            <span className="shrink-0 font-mono text-[11px] text-fg-muted">
+              {t("gitBar.noUpstream")}
+            </span>
           )
         )}
 
-        <Btn
-          label={t("gitBar.fetch")}
-          icon={<RefreshCw className="h-3 w-3" />}
-          busy={busy === "fetch"}
-          disabled={!git.hasRemote || !!busy}
-          title={t("gitBar.fetchHint")}
-          onClick={() => run("fetch")}
-        />
-        <Btn
-          label={t("gitBar.pull")}
-          icon={<ArrowDown className="h-3 w-3" />}
-          busy={busy === "pull"}
-          disabled={!git.hasRemote || !!busy}
-          title={t("gitBar.pullHint")}
-          onClick={() => run("pull")}
-        />
-        <Btn
-          label={t("gitBar.push")}
-          icon={<Upload className="h-3 w-3" />}
-          busy={busy === "push"}
-          disabled={!git.hasRemote || !!busy}
-          title={t("gitBar.pushHint")}
-          onClick={() => run("push")}
-        />
-        <Btn
-          label={t("gitBar.switch")}
-          icon={<GitBranch className="h-3 w-3" />}
-          disabled={!!busy}
-          // A dirty tree is refused server-side; saying so before the click
-          // beats a red box after it.
-          title={dirty > 0 ? t("gitBar.switchDirty") : t("gitBar.switchHint")}
-          onClick={openSwitch}
-        />
+        <div className="ml-auto flex shrink-0 items-center">
+          <Btn
+            compact
+            label={t("gitBar.fetch")}
+            icon={<RefreshCw className="h-3.5 w-3.5" />}
+            busy={busy === "fetch"}
+            disabled={!git.hasRemote || !!busy}
+            title={t("gitBar.fetchHint")}
+            onClick={() => run("fetch")}
+          />
+          <Btn
+            compact
+            label={t("gitBar.pull")}
+            icon={<ArrowDown className="h-3.5 w-3.5" />}
+            busy={busy === "pull"}
+            disabled={!git.hasRemote || !!busy}
+            title={t("gitBar.pullHint")}
+            onClick={() => run("pull")}
+          />
+          <Btn
+            compact
+            label={t("gitBar.push")}
+            icon={<Upload className="h-3.5 w-3.5" />}
+            busy={busy === "push"}
+            disabled={!git.hasRemote || !!busy}
+            title={t("gitBar.pushHint")}
+            onClick={() => run("push")}
+          />
+          <Btn
+            compact
+            label={t("gitBar.switch")}
+            icon={<GitBranch className="h-3.5 w-3.5" />}
+            disabled={!!busy}
+            // A dirty tree is refused server-side; saying so before the click
+            // beats a red box after it.
+            title={dirty > 0 ? t("gitBar.switchDirty") : t("gitBar.switchHint")}
+            onClick={openSwitch}
+          />
+        </div>
       </div>
 
       {switching && (

client/src/components/lanes/LaneGitHeader.tsx

@@ -13,6 +13,7 @@
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import { useTranslation } from "react-i18next";
+import { GitBranch } from "lucide-react";
 import { LaneGitBar } from "./LaneGitBar";
 import { api } from "../../lib/api";
 import { keepIfSame } from "../../lib/keepIfSame";
@@ -230,50 +231,64 @@ export function LaneGitHeader({
   useEffect(() => () => window.clearTimeout(filesCloseTimer.current), []);
 
   if (!git?.available) return null;
-  return (
-    <div data-testid="lane-git-header">
-      {/* One line, because every part of it is short and the panel is
-          narrow: branch, head, subject, and the uncommitted counts read as a
-          sentence rather than a four-row block. */}
-      <div className="mb-2">
-        <div
-          data-testid="lane-git"
-          className="flex items-baseline gap-2 truncate font-mono text-[11px] text-fg-secondary"
-          title={git.subject}
-        >
-          <span className="shrink-0">⑂ {git.branch}</span>
-          <span className="shrink-0 text-fg-muted">{git.head}</span>
-          <span className="truncate text-fg-muted">{git.subject}</span>
-          {(git.dirty > 0 || git.untracked > 0) && (
-            <button
-              type="button"
-              ref={setCountsAnchor}
-              data-testid="lane-git-counts"
-              aria-expanded={filesOpen}
-              onMouseEnter={openFiles}
-              onMouseLeave={closeFiles}
-              // Focus and click open it too: hover is not a gesture a
-              // keyboard or a touchscreen has.
-              onFocus={openFiles}
-              onBlur={closeFiles}
-              onClick={() => setFilesOpen((v) => !v)}
-              className="shrink-0 cursor-help text-status-warning/80 underline decoration-dotted underline-offset-2"
-            >
-              {t("git.uncommitted", { dirty: git.dirty, untracked: git.untracked })}
-            </button>
-          )}
-        </div>
-        {filesOpen && git.files?.length > 0 && (
-          <LaneGitFilesPanel
-            files={git.files}
-            hidden={git.dirty + git.untracked - git.files.length}
-            anchor={countsAnchor}
-            onPointerEnter={openFiles}
-            onPointerLeave={closeFiles}
-          />
-        )}
+  const lead = (
+    <>
+      {/* One row with the actions: branch first and strongest, then the head
+          and its subject, which is what truncates when the panel is narrow
+          (the whole of it stays in the tooltip). */}
+      <div
+        data-testid="lane-git"
+        className="flex min-w-0 flex-1 items-baseline gap-1.5 font-mono text-[11px]"
+        title={`${git.head} ${git.subject}`}
+      >
+        <span className="flex shrink-0 items-center gap-1 self-center font-semibold text-fg-primary">
+          <GitBranch className="h-3 w-3 text-fg-muted" />
+          {git.branch}
+        </span>
+        <span className="shrink-0 text-fg-muted">{git.head}</span>
+        <span className="min-w-0 truncate text-fg-muted">{git.subject}</span>
       </div>
-      <LaneGitBar laneId={laneId} git={git} onChanged={onChanged} onNewLane={onNewLane} />
+      {(git.dirty > 0 || git.untracked > 0) && (
+        <button
+          type="button"
+          ref={setCountsAnchor}
+          data-testid="lane-git-counts"
+          aria-expanded={filesOpen}
+          onMouseEnter={openFiles}
+          onMouseLeave={closeFiles}
+          // Focus and click open it too: hover is not a gesture a
+          // keyboard or a touchscreen has.
+          onFocus={openFiles}
+          onBlur={closeFiles}
+          onClick={() => setFilesOpen((v) => !v)}
+          className="shrink-0 cursor-help rounded-full border border-status-warning/40 bg-status-warning/10 px-2 py-px text-[10.5px] text-status-warning"
+        >
+          {t("git.uncommitted", { dirty: git.dirty, untracked: git.untracked })}
+        </button>
+      )}
+    </>
+  );
+  return (
+    <div
+      data-testid="lane-git-header"
+      className="mb-2 rounded-md border border-border bg-surface-2 px-2 py-1"
+    >
+      <LaneGitBar
+        laneId={laneId}
+        git={git}
+        onChanged={onChanged}
+        onNewLane={onNewLane}
+        lead={lead}
+      />
+      {filesOpen && git.files?.length > 0 && (
+        <LaneGitFilesPanel
+          files={git.files}
+          hidden={git.dirty + git.untracked - git.files.length}
+          anchor={countsAnchor}
+          onPointerEnter={openFiles}
+          onPointerLeave={closeFiles}
+        />
+      )}
     </div>
   );
 }

client/src/components/lanes/__tests__/LaneGitHeader.test.tsx

@@ -55,7 +55,7 @@ describe("LaneGitHeader", () => {
     expect(block.textContent).toContain("feat/rename-metric");
     expect(block.textContent).toContain("9b3e74a");
     expect(block.textContent).toContain("free-text rule mode in the form");
-    expect(block.textContent).toContain("2");
+    expect(screen.getByTestId("lane-git-counts").textContent).toContain("2");
   });
 
   it("drops the previous lane's facts the moment the lane changes", async () => {