diff --git a/web/src/attach.ts b/web/src/attach.ts
index 948d633..1886642 100644
--- a/web/src/attach.ts
+++ b/web/src/attach.ts
@@ -43,6 +43,10 @@ export interface AttachConnection {
    *  handling — the leader's literal Ctrl-K escape hatch
    *  (docs/COMMAND-BAR.md). */
   sendInput(data: string): void;
+  /** Refresh the header's name/command (e.g. after autoname renames the
+   *  session) — the connection outlives mount/unmount, so this is the only
+   *  way an already-open header picks up a new name. */
+  updateInfo(info: AttachInfo): void;
   /** Fully disconnect: close the WS, dispose the terminal, remove the element. */
   dispose(): void;
 }
@@ -85,21 +89,25 @@ export function createAttachConnection(
   el.className = "attach";
   // Useful identity over a bare UUID: name · command. The full id stays in the
   // tooltip for when you really need it.
-  const titleHtml = info
-    ? `<span class="at-name">${escapeHtml(info.name)}</span>` +
-      (info.command && info.command !== info.name ? commandFragment(info.command) : "")
-    : `session <span class="sid">${escapeHtml(sessionId.slice(0, 8))}</span>`;
-  const titleAttr = info ? `${info.name} · ${info.command}  (${sessionId})` : sessionId;
+  const titleMarkup = (i?: AttachInfo): { html: string; attr: string } => ({
+    html: i
+      ? `<span class="at-name">${escapeHtml(i.name)}</span>` +
+        (i.command && i.command !== i.name ? commandFragment(i.command) : "")
+      : `session <span class="sid">${escapeHtml(sessionId.slice(0, 8))}</span>`,
+    attr: i ? `${i.name} · ${i.command}  (${sessionId})` : sessionId,
+  });
+  const initialTitle = titleMarkup(info);
   el.innerHTML = `
     <header class="attach-header">
       <button type="button" class="btn btn-ghost btn-icon sessions-btn" aria-label="Show sessions" title="Show sessions">☰</button>
-      <span class="attach-title" title="${escapeHtml(titleAttr)}">${titleHtml}</span>
+      <span class="attach-title" title="${escapeHtml(initialTitle.attr)}">${initialTitle.html}</span>
       <span class="attach-state" data-state="connecting">connecting…</span>
       <button class="btn btn-ghost btn-icon disconnect" type="button" aria-label="Disconnect" title="Disconnect this session">⏻</button>
     </header>
     <div class="attach-body"></div>
   `;
 
+  const titleEl = el.querySelector(".attach-title") as HTMLSpanElement;
   const body = el.querySelector(".attach-body") as HTMLDivElement;
   const stateEl = el.querySelector(".attach-state") as HTMLSpanElement;
   const disconnectBtn = el.querySelector(".disconnect") as HTMLButtonElement;
@@ -499,6 +507,11 @@ export function createAttachConnection(
     // The closure above: the same bytes-out path keystrokes and the mobile key
     // bar already take.
     sendInput,
+    updateInfo(next: AttachInfo) {
+      const { html, attr } = titleMarkup(next);
+      titleEl.innerHTML = html;
+      titleEl.title = attr;
+    },
     dispose() {
       if (disposed) return;
       disposed = true;
diff --git a/web/src/connections.test.ts b/web/src/connections.test.ts
index 9464504..54cb3ec 100644
--- a/web/src/connections.test.ts
+++ b/web/src/connections.test.ts
@@ -16,6 +16,7 @@ vi.mock("./attach.js", () => ({
     sendInput(data: string) {
       sent.push({ id, data });
     },
+    updateInfo() {},
     dispose() {},
   }),
 }));
diff --git a/web/src/connections.ts b/web/src/connections.ts
index 1f17afe..c78d0a5 100644
--- a/web/src/connections.ts
+++ b/web/src/connections.ts
@@ -79,6 +79,7 @@ export class ConnectionPool {
     if (conn) {
       this.cache.delete(id);
       this.cache.set(id, conn);
+      if (info) conn.updateInfo(info);
     } else {
       conn = createAttachConnection(
         id,