diff --git a/packages/core/src/browser-tabs/browserTabsStore.ts b/packages/core/src/browser-tabs/browserTabsStore.ts
index c2985cec3a..a3b3a5ba94 100644
--- a/packages/core/src/browser-tabs/browserTabsStore.ts
+++ b/packages/core/src/browser-tabs/browserTabsStore.ts
@@ -11,9 +11,25 @@ interface BrowserTabsState {
   setSnapshot: (snapshot: TabsSnapshot) => void;
 }
 
+// True when two snapshots carry the same value. Reference check first (the
+// common no-op), then a structural compare. Stringify can only yield a false
+// *mismatch* (e.g. key-order drift), never a false match — so it can bail on a
+// redundant write but never skip a real change, which would strand a stale
+// mirror.
+function snapshotsEqual(a: TabsSnapshot, b: TabsSnapshot): boolean {
+  return a === b || JSON.stringify(a) === JSON.stringify(b);
+}
+
 export const browserTabsStore = createStore<BrowserTabsState>((set) => ({
   snapshot: { windows: [], tabs: [] },
-  setSnapshot: (snapshot) => set({ snapshot }),
+  // Skip redundant writes: every tab mutation's onSuccess re-applies the
+  // authoritative snapshot even when an optimistic write already set an equal
+  // value. Without this guard that echo re-renders every subscriber and re-runs
+  // the navigation effect (which depends on this snapshot) for no change.
+  setSnapshot: (snapshot) =>
+    set((prev) =>
+      snapshotsEqual(prev.snapshot, snapshot) ? prev : { snapshot },
+    ),
 }));
 
 export const getTabsSnapshot = () => browserTabsStore.getState().snapshot;
diff --git a/packages/shared/src/analytics-events.ts b/packages/shared/src/analytics-events.ts
index b3914781d7..0ede9a0460 100644
--- a/packages/shared/src/analytics-events.ts
+++ b/packages/shared/src/analytics-events.ts
@@ -840,6 +840,7 @@ export type ChannelsSurface =
 export type ChannelActionType =
   | "enter_space"
   | "leave_space"
+  | "toggle_channels"
   | "leave_feedback"
   | "nav_click"
   | "open_channel"
diff --git a/packages/shared/src/browser-tabs-schemas.ts b/packages/shared/src/browser-tabs-schemas.ts
index 2fceacaa96..c7f36d3329 100644
--- a/packages/shared/src/browser-tabs-schemas.ts
+++ b/packages/shared/src/browser-tabs-schemas.ts
@@ -25,6 +25,13 @@ export const browserTabSchema = z.object({
    * blank). Pairs with `channelId`: the two together identify a channel tab.
    */
   channelSection: z.string().nullable().default(null),
+  /**
+   * Top-level app page this tab shows (`inbox` / `agents` / `skills` /
+   * `mcp-servers` / `command-center` / `home`). Null for a canvas / task /
+   * channel / blank tab. These pages have no channel, task, or dashboard id, so
+   * this is what lets them be a real tab target (label + restore-on-refocus).
+   */
+  appView: z.string().nullable().default(null),
   /** Gap-spaced ordering key within a window. Reindexed on collision. */
   position: z.number(),
   /**
diff --git a/packages/shared/src/browser-tabs.test.ts b/packages/shared/src/browser-tabs.test.ts
index b65ca6f3f0..955f63a8a7 100644
--- a/packages/shared/src/browser-tabs.test.ts
+++ b/packages/shared/src/browser-tabs.test.ts
@@ -11,6 +11,7 @@ import {
   primaryWindowHasNoTabs,
   setTabOrder,
   setTabTarget,
+  setWindowActiveTab,
 } from "./browser-tabs";
 import type { TabsSnapshot } from "./browser-tabs-schemas";
 
@@ -269,6 +270,7 @@ describe("decideTabNavigation", () => {
       taskId: null,
       channelId: "c1",
       channelSection: null,
+      appView: null,
       stampTabId: "tab-a",
     });
   });
@@ -292,6 +294,7 @@ describe("decideTabNavigation", () => {
       taskId: null,
       channelId: "c1",
       channelSection: null,
+      appView: null,
       stampTabId: "tab-a",
     });
   });
@@ -309,6 +312,7 @@ describe("decideTabNavigation", () => {
       taskId: null,
       channelId: "c1",
       channelSection: null,
+      appView: null,
       stampTabId: null,
     });
   });
@@ -336,6 +340,7 @@ describe("decideTabNavigation", () => {
       taskId: null,
       channelId: "c1",
       channelSection: "artifacts",
+      appView: null,
       stampTabId: "tab-a",
     });
   });
@@ -353,6 +358,7 @@ describe("decideTabNavigation", () => {
       taskId: null,
       channelId: "c1",
       channelSection: "history",
+      appView: null,
       stampTabId: null,
     });
   });
@@ -398,6 +404,157 @@ describe("decideTabNavigation", () => {
   });
 });
 
+describe("decideTabNavigation: dedup against existing tabs (windowTabs)", () => {
+  const identity = {
+    dashboardId: null,
+    taskId: null,
+    channelId: null,
+    channelSection: null,
+    appView: null,
+  };
+
+  it("activates the existing tab instead of replacing the active tab's target (would-be duplicate)", () => {
+    // A rapid switch whose history stamp was lost arrives looking like an in-tab
+    // nav: active tab A, but the route identifies tab B (already open). Without
+    // the dedup this replaces A's target → two tabs on c2/artifacts. With it, B
+    // is focused.
+    expect(
+      decideTabNavigation({
+        historyTabId: "tab-a",
+        serverActiveTabId: "tab-a",
+        windowTabs: [
+          { id: "tab-a", ...identity, channelId: "c1" },
+          {
+            id: "tab-b",
+            ...identity,
+            channelId: "c2",
+            channelSection: "artifacts",
+          },
+        ],
+        activeTab: {
+          id: "tab-a",
+          dashboardId: null,
+          taskId: null,
+          channelId: "c1",
+        },
+        routeDashboardId: null,
+        routeTaskId: null,
+        routeChannelId: "c2",
+        routeChannelSection: "artifacts",
+      }),
+    ).toEqual({ type: "activate", tabId: "tab-b" });
+  });
+
+  it("activates an existing matching tab instead of opening a duplicate (no active tab)", () => {
+    expect(
+      decideTabNavigation({
+        historyTabId: null,
+        serverActiveTabId: null,
+        windowTabs: [{ id: "tab-b", ...identity, channelId: "c2" }],
+        activeTab: null,
+        routeDashboardId: null,
+        routeTaskId: null,
+        routeChannelId: "c2",
+      }),
+    ).toEqual({ type: "activate", tabId: "tab-b" });
+  });
+
+  it("does NOT jump when the active tab already shows the route, even if a duplicate exists", () => {
+    // Two tabs share an identity (a pre-existing duplicate). The active one
+    // already shows the route → stamp/noop. Jumping to the other duplicate
+    // would ping-pong between them forever (Maximum update depth exceeded).
+    expect(
+      decideTabNavigation({
+        historyTabId: "tab-x",
+        serverActiveTabId: "tab-x",
+        windowTabs: [
+          {
+            id: "tab-x",
+            ...identity,
+            channelId: "c1",
+            channelSection: "artifacts",
+          },
+          {
+            id: "tab-y",
+            ...identity,
+            channelId: "c1",
+            channelSection: "artifacts",
+          },
+        ],
+        activeTab: {
+          id: "tab-x",
+          dashboardId: null,
+          taskId: null,
+          channelId: "c1",
+          channelSection: "artifacts",
+        },
+        routeDashboardId: null,
+        routeTaskId: null,
+        routeChannelId: "c1",
+        routeChannelSection: "artifacts",
+      }),
+    ).toEqual({ type: "stamp", stampTabId: "tab-x" });
+  });
+
+  it("fills a blank active tab (fresh + tab) even when the route is open elsewhere", () => {
+    // Cmd+T lands the new blank tab on #me. If a #me tab is already open, the
+    // dedup must NOT steal the navigation to it — that would strand the blank
+    // tab forever. The blank active tab means "fill me".
+    expect(
+      decideTabNavigation({
+        historyTabId: "tab-blank",
+        serverActiveTabId: "tab-blank",
+        windowTabs: [
+          { id: "tab-blank", ...identity },
+          { id: "tab-me", ...identity, channelId: "me-ch" },
+        ],
+        activeTab: { id: "tab-blank", dashboardId: null, taskId: null },
+        routeDashboardId: null,
+        routeTaskId: null,
+        routeChannelId: "me-ch",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-blank",
+      dashboardId: null,
+      taskId: null,
+      channelId: "me-ch",
+      channelSection: null,
+      appView: null,
+      stampTabId: "tab-blank",
+    });
+  });
+
+  it("still replaces for a genuine in-tab nav to a target no other tab holds", () => {
+    expect(
+      decideTabNavigation({
+        historyTabId: "tab-a",
+        serverActiveTabId: "tab-a",
+        windowTabs: [{ id: "tab-a", ...identity, channelId: "c1" }],
+        activeTab: {
+          id: "tab-a",
+          dashboardId: null,
+          taskId: null,
+          channelId: "c1",
+        },
+        routeDashboardId: null,
+        routeTaskId: null,
+        routeChannelId: "c1",
+        routeChannelSection: "artifacts",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-a",
+      dashboardId: null,
+      taskId: null,
+      channelId: "c1",
+      channelSection: "artifacts",
+      appView: null,
+      stampTabId: "tab-a",
+    });
+  });
+});
+
 function openChannel(s: TabsSnapshot, windowId: string, channelId: string) {
   return openOrFocusTab(s, {
     windowId,
@@ -601,3 +758,557 @@ describe("primaryWindow", () => {
     expect(primaryWindow(s)?.id).toBe("w1");
   });
 });
+
+function openAppView(s: TabsSnapshot, windowId: string, appView: string) {
+  return openOrFocusTab(s, {
+    windowId,
+    dashboardId: null,
+    taskId: null,
+    channelId: null,
+    appView,
+    makeId,
+    now,
+  });
+}
+
+describe("setWindowActiveTab", () => {
+  it("focuses a tab that exists in the window", () => {
+    const a = open(snapshot(), "w1", "dash-a");
+    const b = open(a.snapshot, "w1", "dash-b");
+    const next = setWindowActiveTab(b.snapshot, "w1", a.tabId);
+    expect(next.windows[0].activeTabId).toBe(a.tabId);
+  });
+
+  it("clears focus with null (landing state)", () => {
+    const a = open(snapshot(), "w1", "dash-a");
+    const next = setWindowActiveTab(a.snapshot, "w1", null);
+    expect(next.windows[0].activeTabId).toBeNull();
+  });
+
+  it("ignores a tab id that does not exist (dead history tag)", () => {
+    const a = open(snapshot(), "w1", "dash-a");
+    const next = setWindowActiveTab(a.snapshot, "w1", "closed-long-ago");
+    expect(next).toBe(a.snapshot);
+    expect(next.windows[0].activeTabId).toBe(a.tabId);
+  });
+
+  it("ignores a tab that belongs to another window", () => {
+    const base = snapshot({
+      windows: [
+        { id: "w1", isPrimary: true, bounds: null, activeTabId: null },
+        { id: "w2", isPrimary: false, bounds: null, activeTabId: null },
+      ],
+    });
+    const foreign = open(base, "w2", "dash-z");
+    const next = setWindowActiveTab(foreign.snapshot, "w1", foreign.tabId);
+    expect(next).toBe(foreign.snapshot);
+    expect(next.windows[0].activeTabId).toBeNull();
+  });
+
+  it("ignores an unknown window", () => {
+    const a = open(snapshot(), "w1", "dash-a");
+    expect(setWindowActiveTab(a.snapshot, "w-nope", null)).toBe(a.snapshot);
+  });
+
+  it("keeps snapshot identity when the tab is already active", () => {
+    const a = open(snapshot(), "w1", "dash-a");
+    expect(setWindowActiveTab(a.snapshot, "w1", a.tabId)).toBe(a.snapshot);
+  });
+
+  it("a tab closed then re-activated by a stale id never dangles", () => {
+    // The persistence-bug shape: close a tab, then a back/forward replay tries
+    // to focus its id. The active tab must survive untouched — a dangling
+    // activeTabId makes every later navigation open a new tab.
+    const a = open(snapshot(), "w1", "dash-a");
+    const b = open(a.snapshot, "w1", "dash-b");
+    const closed = closeTab(b.snapshot, b.tabId).snapshot;
+    const next = setWindowActiveTab(closed, "w1", b.tabId);
+    expect(next).toBe(closed);
+    expect(next.windows[0].activeTabId).toBe(a.tabId);
+    expect(next.tabs.some((t) => t.id === next.windows[0].activeTabId)).toBe(
+      true,
+    );
+  });
+});
+
+describe("decideTabNavigation: dead history tags (back/forward over closed tabs)", () => {
+  const base = {
+    historyTabId: null as string | null,
+    serverActiveTabId: null as string | null,
+    activeTab: null as {
+      id: string;
+      dashboardId: string | null;
+      taskId: string | null;
+    } | null,
+    routeDashboardId: null as string | null,
+    routeTaskId: null as string | null,
+    routeChannelId: null as string | null,
+  };
+
+  it("does NOT activate a tagged tab that no longer exists — replays in the active tab", () => {
+    // Back onto an entry whose tab was closed: fall through to the route and
+    // replace the active tab, instead of persisting a dangling activeTabId.
+    expect(
+      decideTabNavigation({
+        ...base,
+        historyTabId: "tab-closed",
+        windowTabIds: ["tab-a", "tab-b"],
+        serverActiveTabId: "tab-a",
+        activeTab: { id: "tab-a", dashboardId: "old", taskId: null },
+        routeDashboardId: "from-history",
+        routeChannelId: "c1",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-a",
+      dashboardId: "from-history",
+      taskId: null,
+      channelId: "c1",
+      channelSection: null,
+      appView: null,
+      stampTabId: "tab-a",
+    });
+  });
+
+  it("opens a tab for a dead tag when nothing is active", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        historyTabId: "tab-closed",
+        windowTabIds: [],
+        serverActiveTabId: null,
+        routeDashboardId: "d1",
+        routeChannelId: "c1",
+      }),
+    ).toEqual({
+      type: "open",
+      dashboardId: "d1",
+      taskId: null,
+      channelId: "c1",
+      channelSection: null,
+      appView: null,
+      stampTabId: null,
+    });
+  });
+
+  it("re-stamps the entry with the live active tab when the route already matches", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        historyTabId: "tab-closed",
+        windowTabIds: ["tab-a"],
+        serverActiveTabId: "tab-a",
+        activeTab: { id: "tab-a", dashboardId: "same", taskId: null },
+        routeDashboardId: "same",
+        routeChannelId: null,
+      }),
+    ).toEqual({ type: "stamp", stampTabId: "tab-a" });
+  });
+
+  it("still activates a live tagged tab (windowTabIds provided)", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        historyTabId: "tab-b",
+        windowTabIds: ["tab-a", "tab-b"],
+        serverActiveTabId: "tab-a",
+      }),
+    ).toEqual({ type: "activate", tabId: "tab-b" });
+  });
+
+  it("trusts the tag when windowTabIds is omitted (legacy callers)", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        historyTabId: "tab-b",
+        serverActiveTabId: "tab-a",
+      }),
+    ).toEqual({ type: "activate", tabId: "tab-b" });
+  });
+});
+
+describe("decideTabNavigation: app-view tabs (Inbox, Command center, …)", () => {
+  const base = {
+    historyTabId: null as string | null,
+    serverActiveTabId: null as string | null,
+    activeTab: null,
+    routeDashboardId: null as string | null,
+    routeTaskId: null as string | null,
+    routeChannelId: null as string | null,
+  };
+
+  it("replaces the active tab in place on an untagged nav to an app view", () => {
+    // The reported bug: clicking a nav item (Inbox, Command center, …) must
+    // navigate IN the current tab, not open a new one.
+    expect(
+      decideTabNavigation({
+        ...base,
+        serverActiveTabId: "tab-a",
+        activeTab: {
+          id: "tab-a",
+          dashboardId: "dash-1",
+          taskId: null,
+        },
+        routeAppView: "inbox",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-a",
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      channelSection: null,
+      appView: "inbox",
+      stampTabId: "tab-a",
+    });
+  });
+
+  it("a blank tab absorbs the first app view clicked (new-tab page keeps the URL)", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        serverActiveTabId: "tab-blank",
+        activeTab: {
+          id: "tab-blank",
+          dashboardId: null,
+          taskId: null,
+        },
+        routeAppView: "command-center",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-blank",
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      channelSection: null,
+      appView: "command-center",
+      stampTabId: "tab-blank",
+    });
+  });
+
+  it("only stamps when the active tab already shows the app view", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        serverActiveTabId: "tab-a",
+        activeTab: {
+          id: "tab-a",
+          dashboardId: null,
+          taskId: null,
+          appView: "inbox",
+        },
+        routeAppView: "inbox",
+      }),
+    ).toEqual({ type: "stamp", stampTabId: "tab-a" });
+  });
+
+  it("switching between app views replaces in place (no duplicate tab)", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        serverActiveTabId: "tab-a",
+        activeTab: {
+          id: "tab-a",
+          dashboardId: null,
+          taskId: null,
+          appView: "inbox",
+        },
+        routeAppView: "skills",
+      }),
+    ).toEqual({
+      type: "replace",
+      tabId: "tab-a",
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      channelSection: null,
+      appView: "skills",
+      stampTabId: "tab-a",
+    });
+  });
+
+  it("opens a tab for an app view when nothing is active", () => {
+    expect(
+      decideTabNavigation({
+        ...base,
+        routeAppView: "agents",
+      }),
+    ).toEqual({
+      type: "open",
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      channelSection: null,
+      appView: "agents",
+      stampTabId: null,
+    });
+  });
+});
+
+describe("openOrFocusTab: app-view identity", () => {
+  it("dedups the same app view instead of opening a second tab", () => {
+    const first = openAppView(snapshot(), "w1", "inbox");
+    const second = openAppView(first.snapshot, "w1", "inbox");
+    expect(second.opened).toBe(false);
+    expect(second.tabId).toBe(first.tabId);
+    expect(second.snapshot.tabs).toHaveLength(1);
+  });
+
+  it("treats different app views as distinct tabs", () => {
+    const inbox = openAppView(snapshot(), "w1", "inbox");
+    const skills = openAppView(inbox.snapshot, "w1", "skills");
+    expect(skills.opened).toBe(true);
+    expect(skills.snapshot.tabs).toHaveLength(2);
+  });
+
+  it("an app-view tab and a blank tab are distinct identities", () => {
+    const blank = newBlankTab(snapshot(), { windowId: "w1", makeId, now });
+    const inbox = openAppView(blank.snapshot, "w1", "inbox");
+    expect(inbox.opened).toBe(true);
+    expect(inbox.snapshot.tabs).toHaveLength(2);
+  });
+});
+
+describe("setTabTarget: app views", () => {
+  it("points a blank tab at an app view and back to blank", () => {
+    const blank = newBlankTab(snapshot(), { windowId: "w1", makeId, now });
+    const withView = setTabTarget(blank.snapshot, {
+      tabId: blank.tabId,
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      appView: "command-center",
+      now,
+    });
+    expect(withView.tabs[0].appView).toBe("command-center");
+    expect(activeTabIsBlank(withView)).toBe(false);
+
+    const backToBlank = setTabTarget(withView, {
+      tabId: blank.tabId,
+      dashboardId: null,
+      taskId: null,
+      channelId: null,
+      now,
+    });
+    expect(backToBlank.tabs[0].appView).toBeNull();
+    expect(activeTabIsBlank(backToBlank)).toBe(true);
+  });
+
+  it("clears the app view when the tab navigates to a canvas", () => {
+    const inbox = openAppView(snapshot(), "w1", "inbox");
+    const next = setTabTarget(inbox.snapshot, {
+      tabId: inbox.tabId,
+      dashboardId: "dash-1",
+      taskId: null,
+      channelId: "c1",
+      now,
+    });
+    const tab = next.tabs.find((t) => t.id === inbox.tabId);
+    expect(tab?.appView).toBeNull();
+    expect(tab?.dashboardId).toBe("dash-1");
+  });
+});
+
+describe("regression: the reported tab-persistence bugs", () => {
+  // Three tabs; the third is active (this is the persisted boot state in the
+  // report: "my third tab is taking the URL of any URL I try on tab 1/2").
+  function threeTabs() {
+    const t1 = open(snapshot(), "w1", "dash-1");
+    const t2 = open(t1.snapshot, "w1", "dash-2");
+    const t3 = open(t2.snapshot, "w1", "dash-3");
+    return { s: t3.snapshot, ids: [t1.tabId, t2.tabId, t3.tabId] as const };
+  }
+
+  it("a navigation after a tab switch writes to the switched tab, not the previous one", () => {
+    const { s, ids } = threeTabs();
+    const [t1, , t3] = ids;
+    expect(s.windows[0].activeTabId).toBe(t3);
+
+    // User clicks tab 1 in the strip → the entry is tagged t1 → activate.
+    const clickTab1 = decideTabNavigation({
+      historyTabId: t1,
+      windowTabIds: ids,
+      serverActiveTabId: t3,
+      activeTab: null,
+      routeDashboardId: "dash-1",
+      routeTaskId: null,
+      routeChannelId: "c1",
+    });
+    expect(clickTab1).toEqual({ type: "activate", tabId: t1 });
+
+    // The strip applies the focus to its mirror synchronously (the fix): the
+    // next decision must see t1 active, NOT the stale t3.
+    const afterSwitch = setWindowActiveTab(s, "w1", t1);
+    expect(afterSwitch.windows[0].activeTabId).toBe(t1);
+
+    // User clicks a nav item (untagged navigation). It must replace t1.
+    const activeTab = afterSwitch.tabs.find((t) => t.id === t1);
+    const navToInbox = decideTabNavigation({
+      historyTabId: null,
+      windowTabIds: ids,
+      serverActiveTabId: t1,
+      activeTab: activeTab
+        ? {
+            id: activeTab.id,
+            dashboardId: activeTab.dashboardId,
+            taskId: activeTab.taskId,
+            channelId: activeTab.channelId,
+            channelSection: activeTab.channelSection,
+            appView: activeTab.appView,
+          }
+        : null,
+      routeDashboardId: null,
+      routeTaskId: null,
+      routeChannelId: null,
+      routeAppView: "inbox",
+    });
+    expect(navToInbox.type).toBe("replace");
+    if (navToInbox.type !== "replace") throw new Error("unreachable");
+    expect(navToInbox.tabId).toBe(t1);
+
+    // Apply the write: only t1 changed; t3 keeps its canvas.
+    const applied = setTabTarget(afterSwitch, {
+      tabId: navToInbox.tabId,
+      dashboardId: navToInbox.dashboardId,
+      taskId: navToInbox.taskId,
+      channelId: navToInbox.channelId,
+      channelSection: navToInbox.channelSection,
+      appView: navToInbox.appView,
+      now,
+    });
+    expect(applied.tabs.find((t) => t.id === t1)?.appView).toBe("inbox");
+    expect(applied.tabs.find((t) => t.id === t3)?.dashboardId).toBe("dash-3");
+    expect(applied.tabs.find((t) => t.id === ids[1])?.dashboardId).toBe(
+      "dash-2",
+    );
+  });
+
+  it("switching tabs never rewrites the target tab's contents", () => {
+    const { s, ids } = threeTabs();
+    const [t1, t2] = ids;
+    // Switch t3 → t2 → t1: pure focus changes.
+    let cur = setWindowActiveTab(s, "w1", t2);
+    cur = setWindowActiveTab(cur, "w1", t1);
+    expect(cur.tabs.find((t) => t.id === t1)?.dashboardId).toBe("dash-1");
+    expect(cur.tabs.find((t) => t.id === t2)?.dashboardId).toBe("dash-2");
+    expect(cur.tabs.find((t) => t.id === ids[2])?.dashboardId).toBe("dash-3");
+    // Tab records are untouched by focus changes — same array identity.
+    expect(cur.tabs).toBe(s.tabs);
+  });
+
+  it("back over a closed tab's entry cannot dangle focus and flood new tabs", () => {
+    const { s, ids } = threeTabs();
+    const [t1, , t3] = ids;
+    // Close t1, then replay a history entry tagged with it.
+    const closed = closeTabs(s, [t1]);
+    const live = closed.tabs.map((t) => t.id);
+    const decision = decideTabNavigation({
+      historyTabId: t1,
+      windowTabIds: live,
+      serverActiveTabId: closed.windows[0].activeTabId,
+      activeTab: (() => {
+        const active = closed.tabs.find(
+          (t) => t.id === closed.windows[0].activeTabId,
+        );
+        return active
+          ? {
+              id: active.id,
+              dashboardId: active.dashboardId,
+              taskId: active.taskId,
+              channelId: active.channelId,
+              channelSection: active.channelSection,
+              appView: active.appView,
+            }
+          : null;
+      })(),
+      routeDashboardId: "dash-1",
+      routeTaskId: null,
+      routeChannelId: "c1",
+    });
+    // Never "activate" the dead id — the route replays in the active tab.
+    expect(decision.type).toBe("replace");
+    if (decision.type !== "replace") throw new Error("unreachable");
+    expect(live).toContain(decision.tabId);
+    expect(decision.tabId).toBe(t3);
+
+    // And even a hostile setActiveTab with the dead id is a validated no-op.
+    expect(setWindowActiveTab(closed, "w1", t1)).toBe(closed);
+  });
+
+  it("a new blank tab stays blank until the user navigates, then keeps that URL", () => {
+    const withTabs = open(snapshot(), "w1", "dash-1");
+    const blank = newBlankTab(withTabs.snapshot, {
+      windowId: "w1",
+      makeId,
+      now,
+    });
+    expect(activeTabIsBlank(blank.snapshot)).toBe(true);
+
+    // The landing route is a noop — nothing may rewrite the blank tab.
+    const onLanding = decideTabNavigation({
+      historyTabId: blank.tabId,
+      windowTabIds: blank.snapshot.tabs.map((t) => t.id),
+      serverActiveTabId: blank.tabId,
+      activeTab: {
+        id: blank.tabId,
+        dashboardId: null,
+        taskId: null,
+        channelId: null,
+        channelSection: null,
+        appView: null,
+      },
+      routeDashboardId: null,
+      routeTaskId: null,
+      routeChannelId: null,
+      routeAppView: null,
+    });
+    expect(onLanding).toEqual({ type: "noop" });
+
+    // First click (Command center) replaces the blank tab in place…
+    const firstNav = decideTabNavigation({
+      historyTabId: blank.tabId,
+      windowTabIds: blank.snapshot.tabs.map((t) => t.id),
+      serverActiveTabId: blank.tabId,
+      activeTab: {
+        id: blank.tabId,
+        dashboardId: null,
+        taskId: null,
+        channelId: null,
+        channelSection: null,
+        appView: null,
+      },
+      routeDashboardId: null,
+      routeTaskId: null,
+      routeChannelId: null,
+      routeAppView: "command-center",
+    });
+    expect(firstNav.type).toBe("replace");
+    if (firstNav.type !== "replace") throw new Error("unreachable");
+    expect(firstNav.tabId).toBe(blank.tabId);
+
+    const applied = setTabTarget(blank.snapshot, {
+      tabId: firstNav.tabId,
+      dashboardId: firstNav.dashboardId,
+      taskId: firstNav.taskId,
+      channelId: firstNav.channelId,
+      channelSection: firstNav.channelSection,
+      appView: firstNav.appView,
+      now,
+    });
+    // …and the other tab keeps its canvas untouched.
+    expect(applied.tabs.find((t) => t.id === blank.tabId)?.appView).toBe(
+      "command-center",
+    );
+    expect(applied.tabs.find((t) => t.id === withTabs.tabId)?.dashboardId).toBe(
+      "dash-1",
+    );
+  });
+});
+
+describe("activeTabIsBlank: app views", () => {
+  it("is false when the active tab shows an app view", () => {
+    const t = openAppView(snapshot(), "w1", "inbox");
+    expect(activeTabIsBlank(t.snapshot)).toBe(false);
+  });
+});
diff --git a/packages/shared/src/browser-tabs.ts b/packages/shared/src/browser-tabs.ts
index d7248a74eb..4d2b0d61b9 100644
--- a/packages/shared/src/browser-tabs.ts
+++ b/packages/shared/src/browser-tabs.ts
@@ -44,7 +44,11 @@ export function activeTabIsBlank(snapshot: TabsSnapshot): boolean {
   if (!w?.activeTabId) return false;
   const t = snapshot.tabs.find((x) => x.id === w.activeTabId);
   return (
-    !!t && t.dashboardId == null && t.taskId == null && t.channelId == null
+    !!t &&
+    t.dashboardId == null &&
+    t.taskId == null &&
+    t.channelId == null &&
+    t.appView == null
   );
 }
 
@@ -72,6 +76,28 @@ function setActiveTab(
   };
 }
 
+/**
+ * Focus a tab in a window, validating the target: the tab must exist and live
+ * in that window, otherwise the snapshot is returned unchanged. A `null` tabId
+ * clears focus (the landing state). This is the persistence-safe primitive —
+ * history entries can carry ids of tabs closed since (back/forward replay), and
+ * blindly persisting such an id leaves the window with a dangling activeTabId,
+ * after which every navigation looks like "no active tab" and opens a new tab.
+ */
+export function setWindowActiveTab(
+  snapshot: TabsSnapshot,
+  windowId: string,
+  tabId: string | null,
+): TabsSnapshot {
+  if (tabId !== null) {
+    const tab = snapshot.tabs.find((t) => t.id === tabId);
+    if (!tab || tab.windowId !== windowId) return snapshot;
+  }
+  const window = snapshot.windows.find((w) => w.id === windowId);
+  if (!window || window.activeTabId === tabId) return snapshot;
+  return setActiveTab(snapshot, windowId, tabId);
+}
+
 /** What a tab points at: a canvas, a task, or neither (blank). */
 export type TabTarget = {
   dashboardId: string | null;
@@ -89,6 +115,7 @@ export type TabIdentity = {
   taskId: string | null;
   channelId: string | null;
   channelSection: string | null;
+  appView: string | null;
 };
 
 function sameIdentity(a: TabIdentity, b: TabIdentity): boolean {
@@ -96,7 +123,8 @@ function sameIdentity(a: TabIdentity, b: TabIdentity): boolean {
     a.dashboardId === b.dashboardId &&
     a.taskId === b.taskId &&
     a.channelId === b.channelId &&
-    a.channelSection === b.channelSection
+    a.channelSection === b.channelSection &&
+    a.appView === b.appView
   );
 }
 
@@ -111,16 +139,24 @@ export function openOrFocusTab(
     windowId: string;
     channelId: string | null;
     channelSection?: string | null;
+    appView?: string | null;
     makeId: IdFactory;
     now: Clock;
   },
 ): OpenTabResult {
   const { windowId, dashboardId, taskId, channelId, makeId, now } = input;
   const channelSection = input.channelSection ?? null;
+  const appView = input.appView ?? null;
   const existing = snapshot.tabs.find(
     (t) =>
       t.windowId === windowId &&
-      sameIdentity(t, { dashboardId, taskId, channelId, channelSection }),
+      sameIdentity(t, {
+        dashboardId,
+        taskId,
+        channelId,
+        channelSection,
+        appView,
+      }),
   );
   if (existing) {
     const ts = now();
@@ -143,6 +179,7 @@ export function openOrFocusTab(
     taskId,
     channelId,
     channelSection,
+    appView,
     makeId,
     now,
   });
@@ -154,6 +191,7 @@ function appendTab(
     windowId: string;
     channelId: string | null;
     channelSection?: string | null;
+    appView?: string | null;
     makeId: IdFactory;
     now: Clock;
   },
@@ -169,6 +207,7 @@ function appendTab(
     taskId,
     channelId,
     channelSection: input.channelSection ?? null,
+    appView: input.appView ?? null,
     position: lastPos + POSITION_GAP,
     scrollState: null,
     createdAt: ts,
@@ -212,6 +251,7 @@ export function setTabTarget(
     tabId: string;
     channelId: string | null;
     channelSection?: string | null;
+    appView?: string | null;
     now: Clock;
   },
 ): TabsSnapshot {
@@ -228,6 +268,7 @@ export function setTabTarget(
             taskId: input.taskId,
             channelId: input.channelId,
             channelSection: input.channelSection ?? null,
+            appView: input.appView ?? null,
             lastActiveAt: ts,
           }
         : t,
@@ -391,6 +432,7 @@ export type TabNavDecision =
       taskId: string | null;
       channelId: string | null;
       channelSection: string | null;
+      appView: string | null;
       stampTabId: string | null;
     }
   | {
@@ -399,6 +441,7 @@ export type TabNavDecision =
       taskId: string | null;
       channelId: string | null;
       channelSection: string | null;
+      appView: string | null;
       stampTabId: string | null;
     }
   | { type: "stamp"; stampTabId: string }
@@ -407,6 +450,24 @@ export type TabNavDecision =
 export function decideTabNavigation(input: {
   /** tabId carried in the current history entry, if any. */
   historyTabId: string | null;
+  /**
+   * Ids of the tabs that currently exist in this window. A history entry can
+   * be tagged with a tab that has since been closed (back/forward replays the
+   * entry); such a dead tag must NOT activate — it falls through and the route
+   * decides (in-tab replace / open / stamp), which also re-stamps the entry
+   * with a live tab. When omitted, tags are trusted (legacy behaviour).
+   */
+  windowTabIds?: readonly string[];
+  /**
+   * The window's tabs with their identities. When a navigation's route matches
+   * an existing tab that isn't the active one, we activate that tab instead of
+   * replacing the active tab's target (which would duplicate it) or opening a
+   * second copy. This also self-heals a rapid tab switch whose history stamp
+   * was lost: it arrives looking like an in-tab nav, but the route still
+   * identifies the intended tab, so we focus it rather than corrupt the active
+   * tab. When omitted, this dedup is skipped (legacy behaviour).
+   */
+  windowTabs?: readonly (TabIdentity & { id: string })[];
   /** The window's active tab id from the server snapshot (lags history). */
   serverActiveTabId: string | null;
   /** The active tab record, if one exists. */
@@ -416,6 +477,7 @@ export function decideTabNavigation(input: {
     taskId: string | null;
     channelId?: string | null;
     channelSection?: string | null;
+    appView?: string | null;
   } | null;
   /** Canvas in the current route, if any. */
   routeDashboardId: string | null;
@@ -424,6 +486,8 @@ export function decideTabNavigation(input: {
   routeChannelId: string | null;
   /** Channel sub-section in the current route, if any. */
   routeChannelSection?: string | null;
+  /** Top-level app page in the current route, if any. */
+  routeAppView?: string | null;
 }): TabNavDecision {
   const {
     historyTabId,
@@ -434,13 +498,19 @@ export function decideTabNavigation(input: {
     routeChannelId,
   } = input;
   const routeChannelSection = input.routeChannelSection ?? null;
+  const routeAppView = input.routeAppView ?? null;
 
   // Tagged entry for a DIFFERENT tab → a tab switch or a back/forward replay.
-  // Focus it (this is how "back returns to the previous tab" resolves). When
-  // the tag equals the active tab we must NOT stop here: a plain navigation
-  // (e.g. the sidebar) inherits the active tab's tag, so an in-tab nav arrives
-  // tagged with the active tab — fall through and decide from the route.
-  if (historyTabId && historyTabId !== serverActiveTabId) {
+  // Focus it (this is how "back returns to the previous tab" resolves). Two
+  // guards: (1) the tagged tab must still exist — back/forward can replay an
+  // entry whose tab was closed, and activating a dead id persists a dangling
+  // activeTabId (every nav then opens a new tab); (2) when the tag equals the
+  // active tab we must NOT stop here: an in-tab nav can arrive tagged with the
+  // active tab — fall through and decide from the route.
+  const historyTabIsLive =
+    !!historyTabId &&
+    (input.windowTabIds ? input.windowTabIds.includes(historyTabId) : true);
+  if (historyTabId && historyTabIsLive && historyTabId !== serverActiveTabId) {
     return { type: "activate", tabId: historyTabId };
   }
 
@@ -452,23 +522,51 @@ export function decideTabNavigation(input: {
     taskId: routeTaskId,
     channelId: routeChannelId,
     channelSection: routeChannelSection,
+    appView: routeAppView,
   };
-  if (!routeDashboardId && !routeTaskId && !routeChannelId) {
+  if (!routeDashboardId && !routeTaskId && !routeChannelId && !routeAppView) {
     return { type: "noop" };
   }
 
-  if (
-    activeTab &&
-    !sameIdentity(
+  const activeMatchesRoute =
+    !!activeTab &&
+    sameIdentity(
       {
         dashboardId: activeTab.dashboardId,
         taskId: activeTab.taskId,
         channelId: activeTab.channelId ?? null,
         channelSection: activeTab.channelSection ?? null,
+        appView: activeTab.appView ?? null,
       },
       routeIdentity,
-    )
-  ) {
+    );
+
+  // A blank active tab is a fresh `+` tab waiting for its first target: the
+  // navigation is "fill me", never a switch — so the dedup below must not
+  // steal it (activating another tab would strand the blank forever).
+  const activeIsBlank =
+    !!activeTab &&
+    activeTab.dashboardId == null &&
+    activeTab.taskId == null &&
+    (activeTab.channelId ?? null) == null &&
+    (activeTab.appView ?? null) == null;
+
+  // The route already lives in another tab → focus it instead of replacing the
+  // active tab's target (which would leave two tabs on the same identity) or
+  // opening a duplicate. Also recovers a rapid switch whose history tag was
+  // lost: the intended tab is still identified by the route. Only when the
+  // active tab does NOT already show the route — otherwise, if a duplicate tab
+  // already exists, we'd bounce between the two identical tabs forever.
+  if (!activeMatchesRoute && !activeIsBlank) {
+    const existingMatch = input.windowTabs?.find(
+      (t) => t.id !== activeTab?.id && sameIdentity(t, routeIdentity),
+    );
+    if (existingMatch) {
+      return { type: "activate", tabId: existingMatch.id };
+    }
+  }
+
+  if (activeTab && !activeMatchesRoute) {
     return {
       type: "replace",
       tabId: activeTab.id,
@@ -476,6 +574,7 @@ export function decideTabNavigation(input: {
       taskId: routeTaskId,
       channelId: routeChannelId,
       channelSection: routeChannelSection,
+      appView: routeAppView,
       stampTabId: serverActiveTabId,
     };
   }
@@ -486,6 +585,7 @@ export function decideTabNavigation(input: {
       taskId: routeTaskId,
       channelId: routeChannelId,
       channelSection: routeChannelSection,
+      appView: routeAppView,
       stampTabId: serverActiveTabId,
     };
   }
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index c37a45f941..dea20119dd 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -30,6 +30,7 @@ export {
   primaryWindowHasNoTabs,
   setTabOrder,
   setTabTarget,
+  setWindowActiveTab,
   type TabNavDecision,
   type TabTarget,
 } from "./browser-tabs";
diff --git a/packages/ui/src/features/browser-tabs/AGENTS.md b/packages/ui/src/features/browser-tabs/AGENTS.md
index be8706feb2..46e3681401 100644
--- a/packages/ui/src/features/browser-tabs/AGENTS.md
+++ b/packages/ui/src/features/browser-tabs/AGENTS.md
@@ -50,8 +50,17 @@ The feature is deliberately split so the rules are portable and testable:
 - **this folder (`@posthog/ui`)** — `BrowserTabStrip` (container; mounted in the
   Channels title bar in `router/routes/__root.tsx`), `TabStrip` (presentational),
   `BlankTabView` (the new-tab placeholder), `TaskTabIcon` (sidebar-parity status
-  icon for task tabs), the client facade, and the boot contribution that seeds +
-  subscribes the store.
+  icon for task tabs), the client facade, the boot contribution that seeds +
+  subscribes the store, and **`tabsSync.ts` — the local-first sync policy**:
+  every operation applies its shared pure transform to the renderer mirror
+  synchronously (interactions are instant; new tabs mint their id client-side
+  so no navigation ever waits on IPC), server writes are background persistence,
+  and while any write is in flight remote snapshot pushes are dropped because
+  they may predate newer local state. If a push was dropped, the renderer
+  re-fetches the authoritative snapshot after the write batch settles so a real
+  mutation from another window is retained; otherwise the last settling write
+  applies its returned snapshot. This makes rapid tab switching race-free
+  without losing cross-window updates.
 
 One source of truth: any window mutates → service writes sqlite + emits → every
 window's store updates. No window talks to another directly. The same shape ports
@@ -192,11 +201,14 @@ differ. Desktop ships first.
   index for a couple of frames **after** the URL has already left `/website`
   (the `__root` Outlet un-suppresses on the way to `/website/$channelId` before
   the matched leaf settles), and that stale render must not redirect.
-- **Closing the last tab writes the snapshot synchronously.** `handleClose`
-  calls `browserTabsStore.setSnapshot(next)` before navigating to `/website`.
-  The store otherwise lags a subscription round-trip, so the index would render
-  against the still-has-tabs snapshot and redirect (re-opening a tab) before the
-  empty strip arrives.
+- **All writes are local-first (`tabsSync.ts`).** Close/open/new/reorder apply
+  their shared transform to the mirror and navigate in the same tick; the
+  `/website` index therefore always renders against post-mutation state and
+  can't redirect (re-opening a tab) mid-flight. Mutation results and
+  subscription pushes are never applied while writes are in flight — only the
+  last settle reconciles. Don't add a mutation `onSuccess` that calls
+  `setSnapshot`; route new writes through `applyLocalTransform` +
+  `persistWrite`.
 
 ## Testing
 
diff --git a/packages/ui/src/features/browser-tabs/BrowserTabStrip.tsx b/packages/ui/src/features/browser-tabs/BrowserTabStrip.tsx
index e42714f57f..072256de4a 100644
--- a/packages/ui/src/features/browser-tabs/BrowserTabStrip.tsx
+++ b/packages/ui/src/features/browser-tabs/BrowserTabStrip.tsx
@@ -1,20 +1,46 @@
-import { HashIcon } from "@phosphor-icons/react";
-import { browserTabsStore } from "@posthog/core/browser-tabs/browserTabsStore";
+import {
+  BrainIcon,
+  HashIcon,
+  HouseIcon,
+  PlugsConnectedIcon,
+  RobotIcon,
+  SquaresFourIcon,
+  TrayIcon,
+} from "@phosphor-icons/react";
 import { useHostTRPC } from "@posthog/host-router/react";
 import {
+  closeTab as closeTabLocal,
+  closeTabs as closeTabsLocal,
   decideTabNavigation,
+  newBlankTab as newBlankTabLocal,
+  openOrFocusTab as openOrFocusLocal,
+  PROJECT_BLUEBIRD_FLAG,
+  primaryWindow,
   setTabOrder,
+  setTabTarget as setTabTargetLocal,
+  setWindowActiveTab,
   type TabsSnapshot,
 } from "@posthog/shared";
 import { channelSectionFor } from "@posthog/ui/features/canvas/channelSections";
 import { iconForTemplate } from "@posthog/ui/features/canvas/components/canvasTemplateIcon";
-import { useChannels } from "@posthog/ui/features/canvas/hooks/useChannels";
+import {
+  type Channel,
+  useChannelMutations,
+  useChannels,
+} from "@posthog/ui/features/canvas/hooks/useChannels";
 import {
   useDashboard,
   useDashboards,
 } from "@posthog/ui/features/canvas/hooks/useDashboards";
+import { PERSONAL_CHANNEL_NAME } from "@posthog/ui/features/canvas/hooks/useTaskChannels";
+import { SHORTCUTS } from "@posthog/ui/features/command/keyboard-shortcuts";
+import { useFeatureFlag } from "@posthog/ui/features/feature-flags/useFeatureFlag";
+import { usePanelLayoutStore } from "@posthog/ui/features/panels/panelLayoutStore";
+import { getLeafPanel } from "@posthog/ui/features/panels/panelStoreHelpers";
+import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
 import { taskDetailQuery } from "@posthog/ui/features/tasks/queries";
 import { useTasks } from "@posthog/ui/features/tasks/useTasks";
+import { useAppView } from "@posthog/ui/router/useAppView";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import {
   useNavigate,
@@ -22,7 +48,8 @@ import {
   useRouter,
   useRouterState,
 } from "@tanstack/react-router";
-import { useEffect, useMemo } from "react";
+import { type ReactNode, useEffect, useMemo } from "react";
+import { useHotkeys } from "react-hotkeys-hook";
 import {
   frontOfUnpinnedOrder,
   partitionPinnedFirst,
@@ -32,6 +59,7 @@ import { usePinnedTabsStore } from "./pinnedTabsStore";
 import { TabStrip, type TabView } from "./TabStrip";
 import { TaskTabIcon } from "./TaskTabIcon";
 import { useTabReorderStore } from "./tabReorderStore";
+import { applyLocalTransform, persistWrite, readMirror } from "./tabsSync";
 import { useTabsSnapshot } from "./useBrowserTabs";
 
 /** The active tab id is carried in router history state so back/forward replay
@@ -51,6 +79,13 @@ declare module "@tanstack/history" {
 const canvasInfo = new Map<string, { name: string; templateId: string }>();
 const taskInfo = new Map<string, string>();
 
+// Dedupe concurrent #me provisioning. The folder-creation endpoint isn't
+// server-side idempotent, and the new-tab path is on Cmd+T (trivially
+// double-fired/held) — so two landings racing before the first create's cache
+// update lands could each create a "me" folder. One in-flight create is shared
+// across callers until it settles.
+let personalChannelInFlight: Promise<Channel> | null = null;
+
 /** Bounded insert (most-recent kept) so the caches don't grow unbounded over a
  * long session. */
 const MAX_CACHE_ENTRIES = 200;
@@ -63,8 +98,19 @@ function remember<V>(map: Map<string, V>, key: string, value: V): void {
   }
 }
 
-function primaryWindow(snapshot: TabsSnapshot) {
-  return snapshot.windows.find((w) => w.isPrimary) ?? snapshot.windows[0];
+// True when the open task's focused editor panel has a closeable active tab.
+// Cmd+W is inner-first: it closes that editor tab (handled by
+// usePanelKeyboardShortcuts) before it closes the browser tab.
+function taskHasCloseableEditorTab(taskId: string | undefined): boolean {
+  if (!taskId) return false;
+  const layout = usePanelLayoutStore.getState().getLayout(taskId);
+  const panelId = layout?.focusedPanelId;
+  if (!panelId || !layout?.panelTree) return false;
+  const panel = getLeafPanel(layout.panelTree, panelId);
+  const activeTab = panel?.content.tabs.find(
+    (t) => t.id === panel.content.activeTabId,
+  );
+  return !!activeTab && activeTab.closeable !== false;
 }
 
 type TabRef = {
@@ -73,8 +119,39 @@ type TabRef = {
   taskId: string | null;
   channelId: string | null;
   channelSection: string | null;
+  appView: string | null;
+};
+
+// The top-level app pages that can be a tab. Keyed by useAppView's view.type;
+// each maps to its canonical route (a task/canvas/channel tab has its own
+// route, these don't) plus the strip's label + icon.
+type AppView =
+  | "home"
+  | "inbox"
+  | "agents"
+  | "skills"
+  | "mcp-servers"
+  | "command-center";
+
+const APP_VIEW_META: Record<AppView, { label: string; icon: ReactNode }> = {
+  home: { label: "Home", icon: <HouseIcon size={14} /> },
+  inbox: { label: "Inbox", icon: <TrayIcon size={14} /> },
+  agents: { label: "Agents", icon: <RobotIcon size={14} /> },
+  skills: { label: "Skills", icon: <BrainIcon size={14} /> },
+  "mcp-servers": {
+    label: "MCP servers",
+    icon: <PlugsConnectedIcon size={14} />,
+  },
+  "command-center": {
+    label: "Command center",
+    icon: <SquaresFourIcon size={14} />,
+  },
 };
 
+function isAppView(value: string): value is AppView {
+  return value in APP_VIEW_META;
+}
+
 export function BrowserTabStrip() {
   const snapshot = useTabsSnapshot();
   const navigate = useNavigate();
@@ -89,8 +166,28 @@ export function BrowserTabStrip() {
     select: (s) => s.location.state.tabId,
   });
   const pathname = useRouterState({ select: (s) => s.location.pathname });
+  // Tabs work in both spaces: channel-scoped tabs live under /website, while a
+  // plain task tab (no channel) belongs to the Code experience. The space
+  // decides where a task/blank tab navigates.
+  const inChannels = pathname.startsWith("/website");
+  // Top-level app pages (Inbox, Agents, Skills, MCP servers, Command Center,
+  // Home) are tab targets too. useAppView normalizes both the /code routes and
+  // their /website mirrors to the same view.type, so a tab survives either space.
+  const view = useAppView();
+  const routeAppView: AppView | null = isAppView(view.type) ? view.type : null;
 
   const { channels } = useChannels();
+  const { createChannel } = useChannelMutations();
+  // Whether the channels surface is live — the same gate the sidebar uses. This
+  // (not the current route) decides a new tab's default: with channels on a
+  // fresh tab opens #me, otherwise the Code new-task screen. Keying off the
+  // route would leave the behaviour stale right after the toggle flips.
+  const bluebirdEnabled = useFeatureFlag(
+    PROJECT_BLUEBIRD_FLAG,
+    import.meta.env.DEV,
+  );
+  const channelsEnabled =
+    useSidebarStore((s) => s.channelsEnabled) && bluebirdEnabled;
 
   // The active channel sub-section (artifacts/history/context) is the
   // route segment after the channelId. Null when on the channel home or a
@@ -101,6 +198,12 @@ export function BrowserTabStrip() {
     return channelSectionFor(seg)?.key ?? null;
   }, [pathname, params.channelId]);
 
+  // Local-first sync (see tabsSync.ts): every operation applies its shared
+  // pure transform to the mirror synchronously via applyLocalTransform, then
+  // persists in the background via persistWrite. The mutations below are pure
+  // transport — their returned snapshots are handled by persistWrite's
+  // last-settle reconcile, never applied directly, so a stale echo can't
+  // rewind the mirror mid-interaction.
   const openOrFocus = useMutation(
     trpc.browserTabs.openOrFocus.mutationOptions(),
   );
@@ -132,13 +235,16 @@ export function BrowserTabStrip() {
 
   const win = primaryWindow(snapshot);
   const windowId = win?.id;
-  const activeTab = win?.activeTabId
-    ? snapshot.tabs.find((t) => t.id === win.activeTabId)
-    : undefined;
   // The history state flips the instant you navigate, while the server snapshot
   // round-trips — so prefer it for "which tab is active" to avoid a one-step lag
-  // in the highlight and the name.
-  const activeTabId = historyTabId ?? win?.activeTabId ?? null;
+  // in the highlight and the name. Validate it against the live tab list first:
+  // back/forward can replay an entry tagged with a since-closed tab, and a dead
+  // id here would blank the strip highlight and point Cmd+W at a tab that no
+  // longer exists (the navigation effect heals the tag, but asynchronously).
+  const historyTabIsLive =
+    !!historyTabId && snapshot.tabs.some((t) => t.id === historyTabId);
+  const activeTabId =
+    (historyTabIsLive ? historyTabId : null) ?? win?.activeTabId ?? null;
 
   // Names feed the tab labels. The channel canvas list + all-tasks list cover
   // most tabs; a direct fetch of the *current route's* canvas/task (warm cache
@@ -176,71 +282,150 @@ export function BrowserTabStrip() {
   // decideTabNavigation) and apply it: focus a tab, replace the active tab's
   // target in place, open a tab, and/or stamp the history entry with the tab it
   // belongs to so back/forward can replay it.
+  //
+  // Keyed on the LOCATION only — the route is the command stream; the mirror is
+  // state this effect reconciles against, read fresh via readMirror() rather
+  // than subscribed to. Running on mirror changes is actively wrong under
+  // local-first sync: a handler moves the mirror BEFORE it navigates (e.g. the
+  // + tab appends and focuses a blank tab), and an effect run in that gap sees
+  // the OLD location's tag disagree with the new mirror focus and "activates"
+  // the stale tab — yanking focus back and mis-targeting the follow-up
+  // navigation as an in-tab replace of the wrong tab.
   useEffect(() => {
     if (!windowId) return;
     const stamp = (tabId: string) => {
       const loc = router.history.location;
+      // Already tagged — skip the replace so history entries and router
+      // subscribers don't churn.
+      if ((loc.state as { tabId?: string }).tabId === tabId) return;
       // Use the full href (always a string); reconstructing from pathname +
       // search crashes because search is parsed to an object at runtime.
       router.history.replace(loc.href, { ...(loc.state as object), tabId });
     };
+    const mirror = readMirror();
+    const mirrorWin = primaryWindow(mirror);
+    const mirrorTabs = mirror.tabs.filter((t) => t.windowId === windowId);
+    const mirrorActive = mirrorWin?.activeTabId
+      ? mirrorTabs.find((t) => t.id === mirrorWin.activeTabId)
+      : undefined;
     const decision = decideTabNavigation({
       historyTabId: historyTabId ?? null,
-      serverActiveTabId: win?.activeTabId ?? null,
-      activeTab: activeTab
+      // Validates history tags: back/forward can replay an entry tagged with a
+      // closed tab; activating that dead id would persist a dangling
+      // activeTabId, after which every nav "opens" (no active tab found).
+      windowTabIds: mirrorTabs.map((t) => t.id),
+      // Identities of this window's tabs, so a navigation to a target already
+      // open in another tab focuses it instead of duplicating it (and a rapid
+      // switch whose history stamp was lost self-heals to the right tab).
+      windowTabs: mirrorTabs.map((t) => ({
+        id: t.id,
+        dashboardId: t.dashboardId,
+        taskId: t.taskId,
+        channelId: t.channelId,
+        channelSection: t.channelSection,
+        appView: t.appView,
+      })),
+      serverActiveTabId: mirrorWin?.activeTabId ?? null,
+      activeTab: mirrorActive
         ? {
-            id: activeTab.id,
-            dashboardId: activeTab.dashboardId,
-            taskId: activeTab.taskId,
-            channelId: activeTab.channelId,
-            channelSection: activeTab.channelSection,
+            id: mirrorActive.id,
+            dashboardId: mirrorActive.dashboardId,
+            taskId: mirrorActive.taskId,
+            channelId: mirrorActive.channelId,
+            channelSection: mirrorActive.channelSection,
+            appView: mirrorActive.appView,
           }
         : null,
       routeDashboardId: params.dashboardId ?? null,
       routeTaskId: params.taskId ?? null,
       routeChannelId: params.channelId ?? null,
       routeChannelSection,
+      routeAppView,
     });
     switch (decision.type) {
-      case "activate":
-        setActiveTab.mutate({ windowId, tabId: decision.tabId });
+      case "activate": {
+        // Focus in the mirror synchronously; persist in the background.
+        applyLocalTransform((s) =>
+          setWindowActiveTab(s, windowId, decision.tabId),
+        );
+        void persistWrite(() =>
+          setActiveTab.mutateAsync({ windowId, tabId: decision.tabId }),
+        );
+        // Heal the history tag to the tab we're activating. Normally it already
+        // matches (a tagged switch), so `stamp` no-ops. When the dedup path
+        // activated an existing tab the route pointed at (a switch whose stamp
+        // was lost), the entry still carries the STALE tab — left unhealed, the
+        // first branch above would re-activate it next render and ping-pong with
+        // the dedup (a "Maximum update depth exceeded" loop). Stamping breaks it.
+        stamp(decision.tabId);
         break;
-      case "replace":
-        setTabTarget.mutate({
+      }
+      case "replace": {
+        const target = {
           tabId: decision.tabId,
           dashboardId: decision.dashboardId,
           taskId: decision.taskId,
           channelId: decision.channelId,
           channelSection: decision.channelSection,
-        });
+          appView: decision.appView,
+        };
+        // Synchronous local apply keeps re-entrant runs (and the /website index
+        // redirect guard) from ever seeing the pre-navigation target.
+        applyLocalTransform((s) =>
+          setTabTargetLocal(s, { ...target, now: Date.now }),
+        );
+        void persistWrite(() => setTabTarget.mutateAsync(target));
         if (decision.stampTabId) stamp(decision.stampTabId);
         break;
-      case "open":
-        openOrFocus.mutate({
+      }
+      case "open": {
+        const input = {
           windowId,
           dashboardId: decision.dashboardId,
           taskId: decision.taskId,
           channelId: decision.channelId,
           channelSection: decision.channelSection,
+          appView: decision.appView,
+        };
+        // Mint the id here so the local apply and the persisted state agree on
+        // it; openOrFocusLocal may instead dedup-focus an existing tab, in
+        // which case the minted id goes unused (identically on the server).
+        const mintedId = crypto.randomUUID();
+        let openedTabId: string = mintedId;
+        applyLocalTransform((s) => {
+          const result = openOrFocusLocal(s, {
+            ...input,
+            makeId: () => mintedId,
+            now: Date.now,
+          });
+          openedTabId = result.tabId;
+          return result.snapshot;
         });
-        if (decision.stampTabId) stamp(decision.stampTabId);
+        void persistWrite(() =>
+          openOrFocus.mutateAsync({ ...input, tabId: mintedId }),
+        );
+        // Stamp the entry with the tab that now owns this route.
+        stamp(openedTabId);
         break;
+      }
       case "stamp":
         stamp(decision.stampTabId);
         break;
     }
   }, [
+    // windowId flips once when the boot seed lands — that run adopts the
+    // initial route. Everything else here is location; mirror state is read
+    // fresh inside, deliberately NOT a dependency (see the comment above).
     windowId,
     historyTabId,
-    win?.activeTabId,
     params.channelId,
     params.dashboardId,
     params.taskId,
     routeChannelSection,
-    activeTab,
-    openOrFocus.mutate,
-    setTabTarget.mutate,
-    setActiveTab.mutate,
+    routeAppView,
+    openOrFocus.mutateAsync,
+    setTabTarget.mutateAsync,
+    setActiveTab.mutateAsync,
     router,
   ]);
 
@@ -295,6 +480,7 @@ export function BrowserTabStrip() {
         const dashId = isActive ? (params.dashboardId ?? null) : t.dashboardId;
         const channelId = isActive ? (params.channelId ?? null) : t.channelId;
         const section = isActive ? routeChannelSection : t.channelSection;
+        const appView = isActive ? routeAppView : t.appView;
         const channel = channelName(channelId);
         if (taskId) {
           const task = findTask(taskId);
@@ -333,6 +519,16 @@ export function BrowserTabStrip() {
             pinned,
           };
         }
+        // A top-level app page (Inbox, Agents, Skills, …).
+        if (appView && isAppView(appView)) {
+          return {
+            id: t.id,
+            label: APP_VIEW_META[appView].label,
+            icon: APP_VIEW_META[appView].icon,
+            channelName: null,
+            pinned,
+          };
+        }
         return { id: t.id, label: "New tab", channelName: null, pinned };
       });
   }, [
@@ -350,6 +546,7 @@ export function BrowserTabStrip() {
     params.dashboardId,
     params.taskId,
     routeChannelSection,
+    routeAppView,
   ]);
 
   // Navigate to a tab, tagging the history entry with its id so the switch is
@@ -363,6 +560,13 @@ export function BrowserTabStrip() {
         params: { channelId: tab.channelId, taskId: tab.taskId },
         state,
       });
+    } else if (tab.taskId) {
+      // A channel-less task tab — the Code task detail route.
+      navigate({
+        to: "/code/tasks/$taskId",
+        params: { taskId: tab.taskId },
+        state,
+      });
     } else if (tab.dashboardId && tab.channelId) {
       navigate({
         to: "/website/$channelId/dashboards/$dashboardId",
@@ -383,8 +587,40 @@ export function BrowserTabStrip() {
       } else {
         navigate({ to: "/website/$channelId", params, state });
       }
+    } else if (tab.appView && isAppView(tab.appView)) {
+      // A top-level app page — back to its canonical route (literal `to` per
+      // case so the router types stay checked).
+      switch (tab.appView) {
+        case "home":
+          navigate({ to: "/code/home", state });
+          break;
+        case "inbox":
+          navigate({ to: "/code/inbox", state });
+          break;
+        case "agents":
+          navigate({ to: "/code/agents", state });
+          break;
+        case "skills":
+          navigate({ to: "/skills", state });
+          break;
+        case "mcp-servers":
+          navigate({ to: "/mcp-servers", state });
+          break;
+        case "command-center":
+          navigate({ to: "/command-center", state });
+          break;
+        default: {
+          // Exhaustiveness guard: a new AppView value fails to compile here
+          // until its canonical route is wired above — so the tab-target set
+          // (union + APP_VIEW_META) and this navigation can't drift apart.
+          const _exhaustive: never = tab.appView;
+          return _exhaustive;
+        }
+      }
     } else {
-      navigate({ to: "/website", state });
+      // Blank / landing tab: park on the space's home — the channels index, or
+      // the Code new-task screen.
+      navigate({ to: inChannels ? "/website" : "/code", state });
     }
   };
 
@@ -396,22 +632,25 @@ export function BrowserTabStrip() {
     goToTab(tab);
   };
 
-  // Apply a post-close snapshot to the store synchronously before navigating.
-  // The store otherwise lags a subscription round-trip, so the /website index
-  // would render against the still-has-tabs snapshot and redirect to the first
-  // channel (re-opening a tab) before the empty strip arrives.
+  // Navigate to the close's survivor, or — when the last tab was closed — to the
+  // flag's default landing (#me / new-task), never the /website index (which
+  // would redirect to channels[0], re-opening a random channel tab).
   const applyCloseResult = (next: TabsSnapshot) => {
-    browserTabsStore.getState().setSnapshot(next);
     const w = primaryWindow(next);
     const active = w?.activeTabId
       ? next.tabs.find((t) => t.id === w.activeTabId)
       : null;
     if (active) goToTab(active);
-    else navigate({ to: "/website" });
+    else landOnDefault();
   };
 
+  // Close applies locally and navigates to the survivor in the same tick — the
+  // /website index therefore always renders against the post-close snapshot
+  // and can't redirect (re-opening a tab) mid-flight.
   const handleClose = (tabId: string) => {
-    close.mutate({ tabId }, { onSuccess: applyCloseResult });
+    const next = applyLocalTransform((s) => closeTabLocal(s, tabId).snapshot);
+    applyCloseResult(next);
+    void persistWrite(() => close.mutateAsync({ tabId }));
   };
 
   // Unpinning re-homes the tab at the front of the unpinned block. Apply the
@@ -422,13 +661,8 @@ export function BrowserTabStrip() {
     togglePinned(tabId);
     if (!wasPinned || !windowId) return;
     const order = frontOfUnpinnedOrder(snapshot, windowId, tabId, pinnedTabIds);
-    browserTabsStore
-      .getState()
-      .setSnapshot(setTabOrder(snapshot, windowId, order));
-    setOrder.mutate(
-      { windowId, tabIds: order },
-      { onSuccess: (next) => browserTabsStore.getState().setSnapshot(next) },
-    );
+    applyLocalTransform((s) => setTabOrder(s, windowId, order));
+    void persistWrite(() => setOrder.mutateAsync({ windowId, tabIds: order }));
   };
 
   // Bulk closes operate on the strip's *displayed* order (pinned-first) and
@@ -436,9 +670,12 @@ export function BrowserTabStrip() {
   // always survives) takes focus if the active tab was among those closed.
   const handleCloseMany = (tabIds: string[], anchorTabId: string) => {
     if (tabIds.length === 0) return;
-    closeMany.mutate(
-      { tabIds, focusTabId: anchorTabId },
-      { onSuccess: applyCloseResult },
+    const next = applyLocalTransform((s) =>
+      closeTabsLocal(s, tabIds, anchorTabId),
+    );
+    applyCloseResult(next);
+    void persistWrite(() =>
+      closeMany.mutateAsync({ tabIds, focusTabId: anchorTabId }),
     );
   };
 
@@ -473,6 +710,105 @@ export function BrowserTabStrip() {
     );
   };
 
+  // The default landing, keyed off the channels toggle (not the current route,
+  // which lags a toggle flip): #me when channels are on, the Code new-task
+  // screen otherwise. Deliberately never routes through the /website index,
+  // which would redirect to channels[0]. `tabId` (a fresh blank tab) fills that
+  // tab in place; without one (last tab closed) the navigation opens a new tab.
+  const landOnDefault = (tabId?: string) => {
+    const state = tabId ? (prev: object) => ({ ...prev, tabId }) : undefined;
+    if (!channelsEnabled) {
+      navigate({ to: "/code", state });
+      return;
+    }
+    // #me is provisioned lazily the first time (same bridge the sidebar's #me
+    // row uses); fall back to the new-task screen if it can't be created.
+    void (async () => {
+      try {
+        const existing = channels.find((c) => c.name === PERSONAL_CHANNEL_NAME);
+        if (!existing && !personalChannelInFlight) {
+          personalChannelInFlight = createChannel(
+            PERSONAL_CHANNEL_NAME,
+          ).finally(() => {
+            personalChannelInFlight = null;
+          });
+        }
+        const folder = existing ?? (await personalChannelInFlight);
+        if (!folder) return;
+        navigate({
+          to: "/website/$channelId",
+          params: { channelId: folder.id },
+          state,
+        });
+      } catch {
+        navigate({ to: "/code", state });
+      }
+    })();
+  };
+
+  // New tab is fully local: mint the id here, append the blank tab to the
+  // mirror and navigate in the same tick (no IPC wait), then persist with the
+  // same id so the durable state matches. The service is idempotent on the
+  // minted id, so a replay can't append a duplicate.
+  const handleNewTab = () => {
+    if (!windowId) return;
+    const tabId = crypto.randomUUID();
+    applyLocalTransform(
+      (s) =>
+        newBlankTabLocal(s, { windowId, makeId: () => tabId, now: Date.now })
+          .snapshot,
+    );
+    landOnDefault(tabId);
+    void persistWrite(() => newBlankTab.mutateAsync({ windowId, tabId }));
+  };
+
+  // Cmd/Ctrl+T opens a new browser tab. Bound here (not globally) so it only
+  // fires where the strip is mounted; the new-task shortcut owns Cmd/Ctrl+N.
+  useHotkeys(
+    SHORTCUTS.NEW_TAB,
+    (e) => {
+      e.preventDefault();
+      handleNewTab();
+    },
+    { enableOnFormTags: true, enableOnContentEditable: true },
+  );
+
+  // Cmd/Ctrl+W closes the active browser tab. Always preventDefault so Electron
+  // doesn't close the window, but defer to the task's editor panel when it has a
+  // closeable tab (inner-first) — that handler closes the editor tab instead.
+  useHotkeys(
+    SHORTCUTS.CLOSE_TAB,
+    (e) => {
+      e.preventDefault();
+      if (taskHasCloseableEditorTab(params.taskId)) return;
+      if (activeTabId) handleClose(activeTabId);
+    },
+    { enableOnFormTags: true, enableOnContentEditable: true },
+  );
+
+  // With channels on, Cmd/Ctrl+1-9 switches to the Nth browser tab (in the
+  // displayed, pinned-first order) instead of the Nth sidebar task. The global
+  // task-switch handler yields via the same channelsEnabled gate, so exactly one
+  // owner fires. Mirror its pure-ctrl guard: ctrl+1-9 is the editor-panel tab
+  // switcher (SWITCH_TAB), so leave ctrl-only presses to it.
+  useHotkeys(
+    SHORTCUTS.SWITCH_TASK,
+    (event, handler) => {
+      if (event.ctrlKey && !event.metaKey) return;
+      const key = handler.keys?.[0];
+      if (!key) return;
+      const tab = tabs[Number.parseInt(key, 10) - 1];
+      if (tab) handleSelect(tab.id);
+    },
+    {
+      enableOnFormTags: true,
+      enableOnContentEditable: true,
+      preventDefault: true,
+      enabled: channelsEnabled,
+    },
+    [tabs, handleSelect],
+  );
+
   return (
     <TabStrip
       tabs={tabs}
@@ -483,26 +819,7 @@ export function BrowserTabStrip() {
       onCloseOthers={handleCloseOthers}
       onCloseToRight={handleCloseToRight}
       onCloseToLeft={handleCloseToLeft}
-      onNewTab={() => {
-        if (!windowId) return;
-        newBlankTab.mutate(
-          { windowId },
-          {
-            onSuccess: (next) => {
-              const w = primaryWindow(next);
-              if (w?.activeTabId) {
-                goToTab({
-                  id: w.activeTabId,
-                  dashboardId: null,
-                  taskId: null,
-                  channelId: null,
-                  channelSection: null,
-                });
-              }
-            },
-          },
-        );
-      }}
+      onNewTab={handleNewTab}
     />
   );
 }
diff --git a/packages/ui/src/features/browser-tabs/BrowserTabsDnd.tsx b/packages/ui/src/features/browser-tabs/BrowserTabsDnd.tsx
index 4d2e202741..810523c7c6 100644
--- a/packages/ui/src/features/browser-tabs/BrowserTabsDnd.tsx
+++ b/packages/ui/src/features/browser-tabs/BrowserTabsDnd.tsx
@@ -7,6 +7,7 @@ import { type ReactNode, useRef } from "react";
 import { reorderWithinGroup, storedOrderIds } from "./displayOrder";
 import { usePinnedTabsStore } from "./pinnedTabsStore";
 import { useTabReorderStore } from "./tabReorderStore";
+import { applyLocalTransform, persistWrite } from "./tabsSync";
 
 function sameOrder(a: string[], b: string[]): boolean {
   return a.length === b.length && a.every((id, i) => id === b[i]);
@@ -86,14 +87,12 @@ export function BrowserTabsDndProvider({ children }: { children: ReactNode }) {
       const snapshot = browserTabsStore.getState().snapshot;
       const win = primaryWindow(snapshot);
       if (!win) return;
-      // Optimistically apply so the strip doesn't flit back to the mirror's
-      // pre-drop order for a frame; then persist to the host.
-      browserTabsStore
-        .getState()
-        .setSnapshot(setTabOrder(snapshot, win.id, order));
-      setOrder.mutate(
-        { windowId: win.id, tabIds: order },
-        { onSuccess: (next) => browserTabsStore.getState().setSnapshot(next) },
+      // Apply locally so the strip doesn't flit back to the mirror's pre-drop
+      // order for a frame; persist through the tabsSync gate so the echo can't
+      // rewind a newer write.
+      applyLocalTransform((s) => setTabOrder(s, win.id, order));
+      void persistWrite(() =>
+        setOrder.mutateAsync({ windowId: win.id, tabIds: order }),
       );
     });
   };
diff --git a/packages/ui/src/features/browser-tabs/browser-tabs-events.contribution.ts b/packages/ui/src/features/browser-tabs/browser-tabs-events.contribution.ts
index 3fc460e9d3..42c4cf2b59 100644
--- a/packages/ui/src/features/browser-tabs/browser-tabs-events.contribution.ts
+++ b/packages/ui/src/features/browser-tabs/browser-tabs-events.contribution.ts
@@ -1,14 +1,17 @@
-import { browserTabsStore } from "@posthog/core/browser-tabs/browserTabsStore";
 import type { Contribution } from "@posthog/di/contribution";
 import { inject, injectable } from "inversify";
 import {
   BROWSER_TABS_CLIENT,
   type BrowserTabsClient,
 } from "./browserTabsClient";
+import { applyRemoteSnapshot, registerSnapshotFetcher } from "./tabsSync";
 
 /**
  * Seeds the renderer tab snapshot at startup and keeps it live via the
  * snapshot-change subscription, so a mutation in any window is reflected here.
+ * Applied through the tabsSync gate: pushes are dropped while this window has
+ * writes in flight, so an echo of our own mutation can't rewind newer local
+ * state (see tabsSync.ts).
  */
 @injectable()
 export class BrowserTabsEventsContribution implements Contribution {
@@ -20,21 +23,24 @@ export class BrowserTabsEventsContribution implements Contribution {
   ) {}
 
   start(): void {
-    const { setSnapshot } = browserTabsStore.getState();
+    // Lets tabsSync re-pull the authoritative snapshot after a FAILED write
+    // (a failed mutation emits no snapshotChange, so nothing else reconciles).
+    registerSnapshotFetcher(() => this.client.getSnapshot());
 
     void this.client
       .getSnapshot()
-      .then((snapshot) => setSnapshot(snapshot))
+      .then((snapshot) => applyRemoteSnapshot(snapshot))
       .catch(() => undefined);
 
     // Replace any prior handle so a repeated start() can't leak a subscription.
     this.subscription?.unsubscribe();
     this.subscription = this.client.onSnapshotChange({
-      onData: (snapshot) => setSnapshot(snapshot),
+      onData: (snapshot) => applyRemoteSnapshot(snapshot),
     });
   }
 
   stop(): void {
+    registerSnapshotFetcher(null);
     this.subscription?.unsubscribe();
     this.subscription = null;
   }
diff --git a/packages/ui/src/features/browser-tabs/browserTabsClient.ts b/packages/ui/src/features/browser-tabs/browserTabsClient.ts
index cc6c9f964f..eaf4df383d 100644
--- a/packages/ui/src/features/browser-tabs/browserTabsClient.ts
+++ b/packages/ui/src/features/browser-tabs/browserTabsClient.ts
@@ -20,14 +20,22 @@ export interface BrowserTabsClient {
     taskId: string | null;
     channelId: string | null;
     channelSection?: string | null;
+    appView?: string | null;
+    /** Renderer-minted id for a tab this call may create (local-first sync). */
+    tabId?: string;
+  }): Promise<TabsSnapshot>;
+  newBlankTab(input: {
+    windowId: string;
+    /** Renderer-minted id (see openOrFocus.tabId). */
+    tabId?: string;
   }): Promise<TabsSnapshot>;
-  newBlankTab(input: { windowId: string }): Promise<TabsSnapshot>;
   setTabTarget(input: {
     tabId: string;
     dashboardId: string | null;
     taskId: string | null;
     channelId: string | null;
     channelSection?: string | null;
+    appView?: string | null;
   }): Promise<TabsSnapshot>;
   close(tabId: string): Promise<TabsSnapshot>;
   setActiveTab(input: {
diff --git a/packages/ui/src/features/browser-tabs/displayOrder.test.ts b/packages/ui/src/features/browser-tabs/displayOrder.test.ts
index 1c1ea7fefe..5ac2c00249 100644
--- a/packages/ui/src/features/browser-tabs/displayOrder.test.ts
+++ b/packages/ui/src/features/browser-tabs/displayOrder.test.ts
@@ -16,6 +16,7 @@ function tab(id: string, position: number): BrowserTab {
     taskId: null,
     channelId: null,
     channelSection: null,
+    appView: null,
     position,
     scrollState: null,
     createdAt: 0,
diff --git a/packages/ui/src/features/browser-tabs/tabsSync.test.ts b/packages/ui/src/features/browser-tabs/tabsSync.test.ts
new file mode 100644
index 0000000000..a5a90a96f7
--- /dev/null
+++ b/packages/ui/src/features/browser-tabs/tabsSync.test.ts
@@ -0,0 +1,192 @@
+import { browserTabsStore } from "@posthog/core/browser-tabs/browserTabsStore";
+import type { TabsSnapshot } from "@posthog/shared";
+import { beforeEach, describe, expect, it } from "vitest";
+import {
+  applyLocalTransform,
+  applyRemoteSnapshot,
+  persistWrite,
+  registerSnapshotFetcher,
+} from "./tabsSync";
+
+function snap(tabIds: string[]): TabsSnapshot {
+  return {
+    windows: [
+      {
+        id: "w1",
+        isPrimary: true,
+        bounds: null,
+        activeTabId: tabIds[0] ?? null,
+      },
+    ],
+    tabs: tabIds.map((id, i) => ({
+      id,
+      windowId: "w1",
+      dashboardId: null,
+      taskId: null,
+      channelId: `c-${id}`,
+      channelSection: null,
+      appView: null,
+      position: (i + 1) * 1000,
+      createdAt: i,
+      lastActiveAt: i,
+    })),
+  };
+}
+
+const current = () => browserTabsStore.getState().snapshot;
+
+// Resolvable promise helper so tests control settle order.
+function deferred<T>() {
+  let resolve!: (v: T) => void;
+  let reject!: (e: unknown) => void;
+  const promise = new Promise<T>((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+}
+
+describe("tabsSync", () => {
+  beforeEach(() => {
+    browserTabsStore.getState().setSnapshot(snap(["a"]));
+    registerSnapshotFetcher(null);
+  });
+
+  it("applyLocalTransform writes the mirror synchronously", () => {
+    applyLocalTransform(() => snap(["a", "b"]));
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+  });
+
+  it("drops remote snapshots while a write is in flight (stale echo)", async () => {
+    const d = deferred<TabsSnapshot>();
+    const settled = persistWrite(() => d.promise);
+    registerSnapshotFetcher(async () => snap(["a", "b"]));
+
+    applyLocalTransform(() => snap(["a", "b"]));
+    // Echo of an older state arrives mid-flight — must not rewind the mirror.
+    applyRemoteSnapshot(snap(["a"]));
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+
+    d.resolve(snap(["a", "b"]));
+    await settled;
+    await Promise.resolve();
+  });
+
+  it("re-pulls changes from another window after a local write settles", async () => {
+    const d = deferred<TabsSnapshot>();
+    const fetched = deferred<TabsSnapshot>();
+    registerSnapshotFetcher(() => fetched.promise);
+    const settled = persistWrite(() => d.promise);
+
+    applyLocalTransform(() => snap(["a", "b"]));
+    applyRemoteSnapshot(snap(["a", "b", "remote"]));
+
+    d.resolve(snap(["a", "b"]));
+    await settled;
+    fetched.resolve(snap(["a", "b", "remote"]));
+    await fetched.promise;
+    await Promise.resolve();
+
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b", "remote"]);
+  });
+
+  it("does not overwrite a newer live push with a reconciliation fetch", async () => {
+    const write = deferred<TabsSnapshot>();
+    const fetched = deferred<TabsSnapshot>();
+    registerSnapshotFetcher(() => fetched.promise);
+    const settled = persistWrite(() => write.promise);
+
+    applyRemoteSnapshot(snap(["a", "remote"]));
+    write.resolve(snap(["a"]));
+    await settled;
+
+    applyRemoteSnapshot(snap(["a", "remote", "newer"]));
+    fetched.resolve(snap(["a", "remote"]));
+    await fetched.promise;
+    await Promise.resolve();
+
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "remote", "newer"]);
+  });
+
+  it("applies remote snapshots when idle", () => {
+    applyRemoteSnapshot(snap(["a", "b", "c"]));
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b", "c"]);
+  });
+
+  it("only the LAST settling write applies its server snapshot", async () => {
+    const d1 = deferred<TabsSnapshot>();
+    const d2 = deferred<TabsSnapshot>();
+    const p1 = persistWrite(() => d1.promise);
+    const p2 = persistWrite(() => d2.promise);
+    applyLocalTransform(() => snap(["a", "b"]));
+
+    // First write settles while the second is still in flight: its (older)
+    // snapshot must NOT be applied.
+    d1.resolve(snap(["a"]));
+    await p1;
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+
+    // Last write settles: its snapshot is authoritative and applies.
+    d2.resolve(snap(["a", "b"]));
+    await p2;
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+  });
+
+  it("keeps the optimistic state when a write fails, and unblocks remote applies", async () => {
+    const d = deferred<TabsSnapshot>();
+    const settled = persistWrite(() => d.promise);
+    applyLocalTransform(() => snap(["a", "b"]));
+
+    d.reject(new Error("ipc down"));
+    await settled; // must not throw
+
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+    // Gate reopened: the next remote snapshot reconciles.
+    applyRemoteSnapshot(snap(["a", "b", "c"]));
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b", "c"]);
+  });
+
+  it("re-pulls the authoritative snapshot when the last in-flight write fails", async () => {
+    // A failed mutation commits nothing server-side and emits no push, so the
+    // failed-last-write path must reconcile via the registered fetcher.
+    const fetched = deferred<TabsSnapshot>();
+    registerSnapshotFetcher(() => fetched.promise);
+
+    const d = deferred<TabsSnapshot>();
+    const settled = persistWrite(() => d.promise);
+    applyLocalTransform(() => snap(["a", "b"])); // optimistic, never committed
+
+    d.reject(new Error("ipc down"));
+    await settled;
+
+    fetched.resolve(snap(["a"])); // server truth: the write never landed
+    await fetched.promise;
+    await Promise.resolve(); // let the .then apply
+    expect(current().tabs.map((t) => t.id)).toEqual(["a"]);
+  });
+
+  it("skips the failure re-pull when a newer write is already in flight", async () => {
+    const fetched = deferred<TabsSnapshot>();
+    registerSnapshotFetcher(() => fetched.promise);
+
+    const d1 = deferred<TabsSnapshot>();
+    const d2 = deferred<TabsSnapshot>();
+    const p1 = persistWrite(() => d1.promise);
+
+    d1.reject(new Error("ipc down"));
+    await p1; // failure re-pull kicked off (was last in flight)
+
+    // A newer write starts before the re-pull resolves: its settle owns
+    // reconciliation, so the stale re-pull must not apply.
+    const p2 = persistWrite(() => d2.promise);
+    applyLocalTransform(() => snap(["a", "b"]));
+    fetched.resolve(snap(["a"]));
+    await fetched.promise;
+    await Promise.resolve();
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+
+    d2.resolve(snap(["a", "b"]));
+    await p2;
+    expect(current().tabs.map((t) => t.id)).toEqual(["a", "b"]);
+  });
+});
diff --git a/packages/ui/src/features/browser-tabs/tabsSync.ts b/packages/ui/src/features/browser-tabs/tabsSync.ts
new file mode 100644
index 0000000000..a838fd67b4
--- /dev/null
+++ b/packages/ui/src/features/browser-tabs/tabsSync.ts
@@ -0,0 +1,120 @@
+import { browserTabsStore } from "@posthog/core/browser-tabs/browserTabsStore";
+import type { TabsSnapshot } from "@posthog/shared";
+
+/**
+ * Local-first sync policy for the browser-tabs mirror.
+ *
+ * Every tab operation applies its shared pure transform to the renderer mirror
+ * synchronously (the UI renders from the mirror, so interactions are instant),
+ * then persists to the main process in the background. Because the renderer
+ * and the service run the SAME transforms in the SAME order, the mirror and
+ * the durable snapshot converge.
+ *
+ * The hazard this module exists to prevent: the main process echoes every
+ * commit back (the mutation's return value and the snapshotChange fan-out).
+ * Under rapid input, the echo of write N arrives AFTER the local apply of
+ * write N+1; applying it would rewind the mirror, and the navigation effect
+ * would re-decide against stale state and misfire persistent writes (the
+ * historical "tab targets swap / titles flicker" corruption). So while any
+ * local write is in flight, remote snapshots are dropped. If a push arrives,
+ * the renderer re-fetches the authoritative snapshot after the write batch
+ * settles because it may contain another window's mutation. Otherwise the last
+ * write response reconciles the mirror directly.
+ */
+let inFlight = 0;
+let remoteSnapshotVersion = 0;
+let needsAuthoritativeReconcile = false;
+
+// Authoritative-snapshot fetcher, registered once at boot by the events
+// contribution (tabsSync can't reach the injected BrowserTabsClient itself).
+// Used to reconcile after a failed write or a dropped remote snapshot.
+let fetchAuthoritative: (() => Promise<TabsSnapshot>) | null = null;
+
+export function registerSnapshotFetcher(
+  fetch: (() => Promise<TabsSnapshot>) | null,
+): void {
+  fetchAuthoritative = fetch;
+}
+
+function reconcileAuthoritative(): void {
+  const versionAtRequest = remoteSnapshotVersion;
+  void fetchAuthoritative?.()
+    .then((server) => {
+      if (inFlight === 0 && remoteSnapshotVersion === versionAtRequest) {
+        browserTabsStore.getState().setSnapshot(server);
+      }
+    })
+    .catch(() => undefined);
+}
+
+/** Read the mirror's current snapshot (non-reactive; for event handlers and
+ * effects that must see the latest state without subscribing to it). */
+export function readMirror(): TabsSnapshot {
+  return browserTabsStore.getState().snapshot;
+}
+
+/** Synchronously apply a pure transform to the mirror (the optimistic write). */
+export function applyLocalTransform(
+  transform: (snapshot: TabsSnapshot) => TabsSnapshot,
+): TabsSnapshot {
+  const store = browserTabsStore.getState();
+  const next = transform(store.snapshot);
+  store.setSnapshot(next);
+  return next;
+}
+
+/**
+ * Persist a local write to the main process. Fire-and-forget from the caller's
+ * perspective: the UI has already moved via applyLocalTransform. Only the last
+ * settling write applies its server snapshot unless a remote push was dropped,
+ * in which case an authoritative fetch reconciles cross-window state. Failed
+ * writes are swallowed and reconciled through the same fetch path.
+ */
+export async function persistWrite(
+  write: () => Promise<TabsSnapshot>,
+): Promise<void> {
+  inFlight++;
+  let serverSnapshot: TabsSnapshot | null = null;
+  try {
+    serverSnapshot = await write();
+  } catch {
+    needsAuthoritativeReconcile = true;
+  } finally {
+    inFlight--;
+    if (inFlight === 0) {
+      if (needsAuthoritativeReconcile) {
+        needsAuthoritativeReconcile = false;
+        reconcileAuthoritative();
+      } else if (serverSnapshot) {
+        // Over Electron IPC the last-settling write is also the last-issued
+        // write (single FIFO channel, synchronous service handlers). A transport
+        // that can reorder responses will need a sequence guard here.
+        browserTabsStore.getState().setSnapshot(serverSnapshot);
+      }
+    }
+  }
+}
+
+/**
+ * Apply a snapshot pushed from the main process (boot seed, or a mutation made
+ * by another window). A push received during a local write is dropped and
+ * replaced by an authoritative fetch when the write batch settles.
+ */
+export function applyRemoteSnapshot(snapshot: TabsSnapshot): void {
+  remoteSnapshotVersion++;
+  if (inFlight > 0) {
+    // This may be an echo of our own write, or a real mutation from another
+    // window. Re-pull once the local write batch settles so neither case can
+    // rewind or strand the mirror.
+    needsAuthoritativeReconcile = true;
+    return;
+  }
+  browserTabsStore.getState().setSnapshot(snapshot);
+}
+
+// Dev-only inspection handle so the live mirror can be dumped from the console
+// (and by agent-browser during dogfooding). No-op in production builds.
+if (import.meta.env.DEV) {
+  (globalThis as { __tabsMirror?: () => TabsSnapshot }).__tabsMirror = () =>
+    browserTabsStore.getState().snapshot;
+}
diff --git a/packages/ui/src/features/canvas/components/ChannelsList.tsx b/packages/ui/src/features/canvas/components/ChannelsList.tsx
index b66444f566..504703c5cc 100644
--- a/packages/ui/src/features/canvas/components/ChannelsList.tsx
+++ b/packages/ui/src/features/canvas/components/ChannelsList.tsx
@@ -32,7 +32,6 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
   MenuLabel,
-  Separator,
   Tooltip,
   TooltipContent,
   TooltipProvider,
@@ -562,11 +561,7 @@ export function ChannelsList() {
     // One shared provider groups every row tooltip so that once one shows,
     // moving to the next row reveals its tooltip instantly (no re-delay).
     <TooltipProvider delay={600}>
-      <Flex direction="column" gap="px" className="px-2 pb-2">
-        <Box className="py-1.5">
-          <Separator className="bg-border" />
-        </Box>
-
+      <Flex direction="column" gap="px" className="px-2 pt-2 pb-2">
         <PersonalChannelRow />
 
         {starred.length > 0 && (
diff --git a/packages/ui/src/features/canvas/components/ChannelsSidebar.tsx b/packages/ui/src/features/canvas/components/ChannelsSidebar.tsx
index afb691ff93..5a1a0f3219 100644
--- a/packages/ui/src/features/canvas/components/ChannelsSidebar.tsx
+++ b/packages/ui/src/features/canvas/components/ChannelsSidebar.tsx
@@ -1,190 +1,70 @@
-import {
-  BellIcon,
-  BrainIcon,
-  GearSixIcon,
-  HouseIcon,
-  RobotIcon,
-  SquaresFourIcon,
-  TrayIcon,
-} from "@phosphor-icons/react";
-import { countUnseenActivity } from "@posthog/core/canvas/mentionActivity";
-import { ANALYTICS_EVENTS } from "@posthog/shared/analytics-events";
-import { HOME_TAB_FLAG } from "@posthog/shared/constants";
+import { ArchiveIcon } from "@phosphor-icons/react";
+import { Separator } from "@posthog/quill";
+import { PROJECT_BLUEBIRD_FLAG } from "@posthog/shared";
+import { useArchivedTaskIds } from "@posthog/ui/features/archive/useArchivedTaskIds";
+import { SidebarUsageBar } from "@posthog/ui/features/billing/SidebarUsageBar";
 import { ChannelsList } from "@posthog/ui/features/canvas/components/ChannelsList";
 import { useChannelsSidebarStore } from "@posthog/ui/features/canvas/components/channelsSidebarStore";
-import { useMentionActivity } from "@posthog/ui/features/canvas/hooks/useMentionActivity";
-import { useActivitySeenStore } from "@posthog/ui/features/canvas/stores/activitySeenStore";
 import { useFeatureFlag } from "@posthog/ui/features/feature-flags/useFeatureFlag";
-import { openSettings } from "@posthog/ui/features/settings/hooks/useOpenSettings";
-import { SidebarCountBadge } from "@posthog/ui/features/sidebar/components/items/SidebarCountBadge";
+import { useOnboardingStore } from "@posthog/ui/features/onboarding/onboardingStore";
 import { ProjectSwitcher } from "@posthog/ui/features/sidebar/components/ProjectSwitcher";
-import { SidebarItem } from "@posthog/ui/features/sidebar/components/SidebarItem";
+import { SidebarMenu } from "@posthog/ui/features/sidebar/components/SidebarMenu";
+import { SidebarNavSection } from "@posthog/ui/features/sidebar/components/SidebarNavSection";
 import { UpdateBanner } from "@posthog/ui/features/sidebar/components/UpdateBanner";
+import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
+import { useWorkspaces } from "@posthog/ui/features/workspace/useWorkspace";
 import { ResizableSidebar } from "@posthog/ui/primitives/ResizableSidebar";
-import {
-  navigateToActivity,
-  navigateToAgents,
-  navigateToCanvas,
-  navigateToInbox,
-  navigateToSkills,
-  navigateToWebsiteHome,
-} from "@posthog/ui/router/navigationBridge";
-import { useAppView } from "@posthog/ui/router/useAppView";
-import { track } from "@posthog/ui/shell/analytics";
+import { navigateToArchived } from "@posthog/ui/router/navigationBridge";
 import { Box, Flex } from "@radix-ui/themes";
-import { useRouterState } from "@tanstack/react-router";
-import { useMemo } from "react";
+import { useDeferredValue, useEffect } from "react";
 
-// Fire a nav_click event, then run the destination's navigation.
-function trackNav(navTarget: string, navigate: () => void) {
-  track(ANALYTICS_EVENTS.CHANNEL_ACTION, {
-    action_type: "nav_click",
-    surface: "nav",
-    nav_target: navTarget,
-  });
-  navigate();
-}
-
-// Non-canvas /website mirrors (Home, Files, etc.) — used to tell whether the
-// current /website route is a canvas surface (channels index / a channel / a
-// dashboard) so the Canvas nav item highlights only there.
-const NON_CANVAS_WEBSITE_PREFIXES = [
-  "/website/home",
-  "/website/activity",
-  "/website/skills",
-  "/website/mcp-servers",
-  "/website/command-center",
-];
-
-// The Activity nav row with its unread-mentions dot. Its own component so the
-// mentions query only mounts once here.
-function ActivityNavItem({ isActive }: { isActive: boolean }) {
-  const { items } = useMentionActivity();
-  const lastSeenAt = useActivitySeenStore((s) => s.lastSeenAt);
-  const unseen = useMemo(
-    () => countUnseenActivity(items, lastSeenAt),
-    [items, lastSeenAt],
-  );
-  return (
-    <SidebarItem
-      depth={0}
-      icon={<BellIcon size={16} weight={isActive ? "fill" : "regular"} />}
-      label={
-        <span className="flex min-w-0 items-center">
-          Activity
-          <SidebarCountBadge
-            count={unseen}
-            title={`${unseen} new ${unseen === 1 ? "mention" : "mentions"}`}
-          />
-        </span>
-      }
-      isActive={isActive}
-      onClick={() => trackNav("activity", navigateToActivity)}
-    />
-  );
-}
-
-// The global nav brought over from the Code app — a single icon+label row each,
-// no rail. Home points at the /website/home mirror so it stays in the Channels
-// space (same shared HomeView, channels chrome kept); the other rows are
-// app-wide destinations that leave the Channels space for the Code view. The
-// channel tree below is channel browsing.
-function ChannelsNav() {
-  const view = useAppView();
-  const homeTabEnabled = useFeatureFlag(HOME_TAB_FLAG);
-  // Active on the canvas surfaces: the channels index, a channel, or a canvas —
-  // any /website route that isn't one of the cross-app mirrors above.
-  const isCanvasActive = useRouterState({
-    select: (s) => {
-      const path = s.location.pathname;
-      return (
-        path.startsWith("/website") &&
-        !NON_CANVAS_WEBSITE_PREFIXES.some((p) => path.startsWith(p))
-      );
-    },
-  });
-  return (
-    <Flex direction="column" className="shrink-0 gap-px px-2 py-2">
-      {homeTabEnabled && (
-        <SidebarItem
-          depth={0}
-          icon={
-            <HouseIcon
-              size={16}
-              weight={view.type === "home" ? "fill" : "regular"}
-            />
-          }
-          label="Home"
-          isActive={view.type === "home"}
-          onClick={() => trackNav("home", navigateToWebsiteHome)}
-        />
-      )}
-      <ActivityNavItem isActive={view.type === "activity"} />
-      <SidebarItem
-        depth={0}
-        icon={
-          <TrayIcon
-            size={16}
-            weight={view.type === "inbox" ? "fill" : "regular"}
-          />
-        }
-        label="Global Inbox"
-        isActive={view.type === "inbox"}
-        onClick={() => trackNav("inbox", navigateToInbox)}
-      />
-      <SidebarItem
-        depth={0}
-        icon={
-          <SquaresFourIcon
-            size={16}
-            weight={isCanvasActive ? "fill" : "regular"}
-          />
-        }
-        label="Canvas"
-        isActive={isCanvasActive}
-        onClick={() => trackNav("canvas", navigateToCanvas)}
-      />
-      <SidebarItem
-        depth={0}
-        icon={
-          <RobotIcon
-            size={16}
-            weight={view.type === "agents" ? "fill" : "regular"}
-          />
-        }
-        label="Agents"
-        isActive={view.type === "agents"}
-        onClick={() => trackNav("agents", navigateToAgents)}
-      />
-      <SidebarItem
-        depth={0}
-        icon={
-          <BrainIcon
-            size={16}
-            weight={view.type === "skills" ? "fill" : "regular"}
-          />
-        }
-        label="Files"
-        isActive={view.type === "skills"}
-        onClick={() => trackNav("files", navigateToSkills)}
-      />
-    </Flex>
-  );
-}
-
-// The Channels-space sidebar: a single column owning the whole left pane. Top to
-// bottom — workspace switcher, global nav, the channel tree, then Settings
-// pinned to the bottom. There is no app rail in this space; the nav rows above
-// are the cross-app navigation.
+// The unified app sidebar (Code merged into the Bluebird chrome). Top to
+// bottom: workspace switcher, the merged global nav, the "Enable channels"
+// opt-in, then the body — the task list by default, swapped for the channel
+// tree once channels are enabled — and Settings pinned to the bottom.
 export function ChannelsSidebar() {
   const width = useChannelsSidebarStore((state) => state.width);
   const setWidth = useChannelsSidebarStore((state) => state.setWidth);
   const isResizing = useChannelsSidebarStore((state) => state.isResizing);
   const setIsResizing = useChannelsSidebarStore((state) => state.setIsResizing);
 
+  // Cmd+B collapses the sidebar (via useSidebarStore.open, toggled globally in
+  // GlobalEventHandlers / the command menu). Auto-open once the user has
+  // finished onboarding or has any workspace, matching the retired MainSidebar —
+  // so a brand-new user sees the welcome screen without the sidebar beside it.
+  const open = useSidebarStore((s) => s.open);
+  const setOpenAuto = useSidebarStore((s) => s.setOpenAuto);
+  const hasCompletedOnboarding = useOnboardingStore(
+    (s) => s.hasCompletedOnboarding,
+  );
+  const { data: workspaces = {}, isFetched: workspacesFetched } =
+    useWorkspaces();
+  useEffect(() => {
+    if (!workspacesFetched) return;
+    setOpenAuto(hasCompletedOnboarding || Object.keys(workspaces).length > 0);
+  }, [workspacesFetched, workspaces, hasCompletedOnboarding, setOpenAuto]);
+
+  // Channels stay behind project-bluebird: the toggle only appears where the
+  // canvas backend is wired, and a persisted "on" is ignored when the flag is
+  // off so the sidebar can't strand a user on an unsupported feature.
+  const bluebirdEnabled = useFeatureFlag(
+    PROJECT_BLUEBIRD_FLAG,
+    import.meta.env.DEV,
+  );
+  const channelsEnabled =
+    useSidebarStore((s) => s.channelsEnabled) && bluebirdEnabled;
+  // The Switch (in SidebarNavSection) reads the live value and flips instantly.
+  // Swapping the sidebar body mounts a heavy tree (ChannelsList: the channels
+  // query + a provider-laden row per channel), so defer that decision: the
+  // urgent commit keeps the current body and paints the toggle, then the tree
+  // mounts in a follow-up non-blocking render.
+  const bodyChannelsEnabled = useDeferredValue(channelsEnabled);
+
+  const archivedTaskIds = useArchivedTaskIds();
+
   return (
     <ResizableSidebar
-      open
+      open={open}
       width={width}
       setWidth={setWidth}
       isResizing={isResizing}
@@ -192,30 +72,50 @@ export function ChannelsSidebar() {
       side="left"
     >
       <Flex direction="column" className="h-full bg-chrome">
-        {/* Workspace switcher — a compact bordered button. The title bar above
-            provides the window-drag region and stoplight clearance. */}
-        <Box className="shrink-0 px-2 pb-0">
-          <ProjectSwitcher triggerVariant="button" />
-        </Box>
+        {/* The nav owns the "Enable channels" toggle + Canvas rows (gated by
+            the same flag), so this section carries the whole merged nav. */}
+        <SidebarNavSection />
 
-        {/* The global nav links stay pinned below the switcher; only the channel
-            tree scrolls when it overflows. */}
-        <ChannelsNav />
-        <Box className="scroll-mask-4 min-h-0 flex-1 overflow-y-auto">
-          <ChannelsList />
-        </Box>
+        {/* Body: the channel tree when channels are on, otherwise the task
+            list. Each owns its own scroll region. Gated on the deferred value so
+            the toggle paints before this heavy swap. */}
+        {bodyChannelsEnabled ? (
+          <>
+            <Separator />
+            <Box className="scroll-mask-4 min-h-0 flex-1 overflow-y-auto">
+              <ChannelsList />
+            </Box>
+          </>
+        ) : (
+          <Box className="min-h-0 flex-1">
+            <SidebarMenu />
+          </Box>
+        )}
 
         <UpdateBanner />
+        <SidebarUsageBar />
+
+        {/* Archived is a task-list affordance — hidden while channels are on,
+            since the body then shows the channel tree, not tasks. */}
+        {!channelsEnabled && archivedTaskIds.size > 0 && (
+          <Box className="shrink-0 border-border border-t">
+            <button
+              type="button"
+              className="flex w-full items-center gap-1 bg-transparent px-2 py-1.5 text-left text-[13px] text-gray-11 transition-colors hover:bg-gray-3"
+              onClick={navigateToArchived}
+            >
+              <span className="flex h-[18px] w-[18px] shrink-0 items-center justify-center text-gray-10">
+                <ArchiveIcon size={14} />
+              </span>
+              <span className="text-gray-11">Archived</span>
+            </button>
+          </Box>
+        )}
 
-        {/* Settings pinned to the bottom. Settings is a full-page route, so this
-            leaves the Channels space rather than highlighting in place. */}
-        <Box className="shrink-0 border-border border-t p-2">
-          <SidebarItem
-            depth={0}
-            icon={<GearSixIcon size={16} />}
-            label="Settings"
-            onClick={() => trackNav("settings", () => openSettings())}
-          />
+        {/* Workspace switcher pinned to the bottom. Its dropdown carries the
+            Settings entry, so there's no separate Settings row. */}
+        <Box className="shrink-0 px-2 pb-2">
+          <ProjectSwitcher />
         </Box>
       </Flex>
     </ResizableSidebar>
diff --git a/packages/ui/src/features/canvas/components/FeedbackModal.test.tsx b/packages/ui/src/features/canvas/components/FeedbackModal.test.tsx
index 9edc78fc8f..a986d183c5 100644
--- a/packages/ui/src/features/canvas/components/FeedbackModal.test.tsx
+++ b/packages/ui/src/features/canvas/components/FeedbackModal.test.tsx
@@ -26,7 +26,6 @@ describe("FeedbackModal", () => {
   });
 
   it.each([
-    { mode: "leaving" as const, expected: "Skip", missing: "Cancel" },
     { mode: "posthog-web" as const, expected: "Skip", missing: "Cancel" },
     { mode: "feedback" as const, expected: "Cancel", missing: "Skip" },
   ])(
@@ -77,7 +76,7 @@ describe("FeedbackModal", () => {
 
   it("finishes without capturing when skipped", async () => {
     const user = userEvent.setup();
-    const onFinished = renderModal("leaving");
+    const onFinished = renderModal("posthog-web");
 
     await user.click(screen.getByRole("button", { name: "Skip" }));
 
diff --git a/packages/ui/src/features/canvas/components/FeedbackModal.tsx b/packages/ui/src/features/canvas/components/FeedbackModal.tsx
index 143cce1daf..16ddffbee9 100644
--- a/packages/ui/src/features/canvas/components/FeedbackModal.tsx
+++ b/packages/ui/src/features/canvas/components/FeedbackModal.tsx
@@ -18,7 +18,7 @@ import {
 import { captureSurveyResponse } from "@posthog/ui/shell/analytics";
 import { useState } from "react";
 
-export type FeedbackModalMode = "feedback" | "leaving" | "posthog-web";
+export type FeedbackModalMode = "feedback" | "posthog-web";
 
 /** Title + prompt shown for each way the modal can be opened. */
 const MODAL_COPY: Record<FeedbackModalMode, { title: string; prompt: string }> =
@@ -28,11 +28,6 @@ const MODAL_COPY: Record<FeedbackModalMode, { title: string; prompt: string }> =
       prompt:
         "How's the Channels experience? Tell us what's working and what you'd change.",
     },
-    leaving: {
-      title: "Before you go back to Code",
-      prompt:
-        "How's the Channels experience? Tell us what's working and what you'd change.",
-    },
     "posthog-web": {
       title: "Before you head to PostHog web",
       prompt: "Why are you going back to PostHog web?",
@@ -40,7 +35,7 @@ const MODAL_COPY: Record<FeedbackModalMode, { title: string; prompt: string }> =
   };
 
 export interface FeedbackModalProps {
-  /** `null` closes the modal. `"feedback"` shows a Cancel button; the navigation-intercept modes (`"leaving"`, `"posthog-web"`) show a Skip button. */
+  /** `null` closes the modal. `"feedback"` shows a Cancel button; the navigation-intercept mode (`"posthog-web"`) shows a Skip button. */
   mode: FeedbackModalMode | null;
   /** Called after the response is submitted, and when the modal is skipped/cancelled/dismissed. */
   onFinished: () => void;
@@ -50,8 +45,8 @@ export interface FeedbackModalProps {
  * Feedback modal for the Channels space. Submitting records the text as a
  * PostHog survey response (see {@link FEEDBACK_SURVEY_ID}) along with where the
  * modal was opened from. The secondary button reads "Skip" when the modal
- * intercepts a navigation (`"leaving"` / `"posthog-web"`) and "Cancel" when
- * opened directly by "Leave feedback".
+ * intercepts a navigation (`"posthog-web"`) and "Cancel" when opened directly
+ * by "Leave feedback".
  */
 export function FeedbackModal({ mode, onFinished }: FeedbackModalProps) {
   const open = mode !== null;
diff --git a/packages/ui/src/features/canvas/components/channelsSidebarStore.ts b/packages/ui/src/features/canvas/components/channelsSidebarStore.ts
index 5cd78418e8..c376b91bb1 100644
--- a/packages/ui/src/features/canvas/components/channelsSidebarStore.ts
+++ b/packages/ui/src/features/canvas/components/channelsSidebarStore.ts
@@ -4,3 +4,23 @@ export const useChannelsSidebarStore = createSidebarStore({
   name: "channels-sidebar",
   defaultWidth: 240,
 });
+
+// One-time migration: the unified layout replaced the Code sidebar (whose
+// width persisted under "sidebar-storage") with this store. A user who never
+// used the Channels space has no "channels-sidebar" entry yet — adopt their
+// old Code width instead of silently resetting them to the default. Once this
+// store persists (any set), the migration never runs again.
+try {
+  if (
+    typeof window !== "undefined" &&
+    window.localStorage.getItem("channels-sidebar") === null
+  ) {
+    const legacy = window.localStorage.getItem("sidebar-storage");
+    const width: unknown = legacy ? JSON.parse(legacy)?.state?.width : null;
+    if (typeof width === "number" && Number.isFinite(width) && width > 0) {
+      useChannelsSidebarStore.getState().setWidth(width);
+    }
+  }
+} catch {
+  // localStorage may be unavailable or hold malformed JSON; the default is fine.
+}
diff --git a/packages/ui/src/features/canvas/feedbackSurvey.ts b/packages/ui/src/features/canvas/feedbackSurvey.ts
index d99c89f08c..77941bf786 100644
--- a/packages/ui/src/features/canvas/feedbackSurvey.ts
+++ b/packages/ui/src/features/canvas/feedbackSurvey.ts
@@ -19,6 +19,5 @@ export const FEEDBACK_SURVEY_SOURCE_QUESTION_ID =
 // MUST stay in sync with the survey's single_choice options.
 export const FEEDBACK_SOURCE_BY_MODE = {
   feedback: "Generic (Leave feedback button)",
-  leaving: "Going back to Code",
   "posthog-web": "Visiting PostHog web",
 } as const;
diff --git a/packages/ui/src/features/canvas/stores/freeformChatStore.ts b/packages/ui/src/features/canvas/stores/freeformChatStore.ts
index 3c4cce603a..011196f808 100644
--- a/packages/ui/src/features/canvas/stores/freeformChatStore.ts
+++ b/packages/ui/src/features/canvas/stores/freeformChatStore.ts
@@ -10,6 +10,14 @@ const log = logger.scope("freeform-edit-store");
 // versions fall off past this cap.
 const MAX_VERSIONS = 50;
 
+// Thread retention: each thread holds up to MAX_VERSIONS whole-document copies,
+// and threads for every canvas ever visited would otherwise stay resident for
+// the app's lifetime (browser tabs make visiting many canvases cheap). Keep the
+// most recently used few; an evicted thread reseeds from the saved record on
+// the next visit — the working copy autosaves on every committed edit, so only
+// an in-progress version *browse* position is lost.
+const MAX_THREADS = 8;
+
 // Working copy of a freeform canvas's source + edit history. Generation no
 // longer streams in-process — it runs as a dedicated task that publishes the
 // result into the canvas's saved record (see useGenerateFreeformCanvas). This
@@ -45,6 +53,9 @@ export const EMPTY_FREEFORM_THREAD: FreeformThreadState = {
 
 interface FreeformChatStore {
   threads: Record<string, FreeformThreadState>;
+  /** MRU access order for eviction, oldest first. Store state (not a module
+   * closure) so devtools/tests see it and HMR can't desync it from `threads`. */
+  threadOrder: string[];
 
   /** Seed a thread from a saved record (only if the thread is still empty).
    * The templateId is recorded regardless so a generation gets the right prompt. */
@@ -90,16 +101,47 @@ function dashboardIdOf(threadId: string): string {
 }
 
 export const useFreeformChatStore = create<FreeformChatStore>()((set, get) => {
+  // Every patch refreshes a thread's recency; eviction runs only from the
+  // mount-time seeding paths (ensureCode / syncFromRecord) so an edit
+  // mid-session never drops another thread out from under a mounted view
+  // racing a save.
+  const touch = (threadId: string) => {
+    set((s) => ({
+      threadOrder: [...s.threadOrder.filter((id) => id !== threadId), threadId],
+    }));
+  };
+
+  const evictExcessThreads = () => {
+    // Walk oldest-first, skipping (not aborting on) threads with a save in
+    // flight — an abort would let one slow autosave at the front block the
+    // cap for every thread behind it.
+    let excess = get().threadOrder.length - MAX_THREADS;
+    for (const oldest of [...get().threadOrder]) {
+      if (excess <= 0) break;
+      if (get().threads[oldest]?.isSaving) continue;
+      excess--;
+      set((s) => {
+        const { [oldest]: _evicted, ...rest } = s.threads;
+        return {
+          threads: rest,
+          threadOrder: s.threadOrder.filter((id) => id !== oldest),
+        };
+      });
+    }
+  };
+
   const patch = (
     threadId: string,
     fn: (prev: FreeformThreadState) => FreeformThreadState,
-  ) =>
+  ) => {
+    touch(threadId);
     set((s) => ({
       threads: {
         ...s.threads,
         [threadId]: fn(s.threads[threadId] ?? EMPTY_FREEFORM_THREAD),
       },
     }));
+  };
 
   // Autosave the current code + history to the backend, toggling isSaving so the
   // toolbar can show a spinner. Never throws.
@@ -135,8 +177,11 @@ export const useFreeformChatStore = create<FreeformChatStore>()((set, get) => {
 
   return {
     threads: {},
+    threadOrder: [],
 
     ensureCode: (threadId, record) => {
+      touch(threadId);
+      evictExcessThreads();
       const cur = get().threads[threadId];
       // Once the thread has code, only refresh cheap metadata (templateId /
       // context) — never clobber the working copy. syncFromRecord handles
@@ -158,6 +203,8 @@ export const useFreeformChatStore = create<FreeformChatStore>()((set, get) => {
     },
 
     syncFromRecord: (threadId, record) => {
+      touch(threadId);
+      evictExcessThreads();
       const cur = get().threads[threadId];
       // Empty working copy → just seed.
       if (!cur || (!cur.code && cur.versions.length === 0)) {
@@ -259,6 +306,10 @@ export const useFreeformChatStore = create<FreeformChatStore>()((set, get) => {
     },
 
     revert: (threadId) => {
+      // Guard against an evicted/never-seeded thread: patch() would otherwise
+      // materialize EMPTY_FREEFORM_THREAD and persist() would then save
+      // code:"" over the real record — a data-loss path.
+      if (!get().threads[threadId]) return;
       // Adopt the version being viewed: drop everything after it so it becomes
       // the head, then autosave.
       patch(threadId, (prev) => {
diff --git a/packages/ui/src/features/code-editor/hooks/useFileContent.ts b/packages/ui/src/features/code-editor/hooks/useFileContent.ts
index a13018806c..37f598b067 100644
--- a/packages/ui/src/features/code-editor/hooks/useFileContent.ts
+++ b/packages/ui/src/features/code-editor/hooks/useFileContent.ts
@@ -1,6 +1,12 @@
 import { useHostTRPC } from "@posthog/host-router/react";
 import { useQuery } from "@tanstack/react-query";
 
+// File bodies (and especially base64 blobs) are the largest payloads in the
+// query cache; the default 5-minute gcTime keeps every file viewed across
+// every task resident simultaneously. Drop unobserved entries quickly — a
+// re-open re-reads from local disk, which is cheap.
+const FILE_CONTENT_GC_MS = 30 * 1000;
+
 export function useRepoFileContent(
   repoPath: string,
   filePath: string,
@@ -13,6 +19,7 @@ export function useRepoFileContent(
       {
         enabled,
         staleTime: Number.POSITIVE_INFINITY,
+        gcTime: FILE_CONTENT_GC_MS,
       },
     ),
   );
@@ -26,6 +33,7 @@ export function useAbsoluteFileContent(filePath: string, enabled: boolean) {
       {
         enabled,
         staleTime: Number.POSITIVE_INFINITY,
+        gcTime: FILE_CONTENT_GC_MS,
       },
     ),
   );
@@ -39,6 +47,7 @@ export function useFileAsBase64(filePath: string, enabled: boolean) {
       {
         enabled,
         staleTime: Number.POSITIVE_INFINITY,
+        gcTime: FILE_CONTENT_GC_MS,
       },
     ),
   );
diff --git a/packages/ui/src/features/command/keyboard-shortcuts.ts b/packages/ui/src/features/command/keyboard-shortcuts.ts
index 94279b6490..a384557310 100644
--- a/packages/ui/src/features/command/keyboard-shortcuts.ts
+++ b/packages/ui/src/features/command/keyboard-shortcuts.ts
@@ -2,7 +2,8 @@ import { isMac } from "@posthog/ui/utils/platform";
 
 export const SHORTCUTS = {
   COMMAND_MENU: "mod+k",
-  NEW_TASK: "mod+n,mod+t",
+  NEW_TASK: "mod+n",
+  NEW_TAB: "mod+t",
   SETTINGS: "mod+,",
   SHORTCUTS_SHEET: "mod+/",
   GO_BACK: "mod+[",
@@ -52,7 +53,13 @@ export const KEYBOARD_SHORTCUTS: KeyboardShortcut[] = [
     keys: "mod+n",
     description: "New task",
     category: "general",
-    alternateKeys: "mod+t",
+  },
+  {
+    id: "new-tab",
+    keys: SHORTCUTS.NEW_TAB,
+    description: "New tab",
+    category: "navigation",
+    context: "Channels",
   },
   {
     id: "command-menu",
diff --git a/packages/ui/src/features/sidebar/components/MainSidebar.tsx b/packages/ui/src/features/sidebar/components/MainSidebar.tsx
deleted file mode 100644
index 08a453433e..0000000000
--- a/packages/ui/src/features/sidebar/components/MainSidebar.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import { useOnboardingStore } from "@posthog/ui/features/onboarding/onboardingStore";
-import { Sidebar } from "@posthog/ui/features/sidebar/components/Sidebar";
-import { SidebarContent } from "@posthog/ui/features/sidebar/components/SidebarContent";
-import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
-import { useTaskSelectionStore } from "@posthog/ui/features/sidebar/taskSelectionStore";
-import { useWorkspaces } from "@posthog/ui/features/workspace/useWorkspace";
-import { Box } from "@radix-ui/themes";
-import { useEffect } from "react";
-
-function isEditableTarget(target: EventTarget | null): boolean {
-  if (!(target instanceof HTMLElement)) return false;
-  if (target.isContentEditable) return true;
-  const tag = target.tagName;
-  return tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT";
-}
-
-export function MainSidebar() {
-  const { data: workspaces = {}, isFetched } = useWorkspaces();
-  const hasCompletedOnboarding = useOnboardingStore(
-    (state) => state.hasCompletedOnboarding,
-  );
-  const setOpenAuto = useSidebarStore((state) => state.setOpenAuto);
-
-  useEffect(() => {
-    if (isFetched) {
-      const workspaceCount = Object.keys(workspaces).length;
-      setOpenAuto(hasCompletedOnboarding || workspaceCount > 0);
-    }
-  }, [isFetched, workspaces, hasCompletedOnboarding, setOpenAuto]);
-
-  useEffect(() => {
-    const handler = (e: KeyboardEvent) => {
-      if (e.key !== "Escape") return;
-      if (isEditableTarget(e.target)) return;
-      const { selectedTaskIds, clearSelection } =
-        useTaskSelectionStore.getState();
-      if (selectedTaskIds.length === 0) return;
-      clearSelection();
-    };
-    window.addEventListener("keydown", handler);
-    return () => window.removeEventListener("keydown", handler);
-  }, []);
-
-  return (
-    <Box flexShrink="0" className="shrink-0">
-      <Sidebar>
-        <SidebarContent />
-      </Sidebar>
-    </Box>
-  );
-}
diff --git a/packages/ui/src/features/sidebar/components/ProjectSwitcher.tsx b/packages/ui/src/features/sidebar/components/ProjectSwitcher.tsx
index 8d94609e42..2d912da5ba 100644
--- a/packages/ui/src/features/sidebar/components/ProjectSwitcher.tsx
+++ b/packages/ui/src/features/sidebar/components/ProjectSwitcher.tsx
@@ -21,7 +21,6 @@ import {
   AutocompleteItem,
   AutocompleteList,
   AutocompleteStatus,
-  Button,
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuGroup,
@@ -55,17 +54,11 @@ import { openExternalUrl } from "@posthog/ui/shell/openExternal";
 import { isMac } from "@posthog/ui/utils/platform";
 import { getPostHogUrl } from "@posthog/ui/utils/urls";
 import { Avatar, Box } from "@radix-ui/themes";
-import { ChevronDownIcon, ChevronRightIcon } from "lucide-react";
+import { ChevronRightIcon } from "lucide-react";
 import { type ReactNode, useMemo, useState } from "react";
 
-// `item` (default) is the two-line user/project card used in the Code sidebar.
-// `button` is a compact bordered button showing just the project name + a
-// chevron, used as the Channels-space header.
-export function ProjectSwitcher({
-  triggerVariant = "item",
-}: {
-  triggerVariant?: "item" | "button";
-} = {}) {
+// The two-line user/project card used at the bottom of the sidebar.
+export function ProjectSwitcher() {
   const [popoverOpen, setPopoverOpen] = useState(false);
 
   const currentOrgId = useAuthStateValue((state) => state.currentOrgId);
@@ -177,58 +170,37 @@ export function ProjectSwitcher({
   return (
     <DropdownMenu open={popoverOpen} onOpenChange={setPopoverOpen}>
       <DropdownMenuTrigger
-        nativeButton={triggerVariant === "button"}
         render={
-          triggerVariant === "button" ? (
-            <Button
-              variant="outline"
-              size="default"
-              className="w-full justify-between gap-2 font-bold"
-            >
-              <span className="truncate">
+          <Item
+            size="xs"
+            className="border-border hover:bg-fill-hover aria-expanded:bg-fill-active"
+          >
+            <ItemContent className="select-none gap-0">
+              <ItemTitle>
                 {currentProject?.name ?? "No project selected"}
-              </span>
-              <ChevronDownIcon className="size-3.5 shrink-0 text-gray-11" />
-            </Button>
-          ) : (
-            <Item
-              size="xs"
-              className="border-border hover:bg-fill-hover aria-expanded:bg-fill-active"
-            >
-              <ItemContent className="select-none">
-                <ItemTitle>
-                  {currentProject?.name ?? "No project selected"}
-                </ItemTitle>
-                <ItemDescription className="text-[11px]">
-                  {currentUser?.email ?? "No email"}
-                </ItemDescription>
-              </ItemContent>
-              <ItemActions>
-                <ChevronRightIcon className="size-4 rotate-270 group-aria-expanded/item:rotate-90" />
-              </ItemActions>
-            </Item>
-          )
+              </ItemTitle>
+              <ItemDescription className="text-[11px]">
+                {currentUser?.email ?? "No email"}
+              </ItemDescription>
+            </ItemContent>
+            <ItemActions>
+              <ChevronRightIcon className="size-4 rotate-270 group-aria-expanded/item:rotate-90" />
+            </ItemActions>
+          </Item>
         }
       />
 
       <DropdownMenuContent
         align="start"
         side="bottom"
-        className={
-          // The `button` trigger spans the full sidebar width, so binding the
-          // menu to `--anchor-width` would stretch it and break the layout. Pin
-          // a fixed width there; the `item` trigger matches its anchor.
-          triggerVariant === "button"
-            ? "w-64 min-w-64 pt-0"
-            : "w-(--anchor-width) max-w-(--anchor-width) pt-0"
-        }
+        className="w-(--anchor-width) max-w-(--anchor-width) pt-0"
         sideOffset={4}
       >
         <Box>
           <Box className="-mx-1 mb-1 border-border border-b">
             {currentUser ? (
               <Item className="p-2">
-                <ItemContent>
+                <ItemContent className="gap-0">
                   <ItemTitle>
                     {currentUser.first_name && (
                       <span>
@@ -543,10 +515,10 @@ function SearchableFlyout({
             fits below either trigger row, so the popup itself never grows
             a second scrollbar. */}
         <AutocompleteList
-          className={`${items.length > 5 ? "h-40" : "max-h-40"} pt-1`}
+          className={`${items.length > 5 ? "h-40" : "max-h-40"} p-0 pb-0`}
         >
           {(section: FlyoutSection) => (
-            <AutocompleteGroup items={section.items}>
+            <AutocompleteGroup items={section.items} className="p-0">
               <AutocompleteCollection>
                 {(item: FlyoutItem) => (
                   <AutocompleteItem
diff --git a/packages/ui/src/features/sidebar/components/SidebarContent.tsx b/packages/ui/src/features/sidebar/components/SidebarContent.tsx
deleted file mode 100644
index ff7e14f616..0000000000
--- a/packages/ui/src/features/sidebar/components/SidebarContent.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { ArchiveIcon } from "@phosphor-icons/react";
-import { useArchivedTaskIds } from "@posthog/ui/features/archive/useArchivedTaskIds";
-import { SidebarUsageBar } from "@posthog/ui/features/billing/SidebarUsageBar";
-import { ProjectSwitcher } from "@posthog/ui/features/sidebar/components/ProjectSwitcher";
-import { SidebarMenu } from "@posthog/ui/features/sidebar/components/SidebarMenu";
-import { UpdateBanner } from "@posthog/ui/features/sidebar/components/UpdateBanner";
-import { navigateToArchived } from "@posthog/ui/router/navigationBridge";
-import { Box, Flex } from "@radix-ui/themes";
-import type React from "react";
-
-export const SidebarContent: React.FC = () => {
-  const archivedTaskIds = useArchivedTaskIds();
-  return (
-    <Flex direction="column" height="100%">
-      <Box flexGrow="1" overflow="hidden">
-        <SidebarMenu />
-      </Box>
-      <UpdateBanner />
-      <SidebarUsageBar />
-      {archivedTaskIds.size > 0 && (
-        <Box className="shrink-0 border-gray-6 border-t">
-          <button
-            type="button"
-            className="flex w-full items-center gap-1 bg-transparent px-2 py-1.5 text-left text-[13px] text-gray-11 transition-colors hover:bg-gray-3"
-            onClick={navigateToArchived}
-          >
-            <span className="flex h-[18px] w-[18px] shrink-0 items-center justify-center text-gray-10">
-              <ArchiveIcon size={14} />
-            </span>
-            <span className="text-gray-11">Archived</span>
-          </button>
-        </Box>
-      )}
-      <Box p="2" className="shrink-0 border-gray-6 border-t">
-        <ProjectSwitcher />
-      </Box>
-    </Flex>
-  );
-};
diff --git a/packages/ui/src/features/sidebar/components/SidebarMenu.tsx b/packages/ui/src/features/sidebar/components/SidebarMenu.tsx
index 20d5828315..29c274b45f 100644
--- a/packages/ui/src/features/sidebar/components/SidebarMenu.tsx
+++ b/packages/ui/src/features/sidebar/components/SidebarMenu.tsx
@@ -1,7 +1,6 @@
 import { findGroupFolder } from "@posthog/core/sidebar/groupTasks";
 import { isTaskActivelyRunning } from "@posthog/core/sidebar/taskRunning";
 import { useHostTRPCClient } from "@posthog/host-router/react";
-import { Separator } from "@posthog/quill";
 import type { Task } from "@posthog/shared/types";
 import {
   archiveTasksImperative,
@@ -35,12 +34,18 @@ import { useQueryClient } from "@tanstack/react-query";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { ArchiveRunningTaskDialog } from "./ArchiveRunningTaskDialog";
 import { SidebarItem } from "./SidebarItem";
-import { SidebarNavSection } from "./SidebarNavSection";
 import { TaskListView } from "./TaskListView";
 import { TasksHeader } from "./TasksHeader";
 
 const log = logger.scope("sidebar-menu");
 
+function isEditableTarget(target: EventTarget | null): boolean {
+  if (!(target instanceof HTMLElement)) return false;
+  if (target.isContentEditable) return true;
+  const tag = target.tagName;
+  return tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT";
+}
+
 function SidebarMenuComponent() {
   const hostClient = useHostTRPCClient();
   const archiveCacheKeys = useArchiveCacheKeys();
@@ -104,6 +109,21 @@ function SidebarMenuComponent() {
     taskTitle: string;
   } | null>(null);
 
+  // Escape clears any bulk task selection (moved here from the retired
+  // MainSidebar so it survives with the task list in the unified sidebar).
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.key !== "Escape") return;
+      if (isEditableTarget(e.target)) return;
+      const { selectedTaskIds, clearSelection } =
+        useTaskSelectionStore.getState();
+      if (selectedTaskIds.length === 0) return;
+      clearSelection();
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, []);
+
   const selectedTaskIds = useTaskSelectionStore((s) => s.selectedTaskIds);
   const toggleTaskSelection = useTaskSelectionStore(
     (s) => s.toggleTaskSelection,
@@ -430,18 +450,6 @@ function SidebarMenuComponent() {
       id="side-bar-menu"
       className="flex min-h-0 flex-col"
     >
-      {/* Derive the command-center count from data SidebarMenu already holds,
-          so the nested nav section doesn't open its own task subscription. */}
-      <SidebarNavSection
-        commandCenterActiveCount={commandCenterCells.reduce(
-          (count, taskId) =>
-            taskId != null && taskMap.has(taskId) ? count + 1 : count,
-          0,
-        )}
-      />
-
-      <Separator className="mx-2 my-2 shrink-0" />
-
       <TasksHeader />
 
       <div className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden">
diff --git a/packages/ui/src/features/sidebar/components/SidebarNavSection.tsx b/packages/ui/src/features/sidebar/components/SidebarNavSection.tsx
index 77162f0759..5dd3b59233 100644
--- a/packages/ui/src/features/sidebar/components/SidebarNavSection.tsx
+++ b/packages/ui/src/features/sidebar/components/SidebarNavSection.tsx
@@ -1,3 +1,7 @@
+import { HashIcon } from "@phosphor-icons/react";
+import { Badge, Switch } from "@posthog/quill";
+import { PROJECT_BLUEBIRD_FLAG } from "@posthog/shared";
+import { ANALYTICS_EVENTS } from "@posthog/shared/analytics-events";
 import { HOME_TAB_FLAG } from "@posthog/shared/constants";
 import { useCommandCenterStore } from "@posthog/ui/features/command-center/commandCenterStore";
 import { useFeatureFlag } from "@posthog/ui/features/feature-flags/useFeatureFlag";
@@ -6,6 +10,7 @@ import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
 import { useTasks } from "@posthog/ui/features/tasks/useTasks";
 import { useSpendAnalysisEnabled } from "@posthog/ui/features/usage/useSpendAnalysisEnabled";
 import {
+  navigateToActivity,
   navigateToAgents,
   navigateToCommandCenter,
   navigateToHome,
@@ -20,9 +25,11 @@ import {
 } from "@posthog/ui/router/navigationBridge";
 import { useAppView } from "@posthog/ui/router/useAppView";
 import { openTaskInput } from "@posthog/ui/router/useOpenTask";
+import { track } from "@posthog/ui/shell/analytics";
 import { useCommandMenuStore } from "@posthog/ui/shell/commandMenuStore";
 import { Box, Flex } from "@radix-ui/themes";
 import { useRouterState } from "@tanstack/react-router";
+import { ActivityItem } from "./items/ActivityItem";
 import { AgentsItem } from "./items/AgentsItem";
 import { CommandCenterItem } from "./items/CommandCenterItem";
 import { HomeItem } from "./items/HomeItem";
@@ -57,6 +64,15 @@ export function SidebarNavSection({
   const view = useAppView();
   const homeTabEnabled = useFeatureFlag(HOME_TAB_FLAG);
   const usageEnabled = useSpendAnalysisEnabled();
+  // Channels stay behind project-bluebird: the "Enable channels" nav row (and
+  // the Canvas row it reveals) only appear where the canvas backend is wired.
+  const bluebirdEnabled = useFeatureFlag(
+    PROJECT_BLUEBIRD_FLAG,
+    import.meta.env.DEV,
+  );
+  const channelsEnabled =
+    useSidebarStore((s) => s.channelsEnabled) && bluebirdEnabled;
+  const setChannelsEnabled = useSidebarStore((s) => s.setChannelsEnabled);
 
   // When this section renders inside the Channels space, the destinations that
   // have a /website mirror stay in that space; everything else (and the whole
@@ -81,6 +97,7 @@ export function SidebarNavSection({
   const isHomeActive =
     view.type === "task-input" || view.type === "task-pending";
   const isHomeViewActive = view.type === "home";
+  const isActivityActive = view.type === "activity";
   const isInboxActive = view.type === "inbox";
   const isAgentsActive = view.type === "agents";
   const isCommandCenterActive = view.type === "command-center";
@@ -157,7 +174,7 @@ export function SidebarNavSection({
         <McpServersItem isActive={isMcpServersActive} onClick={goMcpServers} />
       </Box>
 
-      <Box mb={usageEnabled ? undefined : "2"}>
+      <Box mb={usageEnabled || bluebirdEnabled ? undefined : "2"}>
         <CommandCenterItem
           isActive={isCommandCenterActive}
           onClick={goCommandCenter}
@@ -170,6 +187,56 @@ export function SidebarNavSection({
           <UsageItem isActive={isUsageActive} onClick={navigateToUsage} />
         </Box>
       )}
+
+      {/* "Channels" is a toggle laid out as a nav row: the # label and Alpha
+          badge on the left, a Switch on the right. It flips the channels
+          feature rather than routing — enabling it reveals the Canvas row
+          below and swaps the sidebar body to the channel tree. A <label> (not a
+          nav Button) so the Switch can live inside it without nesting buttons. */}
+      {bluebirdEnabled && (
+        <label
+          htmlFor="channels-toggle"
+          className="group flex w-full cursor-pointer items-center gap-2 rounded px-2 py-1 text-[13px] leading-snug transition-colors hover:bg-fill-secondary"
+        >
+          <span className="flex shrink-0 items-center opacity-80">
+            <HashIcon size={16} />
+          </span>
+          <span className="min-w-0 truncate font-medium">Channels</span>
+          <Badge variant="info">Alpha</Badge>
+          <Switch
+            id="channels-toggle"
+            size="sm"
+            className="ml-auto"
+            checked={channelsEnabled}
+            onCheckedChange={(checked) => {
+              setChannelsEnabled(checked);
+              track(ANALYTICS_EVENTS.CHANNEL_ACTION, {
+                action_type: "toggle_channels",
+                surface: "nav",
+              });
+              // The unified sidebar removed the Code↔Channels space boundary;
+              // this toggle is its successor. Keep firing the legacy
+              // enter/leave events so space-adoption dashboards stay continuous.
+              track(ANALYTICS_EVENTS.CHANNEL_ACTION, {
+                action_type: checked ? "enter_space" : "leave_space",
+                surface: "nav",
+              });
+            }}
+          />
+        </label>
+      )}
+
+      {/* Activity (the mentions feed) is a channels surface, so it only appears
+          once channels are enabled — sitting directly under the toggle that
+          reveals it. */}
+      {channelsEnabled && (
+        <Box>
+          <ActivityItem
+            isActive={isActivityActive}
+            onClick={navigateToActivity}
+          />
+        </Box>
+      )}
     </Flex>
   );
 }
diff --git a/packages/ui/src/features/sidebar/components/items/ActivityItem.tsx b/packages/ui/src/features/sidebar/components/items/ActivityItem.tsx
new file mode 100644
index 0000000000..5ccd296933
--- /dev/null
+++ b/packages/ui/src/features/sidebar/components/items/ActivityItem.tsx
@@ -0,0 +1,41 @@
+import { BellIcon } from "@phosphor-icons/react";
+import { countUnseenActivity } from "@posthog/core/canvas/mentionActivity";
+import { useMentionActivity } from "@posthog/ui/features/canvas/hooks/useMentionActivity";
+import { useActivitySeenStore } from "@posthog/ui/features/canvas/stores/activitySeenStore";
+import { useMemo } from "react";
+import { SidebarItem } from "../SidebarItem";
+import { SidebarCountBadge } from "./SidebarCountBadge";
+
+interface ActivityItemProps {
+  isActive: boolean;
+  onClick: () => void;
+}
+
+// The Activity nav row with its unread-mentions dot. Owns the mentions
+// subscription so the query mounts once here; the badge counts thread mentions
+// newer than the last time the Activity page was opened.
+export function ActivityItem({ isActive, onClick }: ActivityItemProps) {
+  const { items } = useMentionActivity();
+  const lastSeenAt = useActivitySeenStore((s) => s.lastSeenAt);
+  const unseen = useMemo(
+    () => countUnseenActivity(items, lastSeenAt),
+    [items, lastSeenAt],
+  );
+  return (
+    <SidebarItem
+      depth={0}
+      icon={<BellIcon size={16} weight={isActive ? "fill" : "regular"} />}
+      label={
+        <>
+          Activity
+          <SidebarCountBadge
+            count={unseen}
+            title={`${unseen} new ${unseen === 1 ? "mention" : "mentions"}`}
+          />
+        </>
+      }
+      isActive={isActive}
+      onClick={onClick}
+    />
+  );
+}
diff --git a/packages/ui/src/features/sidebar/sidebarStore.ts b/packages/ui/src/features/sidebar/sidebarStore.ts
index d2f5506094..ea36dd2b20 100644
--- a/packages/ui/src/features/sidebar/sidebarStore.ts
+++ b/packages/ui/src/features/sidebar/sidebarStore.ts
@@ -17,6 +17,10 @@ interface SidebarStoreState {
   showAllUsers: boolean;
   showInternal: boolean;
   taskTypeFilter: WorkspaceMode[];
+  // Reveals the Channels feature in the unified sidebar (channel tree replaces
+  // the task list, Canvas nav item appears). Off by default — Code merged into
+  // the Bluebird chrome ships with channels hidden until the user opts in.
+  channelsEnabled: boolean;
 }
 
 interface SidebarStoreActions {
@@ -36,6 +40,7 @@ interface SidebarStoreActions {
   setShowAllUsers: (showAllUsers: boolean) => void;
   setShowInternal: (showInternal: boolean) => void;
   toggleTaskType: (mode: WorkspaceMode) => void;
+  setChannelsEnabled: (channelsEnabled: boolean) => void;
 }
 
 type SidebarStore = SidebarStoreState & SidebarStoreActions;
@@ -55,6 +60,7 @@ export const useSidebarStore = create<SidebarStore>()(
       showAllUsers: false,
       showInternal: false,
       taskTypeFilter: [...ALL_WORKSPACE_MODES],
+      channelsEnabled: false,
       setOpen: (open) => set({ open, hasUserSetOpen: true }),
       setOpenAuto: (open) =>
         set((state) => (state.hasUserSetOpen ? state : { open })),
@@ -111,6 +117,7 @@ export const useSidebarStore = create<SidebarStore>()(
             ? state.taskTypeFilter.filter((m) => m !== mode)
             : [...state.taskTypeFilter, mode],
         })),
+      setChannelsEnabled: (channelsEnabled) => set({ channelsEnabled }),
     }),
     {
       name: "sidebar-storage",
@@ -126,6 +133,7 @@ export const useSidebarStore = create<SidebarStore>()(
         showAllUsers: state.showAllUsers,
         showInternal: state.showInternal,
         taskTypeFilter: state.taskTypeFilter,
+        channelsEnabled: state.channelsEnabled,
       }),
       merge: (persisted, current) => {
         const persistedState = persisted as {
@@ -140,6 +148,7 @@ export const useSidebarStore = create<SidebarStore>()(
           showAllUsers?: boolean;
           showInternal?: boolean;
           taskTypeFilter?: WorkspaceMode[];
+          channelsEnabled?: boolean;
         };
         return {
           ...current,
@@ -160,6 +169,8 @@ export const useSidebarStore = create<SidebarStore>()(
           showInternal: persistedState.showInternal ?? current.showInternal,
           taskTypeFilter:
             persistedState.taskTypeFilter ?? current.taskTypeFilter,
+          channelsEnabled:
+            persistedState.channelsEnabled ?? current.channelsEnabled,
         };
       },
     },
diff --git a/packages/ui/src/router/routeSkeletons.tsx b/packages/ui/src/router/routeSkeletons.tsx
new file mode 100644
index 0000000000..36c9fd0134
--- /dev/null
+++ b/packages/ui/src/router/routeSkeletons.tsx
@@ -0,0 +1,141 @@
+import { Skeleton } from "@posthog/quill";
+import type { ReactElement } from "react";
+import { yieldToPaint } from "./yieldToPaint";
+
+/**
+ * Per-route-kind pending skeletons, rendered as `pendingComponent` while a
+ * route's loader awaits `yieldToPaint()`. They paint in the frame after a tab
+ * click — before the destination's heavy mount — so they must stay trivially
+ * cheap: static shapes only, no data, no hooks, no measurement.
+ *
+ * Each route kind gets its own silhouette so the loading state already reads
+ * as the destination (chat thread vs. canvas grid vs. list), not a generic
+ * spinner swap.
+ */
+
+/**
+ * Route options for a skeleton-first navigation: paint `skeleton` for the
+ * single frame `yieldToPaint()` holds the route pending, then mount the real
+ * view behind it. Spread into `createFileRoute` options:
+ *
+ *   createFileRoute("/skills")({ component: SkillsView,
+ *     ...withRouteSkeleton(AppPageSkeleton) })
+ *
+ * Routes with a real (cache-reading) loader can't use this — they await
+ * `yieldToPaint()` inside their own loader and set `pendingComponent`
+ * directly. Never await anything slower than a frame in a loader; a
+ * network-blocked loader makes the route un-navigable when the fetch hangs.
+ */
+export function withRouteSkeleton(skeleton: () => ReactElement) {
+  return { pendingComponent: skeleton, loader: yieldToPaint };
+}
+
+/** Task detail: chat thread (alternating agent/user bubbles) + composer bar. */
+export function TaskDetailSkeleton() {
+  return (
+    <div className="flex h-full w-full flex-col">
+      <div className="mx-auto flex w-full max-w-3xl flex-1 flex-col gap-6 overflow-hidden px-4 pt-6">
+        <div className="flex justify-end">
+          <Skeleton className="h-14 w-[55%]" />
+        </div>
+        <div className="flex flex-col gap-2">
+          <Skeleton className="h-3.5 w-[40%]" />
+          <Skeleton className="h-3.5 w-[85%]" />
+          <Skeleton className="h-3.5 w-[70%]" />
+        </div>
+        <div className="flex justify-end">
+          <Skeleton className="h-10 w-[35%]" />
+        </div>
+        <div className="flex flex-col gap-2">
+          <Skeleton className="h-3.5 w-[60%]" />
+          <Skeleton className="h-3.5 w-[90%]" />
+          <Skeleton className="h-3.5 w-[45%]" />
+        </div>
+      </div>
+      <div className="mx-auto w-full max-w-3xl px-4 pb-4">
+        <Skeleton className="h-22 w-full" />
+      </div>
+    </div>
+  );
+}
+
+/** Canvas/dashboard: toolbar row + card grid. */
+export function CanvasSkeleton() {
+  return (
+    <div className="flex h-full w-full flex-col gap-4 p-4">
+      <div className="flex items-center gap-2">
+        <Skeleton className="h-6 w-45" />
+        <div className="flex-1" />
+        <Skeleton className="h-7 w-20" />
+        <Skeleton className="h-7 w-20" />
+      </div>
+      <div className="grid flex-1 grid-cols-3 content-start gap-4">
+        <Skeleton className="h-40 w-full" />
+        <Skeleton className="h-40 w-full" />
+        <Skeleton className="h-40 w-full" />
+        <Skeleton className="h-40 w-full" />
+        <Skeleton className="h-40 w-full" />
+        <Skeleton className="h-40 w-full" />
+      </div>
+    </div>
+  );
+}
+
+/** Shared list-page silhouette: header row + subtitle + uniform rows. */
+function ListPageSkeleton({
+  maxWidthClass,
+  rowHeightClass,
+  rowCount,
+  trailingAction,
+}: {
+  maxWidthClass: string;
+  rowHeightClass: string;
+  rowCount: number;
+  trailingAction?: boolean;
+}) {
+  return (
+    <div
+      className={`mx-auto flex h-full w-full ${maxWidthClass} flex-col gap-4 p-6`}
+    >
+      <div className="flex items-center gap-3">
+        <Skeleton className="h-7 w-55" />
+        {trailingAction && (
+          <>
+            <div className="flex-1" />
+            <Skeleton className="h-7 w-24" />
+          </>
+        )}
+      </div>
+      <Skeleton className="h-3.5 w-[50%]" />
+      <div className="mt-2 flex flex-col gap-2">
+        {Array.from({ length: rowCount }).map((_, i) => (
+          // biome-ignore lint/suspicious/noArrayIndexKey: static skeleton row
+          <Skeleton key={i} className={`${rowHeightClass} w-full`} />
+        ))}
+      </div>
+    </div>
+  );
+}
+
+/** Channel pages (home / inbox / artifacts / history / context): header + rows. */
+export function ChannelSkeleton() {
+  return (
+    <ListPageSkeleton
+      maxWidthClass="max-w-4xl"
+      rowHeightClass="h-14"
+      rowCount={5}
+    />
+  );
+}
+
+/** Top-level app pages (home, inbox, agents, skills, MCP servers, command center). */
+export function AppPageSkeleton() {
+  return (
+    <ListPageSkeleton
+      maxWidthClass="max-w-5xl"
+      rowHeightClass="h-12"
+      rowCount={6}
+      trailingAction
+    />
+  );
+}
diff --git a/packages/ui/src/router/router.ts b/packages/ui/src/router/router.ts
index fdf8329370..ad98875925 100644
--- a/packages/ui/src/router/router.ts
+++ b/packages/ui/src/router/router.ts
@@ -11,9 +11,19 @@ export const router = createTanStackRouter({
   routeTree,
   history: createHashHistory(),
   defaultPreload: "intent",
+  // Preloads only warm code imports — never satisfy a navigation's loader.
+  // Loaders here are single-frame yields (see yieldToPaint) whose whole point
+  // is to run ON navigation so the pending skeleton paints; a hover-preloaded
+  // loader result would let the navigation commit synchronously and freeze the
+  // old screen through the destination's heavy mount again.
+  defaultPreloadStaleTime: 0,
   // Show the route's pending UI the instant its loader is still resolving, so
   // navigation commits immediately instead of stalling on the previous screen.
   defaultPendingMs: 0,
+  // Don't hold the pending UI for the default 500ms minimum — skeletons paint
+  // for exactly the frame(s) a `yieldToPaint()` loader needs, then the real
+  // view replaces them as soon as it has rendered.
+  defaultPendingMinMs: 0,
   defaultPendingComponent: RoutePending,
   defaultNotFoundComponent: RouteNotFound,
   scrollRestoration: false,
diff --git a/packages/ui/src/router/routes/__root.tsx b/packages/ui/src/router/routes/__root.tsx
index 258f42e5ce..a4563b20cd 100644
--- a/packages/ui/src/router/routes/__root.tsx
+++ b/packages/ui/src/router/routes/__root.tsx
@@ -20,7 +20,7 @@ import { UsageLimitModal } from "@posthog/ui/features/billing/UsageLimitModal";
 import { BlankTabView } from "@posthog/ui/features/browser-tabs/BlankTabView";
 import { BrowserTabStrip } from "@posthog/ui/features/browser-tabs/BrowserTabStrip";
 import { BrowserTabsDndProvider } from "@posthog/ui/features/browser-tabs/BrowserTabsDnd";
-import { useTabsSnapshot } from "@posthog/ui/features/browser-tabs/useBrowserTabs";
+import { useActiveTabIsBlank } from "@posthog/ui/features/browser-tabs/useBrowserTabs";
 import { ChannelsSidebar } from "@posthog/ui/features/canvas/components/ChannelsSidebar";
 import { useChannelsSidebarStore } from "@posthog/ui/features/canvas/components/channelsSidebarStore";
 import {
@@ -41,7 +41,7 @@ import { useInboxDeepLink } from "@posthog/ui/features/inbox/hooks/useInboxDeepL
 import { useIntegrations } from "@posthog/ui/features/integrations/useIntegrations";
 import { useScoutDeepLink } from "@posthog/ui/features/scouts/hooks/useScoutDeepLink";
 import { useSetupDiscovery } from "@posthog/ui/features/setup/useSetupDiscovery";
-import { MainSidebar } from "@posthog/ui/features/sidebar/components/MainSidebar";
+import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
 import { useSidebarData } from "@posthog/ui/features/sidebar/useSidebarData";
 import { useVisualTaskOrder } from "@posthog/ui/features/sidebar/useVisualTaskOrder";
 import { ExistingWorktreeDialog } from "@posthog/ui/features/task-detail/components/ExistingWorktreeDialog";
@@ -55,15 +55,16 @@ import LogosLandscape from "@posthog/ui/primitives/Logo";
 import { useAppView } from "@posthog/ui/router/useAppView";
 import { openTask, openTaskInput } from "@posthog/ui/router/useOpenTask";
 import { track } from "@posthog/ui/shell/analytics";
+import { ContentHeader } from "@posthog/ui/shell/ContentHeader";
 import { useCommandMenuStore } from "@posthog/ui/shell/commandMenuStore";
 import { GlobalEventHandlers } from "@posthog/ui/shell/GlobalEventHandlers";
-import { HeaderRow } from "@posthog/ui/shell/HeaderRow";
 import { HedgehogMode } from "@posthog/ui/shell/HedgehogMode";
 import { logger } from "@posthog/ui/shell/logger";
 import { onFeatureFlagsLoaded } from "@posthog/ui/shell/posthogAnalyticsImpl";
 import { SpaceSwitcher } from "@posthog/ui/shell/SpaceSwitcher";
 import { useShortcutsSheetStore } from "@posthog/ui/shell/shortcutsSheetStore";
 import { openUrlInBrowser } from "@posthog/ui/utils/browser";
+import { isWindows } from "@posthog/ui/utils/platform";
 import { getPostHogUrl } from "@posthog/ui/utils/urls";
 import { Box, Flex } from "@radix-ui/themes";
 import { useQueryClient } from "@tanstack/react-query";
@@ -71,7 +72,6 @@ import {
   createRootRoute,
   Outlet,
   useCanGoBack,
-  useNavigate,
   useRouter,
   useRouterState,
 } from "@tanstack/react-router";
@@ -83,18 +83,28 @@ import { useEffect, useRef, useState } from "react";
 
 const log = logger.scope("root-route");
 
+// On Windows the frameless window overlays the min/max/close controls on the
+// top-right of the title bar (see window.ts titleBarOverlay). Reserve that strip
+// so the tab strip / PostHog Web button never render under the native controls.
+const WINDOWS_TITLEBAR_INSET = 140;
+
 export const Route = createRootRoute({
   component: RootLayout,
 });
 
 function RootLayout() {
   const view = useAppView();
-  const navigate = useNavigate();
   const router = useRouter();
   const canGoBack = useCanGoBack();
   // Width of the Channels sidebar below — used to right-align the back/forward
   // buttons in the title bar with the sidebar's (and project switcher's) right edge.
   const channelsSidebarWidth = useChannelsSidebarStore((state) => state.width);
+  // Suppress the title-bar width transition during a live drag so it tracks
+  // the sidebar frame-for-frame; when the sidebar toggles open/closed, both
+  // animate with the same curve (see ResizableSidebar).
+  const sidebarIsResizing = useChannelsSidebarStore(
+    (state) => state.isResizing,
+  );
   // Forward availability isn't exposed by the router (and history.length counts
   // pre-app entries, so it can't be compared to __TSR_index). Track the newest
   // index we've reached: only a PUSH wipes the forward stack, so it resets the
@@ -115,9 +125,8 @@ function RootLayout() {
   }, [router]);
   const canGoForward = historyIndex < newestIndex;
 
-  // Feedback modal shown in the Channels title bar as an intercept before
-  // navigating away — "Exit" (mode "leaving") and "PostHog Web" (mode
-  // "posthog-web"), each of which routes once the modal is submitted or skipped.
+  // Feedback modal shown as an intercept before "PostHog Web" opens the web
+  // app, routing once the modal is submitted or skipped.
   const [feedbackMode, setFeedbackMode] = useState<FeedbackModalMode | null>(
     null,
   );
@@ -131,14 +140,12 @@ function RootLayout() {
     currentProjectId ? `/project/${currentProjectId}` : "/",
   );
 
-  // Both "Go back to Code" and "PostHog Web" open the feedback modal first and
-  // perform their navigation only once it's submitted or skipped.
+  // "PostHog Web" opens the feedback modal first and performs its navigation
+  // only once the modal is submitted or skipped.
   const handleFeedbackFinished = () => {
     const finishedMode = feedbackMode;
     setFeedbackMode(null);
-    if (finishedMode === "leaving") {
-      navigate({ to: "/code" });
-    } else if (finishedMode === "posthog-web" && posthogWebUrl) {
+    if (finishedMode === "posthog-web" && posthogWebUrl) {
       void openUrlInBrowser(posthogWebUrl);
     }
   };
@@ -166,6 +173,17 @@ function RootLayout() {
   const billingEnabled = useFeatureFlag(BILLING_FLAG);
   const syncCloudTasksEnabled = useFeatureFlag(SYNC_CLOUD_TASKS_FLAG);
   const homeTabEnabled = useFeatureFlag(HOME_TAB_FLAG);
+  // "PostHog Web" is a channels-world affordance — show it only while the user
+  // is actually seeing channels (toggle on, which itself requires the flag).
+  const bluebirdEnabled = useFeatureFlag(
+    PROJECT_BLUEBIRD_FLAG,
+    import.meta.env.DEV,
+  );
+  const channelsToggleOn = useSidebarStore((s) => s.channelsEnabled);
+  const channelsEnabled = channelsToggleOn && bluebirdEnabled;
+  // When the sidebar is collapsed (Cmd+B) the title bar's left block shrinks to
+  // fit its own controls so the tab strip flushes left with the content pane.
+  const sidebarOpen = useSidebarStore((s) => s.open);
 
   const sidebarData = useSidebarData({ activeView: view });
   const visualTaskOrder = useVisualTaskOrder(sidebarData);
@@ -243,157 +261,35 @@ function RootLayout() {
     select: (s) => s.matches.some((m) => m.routeId.startsWith("/settings")),
   });
 
-  // The canvas "Channels" space (gated by project-bluebird). It owns its own
-  // layout (channel sidebar + content via WebsiteLayout), so it drops the Code
-  // chrome (header / main sidebar / space-switcher) and shows only the app rail.
-  const bluebirdEnabled = useFeatureFlag(
-    PROJECT_BLUEBIRD_FLAG,
-    import.meta.env.DEV,
-  );
+  // The Bluebird chrome is the app shell for every non-settings route now. The
+  // /website (Channels) routes own their own in-pane header (WebsiteLayout), so
+  // the shared ContentHeader is mounted only outside that space.
   const onWebsitePath = useRouterState({
     select: (s) =>
       s.location.pathname === "/website" ||
       s.location.pathname.startsWith("/website/"),
   });
-  const isChannelsSpace = bluebirdEnabled && onWebsitePath;
-
-  // A blank browser tab (the "+" new-tab page) shows an empty placeholder — but
-  // ONLY on the channels index. Inside a channel (`/website/$channelId…`) the
-  // route owns the content (channel home, inbox, artifacts, a canvas, …), so the
-  // placeholder must never replace it, otherwise channel navigation looks dead.
-  const onChannelsIndex = useRouterState({
-    select: (s) => s.location.pathname === "/website",
-  });
-  const tabsSnapshot = useTabsSnapshot();
-  const activeTabIsBlank =
-    onChannelsIndex &&
-    (() => {
-      const w =
-        tabsSnapshot.windows.find((x) => x.isPrimary) ??
-        tabsSnapshot.windows[0];
-      if (!w?.activeTabId) return false;
-      const t = tabsSnapshot.tabs.find((x) => x.id === w.activeTabId);
-      return !!t && t.dashboardId == null && t.taskId == null;
-    })();
 
   // The /website (Channels) routes stay registered regardless of the flag, so a
-  // stale URL or restored session could strand a flag-off user there (rendering
-  // the channel layout inside the Code chrome). Once flags resolve, redirect
-  // them back to Code so the off state is indistinguishable from before canvas.
+  // stale URL, a restored session, or a persisted channel browser tab could
+  // strand a flag-off user on the channel layout with no way back (the Channels
+  // toggle is hidden and ContentHeader is suppressed on /website). Once flags
+  // resolve, send them back to Code.
   useEffect(() => {
     if (flagsLoaded && !bluebirdEnabled && onWebsitePath) {
       openTaskInput();
     }
   }, [flagsLoaded, bluebirdEnabled, onWebsitePath]);
 
-  if (isChannelsSpace) {
-    return (
-      // DnD scope for the tab strip's drag-to-reorder (pill sortables live in
-      // the title bar; the provider must sit above them).
-      <BrowserTabsDndProvider>
-        <Flex direction="column" height="100%" className="bg-chrome">
-          {/* Full-width title bar: a window-drag region carrying the PostHog
-            mark. The left section matches the sidebar width so the tab strip
-            starts flush with the content pane; its padding clears the macOS
-            stoplights. */}
-          <Flex align="center" className="drag h-10 shrink-0">
-            <Flex
-              id="title-bar-left"
-              align="center"
-              justify="between"
-              gap="3"
-              className="shrink-0 pr-2 pl-[78px]"
-              style={{ width: channelsSidebarWidth }}
-            >
-              <Flex align="center" gap="2" className="no-drag">
-                <Box className="h-[14px] w-[30px] overflow-hidden [&>svg]:h-[14px] [&>svg]:w-auto">
-                  <LogosLandscape code={false} />
-                </Box>
-                <Button
-                  variant="outline"
-                  size="sm"
-                  onClick={() => {
-                    track(ANALYTICS_EVENTS.CHANNEL_ACTION, {
-                      action_type: "leave_space",
-                      surface: "title_bar",
-                    });
-                    setFeedbackMode("leaving");
-                  }}
-                >
-                  Exit
-                </Button>
-              </Flex>
-              <Flex align="center" gap="2" className="no-drag">
-                <Button
-                  variant="outline"
-                  size="icon-sm"
-                  aria-label="Back"
-                  disabled={!canGoBack}
-                  onClick={() => router.history.back()}
-                >
-                  <CaretLeftIcon size={14} />
-                </Button>
-                <Button
-                  variant="outline"
-                  size="icon-sm"
-                  aria-label="Forward"
-                  disabled={!canGoForward}
-                  onClick={() => router.history.forward()}
-                >
-                  <CaretRightIcon size={14} />
-                </Button>
-              </Flex>
-            </Flex>
-            <BrowserTabStrip />
-            <Flex align="center" className="no-drag ml-auto pr-3">
-              <Button
-                variant="outline"
-                size="sm"
-                disabled={!posthogWebUrl}
-                onClick={handleOpenPostHogWeb}
-              >
-                <ArrowSquareOut size={14} />
-                PostHog Web
-              </Button>
-            </Flex>
-          </Flex>
-          <ConnectivityBanner />
-          <Flex flexGrow="1" overflow="hidden">
-            <ChannelsSidebar />
-            {/* Content sits in a bordered, rounded card inset from the window
-              edges — the framed pane from the design. */}
-            <Box flexGrow="1" className="overflow-hidden">
-              <Box className="h-full overflow-hidden rounded-tl-sm border-border border-t border-l bg-background">
-                {activeTabIsBlank ? <BlankTabView /> : <Outlet />}
-              </Box>
-            </Box>
-          </Flex>
-          <CommandMenu
-            open={commandMenuOpen}
-            onOpenChange={setCommandMenuOpen}
-          />
-          <GlobalFilePicker />
-          <KeyboardShortcutsSheet
-            open={shortcutsSheetOpen}
-            onOpenChange={(open) => (open ? null : closeShortcutsSheet())}
-          />
-          <GlobalEventHandlers
-            onToggleCommandMenu={toggleCommandMenu}
-            onToggleShortcutsSheet={toggleShortcutsSheet}
-          />
-          {billingEnabled && <UsageLimitModal />}
-          <UpdateAvailableModal />
-          <WhatsNewModal />
-          <RemoteBranchCheckoutDialog />
-          <FeedbackModal
-            mode={feedbackMode}
-            onFinished={handleFeedbackFinished}
-          />
-          <ExistingWorktreeDialog />
-        </Flex>
-      </BrowserTabsDndProvider>
-    );
-  }
+  // A blank browser tab (the "+" new-tab page) shows an empty placeholder — but
+  // ONLY on the channels index. Inside a channel (`/website/$channelId…`) the
+  // route owns the content (channel home, inbox, artifacts, a canvas, …), so the
+  // placeholder must never replace it, otherwise channel navigation looks dead.
+  const onChannelsIndex = useRouterState({
+    select: (s) => s.location.pathname === "/website",
+  });
+  const activeTabBlank = useActiveTabIsBlank();
+  const showBlankTab = onChannelsIndex && activeTabBlank;
 
   if (isSettingsRoute) {
     return (
@@ -420,27 +316,96 @@ function RootLayout() {
   }
 
   return (
-    <Flex height="100%">
-      <Flex direction="column" flexGrow="1" overflow="hidden">
-        <HeaderRow />
+    // DnD scope for the tab strip's drag-to-reorder (pill sortables live in
+    // the title bar; the provider must sit above them).
+    <BrowserTabsDndProvider>
+      <Flex direction="column" height="100%" className="bg-chrome">
+        {/* Full-width title bar: a window-drag region carrying the PostHog
+            mark. The left section matches the sidebar width so the tab strip
+            starts flush with the content pane; its padding clears the macOS
+            stoplights. */}
+        <Flex
+          align="center"
+          className="drag h-10 shrink-0"
+          style={{
+            paddingRight: isWindows ? WINDOWS_TITLEBAR_INSET : undefined,
+          }}
+        >
+          <Flex
+            id="title-bar-left"
+            align="center"
+            justify="between"
+            gap="3"
+            className="shrink-0 pr-2 pl-[78px]"
+            style={{
+              width: sidebarOpen ? channelsSidebarWidth : undefined,
+              transition: sidebarIsResizing ? "none" : "width 0.2s ease-in-out",
+            }}
+          >
+            <Flex align="center" gap="2" className="no-drag">
+              <Box className="h-[14px] w-[30px] overflow-hidden [&>svg]:h-[14px] [&>svg]:w-auto">
+                <LogosLandscape code={false} />
+              </Box>
+            </Flex>
+            <Flex align="center" gap="2" className="no-drag">
+              <Button
+                variant="outline"
+                size="icon-sm"
+                aria-label="Back"
+                disabled={!canGoBack}
+                onClick={() => router.history.back()}
+              >
+                <CaretLeftIcon size={14} />
+              </Button>
+              <Button
+                variant="outline"
+                size="icon-sm"
+                aria-label="Forward"
+                disabled={!canGoForward}
+                onClick={() => router.history.forward()}
+              >
+                <CaretRightIcon size={14} />
+              </Button>
+            </Flex>
+          </Flex>
+          {/* Tabs work in both spaces: channel tabs under /website and plain
+              task tabs in the Code experience. The strip's route→tab effect
+              noops on param-less routes (inbox, agents, new-task), so it's safe
+              to mount everywhere. */}
+          <BrowserTabStrip />
+          {channelsEnabled && (
+            <Flex align="center" className="no-drag ml-auto pr-3">
+              <Button
+                variant="outline"
+                size="sm"
+                disabled={!posthogWebUrl}
+                onClick={handleOpenPostHogWeb}
+              >
+                <ArrowSquareOut size={14} />
+                PostHog Web
+              </Button>
+            </Flex>
+          )}
+        </Flex>
         <ConnectivityBanner />
         <Flex flexGrow="1" overflow="hidden">
-          <MainSidebar />
-          <Box flexGrow="1" overflow="hidden">
-            <Outlet />
+          <ChannelsSidebar />
+          {/* Content sits in a bordered, rounded card inset from the window
+              edges — the framed pane from the design. */}
+          <Box flexGrow="1" className="overflow-hidden">
+            <Box className="h-full overflow-hidden rounded-tl-sm border-border border-t border-l bg-background">
+              <Flex direction="column" height="100%">
+                {/* The /website space renders its own header (WebsiteLayout);
+                      everywhere else the shared header carries the view title
+                      and, on a task, its action row. */}
+                {!onWebsitePath && <ContentHeader />}
+                <Box flexGrow="1" overflow="hidden">
+                  {showBlankTab ? <BlankTabView /> : <Outlet />}
+                </Box>
+              </Flex>
+            </Box>
           </Box>
         </Flex>
-
-        <SpaceSwitcher
-          tasks={visualTaskOrder}
-          activeTaskId={activeTaskId}
-          allTasks={tasks ?? []}
-          isOnNewTask={
-            view.type === "task-input" || view.type === "task-pending"
-          }
-          onNavigateToTask={openTask}
-          onNewTask={openTaskInput}
-        />
         <CommandMenu open={commandMenuOpen} onOpenChange={setCommandMenuOpen} />
         <GlobalFilePicker />
         <KeyboardShortcutsSheet
@@ -451,11 +416,26 @@ function RootLayout() {
           onToggleCommandMenu={toggleCommandMenu}
           onToggleShortcutsSheet={toggleShortcutsSheet}
         />
+        {/* Renders nothing — wires the ⌥↑/⌥↓ task-cycling shortcuts. */}
+        <SpaceSwitcher
+          tasks={visualTaskOrder}
+          activeTaskId={activeTaskId}
+          allTasks={tasks ?? []}
+          isOnNewTask={
+            view.type === "task-input" || view.type === "task-pending"
+          }
+          onNavigateToTask={openTask}
+          onNewTask={openTaskInput}
+        />
         <TourOverlay />
         {billingEnabled && <UsageLimitModal />}
         <UpdateAvailableModal />
         <WhatsNewModal />
         <RemoteBranchCheckoutDialog />
+        <FeedbackModal
+          mode={feedbackMode}
+          onFinished={handleFeedbackFinished}
+        />
         {approvalDeepLink.pending ? (
           <DeepLinkApprovalModal
             pending={approvalDeepLink.pending}
@@ -465,6 +445,6 @@ function RootLayout() {
         <ExistingWorktreeDialog />
         <HedgehogMode />
       </Flex>
-    </Flex>
+    </BrowserTabsDndProvider>
   );
 }
diff --git a/packages/ui/src/router/routes/code/agents.tsx b/packages/ui/src/router/routes/code/agents.tsx
index 864701b44c..bf671aa169 100644
--- a/packages/ui/src/router/routes/code/agents.tsx
+++ b/packages/ui/src/router/routes/code/agents.tsx
@@ -1,8 +1,13 @@
 import { AgentBuilderDockLayout } from "@posthog/ui/features/agent-applications/agent-builder/AgentBuilderDockLayout";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute, Outlet } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/code/agents")({
   component: AgentsLayout,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
 
 function AgentsLayout() {
diff --git a/packages/ui/src/router/routes/code/home.tsx b/packages/ui/src/router/routes/code/home.tsx
index 413693313f..15cb0f9a5c 100644
--- a/packages/ui/src/router/routes/code/home.tsx
+++ b/packages/ui/src/router/routes/code/home.tsx
@@ -1,6 +1,11 @@
 import { HomeView } from "@posthog/ui/features/home/components/HomeView";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/code/home")({
   component: HomeView,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
diff --git a/packages/ui/src/router/routes/code/inbox.tsx b/packages/ui/src/router/routes/code/inbox.tsx
index a621e48d48..edd58890d1 100644
--- a/packages/ui/src/router/routes/code/inbox.tsx
+++ b/packages/ui/src/router/routes/code/inbox.tsx
@@ -1,6 +1,11 @@
 import { InboxView } from "@posthog/ui/features/inbox/components/InboxView";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/code/inbox")({
   component: InboxView,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
diff --git a/packages/ui/src/router/routes/code/tasks/$taskId.tsx b/packages/ui/src/router/routes/code/tasks/$taskId.tsx
index cd15ef02df..a4e2145fde 100644
--- a/packages/ui/src/router/routes/code/tasks/$taskId.tsx
+++ b/packages/ui/src/router/routes/code/tasks/$taskId.tsx
@@ -6,20 +6,30 @@ import {
   taskDetailQuery,
 } from "@posthog/ui/features/tasks/queries";
 import { useTasks } from "@posthog/ui/features/tasks/useTasks";
-import { RoutePending } from "@posthog/ui/router/RoutePending";
+import { TaskDetailSkeleton } from "@posthog/ui/router/routeSkeletons";
+import { yieldToPaint } from "@posthog/ui/router/yieldToPaint";
 import { useQuery } from "@tanstack/react-query";
 import { createFileRoute, Navigate } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/code/tasks/$taskId")({
   component: TaskDetailRoute,
-  // Synchronous + cache-only: return whatever is already cached (the detail
-  // entry seeded by openTask, or the sidebar list) and never await the network.
-  // A blocking loader would leave the route pending — and thus un-navigable —
-  // whenever the fetch is slow or never resolves (optimistic/cloud-pending
-  // tasks the API can't return). The cold-miss fetch + spinner live in the
-  // component instead, so navigation always commits instantly.
-  loader: ({ params }): Task | null =>
-    getCachedTaskDetail(params.taskId) ?? getCachedTask(params.taskId) ?? null,
+  pendingComponent: TaskDetailSkeleton,
+  // Cache-only: return whatever is already cached (the detail entry seeded by
+  // openTask, or the sidebar list) and never await the network. A
+  // network-blocked loader would leave the route pending — and thus
+  // un-navigable — whenever the fetch is slow or never resolves
+  // (optimistic/cloud-pending tasks the API can't return). The cold-miss
+  // fetch + skeleton live in the component instead. The single-frame yield
+  // lets the pending skeleton paint before TaskDetail's heavy mount (chat
+  // thread, terminal) blocks the main thread.
+  loader: async ({ params }): Promise<Task | null> => {
+    const task =
+      getCachedTaskDetail(params.taskId) ??
+      getCachedTask(params.taskId) ??
+      null;
+    await yieldToPaint();
+    return task;
+  },
 });
 
 function TaskDetailRoute() {
@@ -51,7 +61,7 @@ function TaskDetailRoute() {
   }
 
   if (!task) {
-    return <RoutePending />;
+    return <TaskDetailSkeleton />;
   }
 
   return <TaskDetail key={task.id} task={task} />;
diff --git a/packages/ui/src/router/routes/command-center.tsx b/packages/ui/src/router/routes/command-center.tsx
index 911b27abb1..45e47f9889 100644
--- a/packages/ui/src/router/routes/command-center.tsx
+++ b/packages/ui/src/router/routes/command-center.tsx
@@ -1,6 +1,11 @@
 import { CommandCenterView } from "@posthog/ui/features/command-center/components/CommandCenterView";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/command-center")({
   component: CommandCenterView,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
diff --git a/packages/ui/src/router/routes/mcp-servers.tsx b/packages/ui/src/router/routes/mcp-servers.tsx
index 6eb8d8a9f8..4c5ff42e90 100644
--- a/packages/ui/src/router/routes/mcp-servers.tsx
+++ b/packages/ui/src/router/routes/mcp-servers.tsx
@@ -1,6 +1,11 @@
 import { McpServersView } from "@posthog/ui/features/mcp-servers/components/McpServersView";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/mcp-servers")({
   component: McpServersView,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
diff --git a/packages/ui/src/router/routes/skills.tsx b/packages/ui/src/router/routes/skills.tsx
index 95827b7382..79081df381 100644
--- a/packages/ui/src/router/routes/skills.tsx
+++ b/packages/ui/src/router/routes/skills.tsx
@@ -1,6 +1,11 @@
 import { SkillsView } from "@posthog/ui/features/skills/SkillsView";
+import {
+  AppPageSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/skills")({
   component: SkillsView,
+  ...withRouteSkeleton(AppPageSkeleton),
 });
diff --git a/packages/ui/src/router/routes/website/$channelId/artifacts.tsx b/packages/ui/src/router/routes/website/$channelId/artifacts.tsx
index 624e094611..c6d74c182c 100644
--- a/packages/ui/src/router/routes/website/$channelId/artifacts.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/artifacts.tsx
@@ -1,8 +1,13 @@
 import { WebsiteChannelArtifacts } from "@posthog/ui/features/canvas/components/WebsiteChannelArtifacts";
+import {
+  ChannelSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/website/$channelId/artifacts")({
   component: ChannelArtifactsRoute,
+  ...withRouteSkeleton(ChannelSkeleton),
 });
 
 function ChannelArtifactsRoute() {
diff --git a/packages/ui/src/router/routes/website/$channelId/context.tsx b/packages/ui/src/router/routes/website/$channelId/context.tsx
index 54848db4c1..5798033c8b 100644
--- a/packages/ui/src/router/routes/website/$channelId/context.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/context.tsx
@@ -1,8 +1,13 @@
 import { WebsiteContext } from "@posthog/ui/features/canvas/components/WebsiteContext";
+import {
+  ChannelSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/website/$channelId/context")({
   component: ContextRoute,
+  ...withRouteSkeleton(ChannelSkeleton),
 });
 
 function ContextRoute() {
diff --git a/packages/ui/src/router/routes/website/$channelId/dashboards/$dashboardId.tsx b/packages/ui/src/router/routes/website/$channelId/dashboards/$dashboardId.tsx
index a7f8d95da8..9e555781b7 100644
--- a/packages/ui/src/router/routes/website/$channelId/dashboards/$dashboardId.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/dashboards/$dashboardId.tsx
@@ -1,10 +1,15 @@
 import { WebsiteDashboard } from "@posthog/ui/features/canvas/components/WebsiteDashboard";
+import {
+  CanvasSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute(
   "/website/$channelId/dashboards/$dashboardId",
 )({
   component: DashboardRoute,
+  ...withRouteSkeleton(CanvasSkeleton),
 });
 
 function DashboardRoute() {
diff --git a/packages/ui/src/router/routes/website/$channelId/history.tsx b/packages/ui/src/router/routes/website/$channelId/history.tsx
index db6441029e..2584a2856e 100644
--- a/packages/ui/src/router/routes/website/$channelId/history.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/history.tsx
@@ -1,8 +1,13 @@
 import { WebsiteChannelHistory } from "@posthog/ui/features/canvas/components/WebsiteChannelHistory";
+import {
+  ChannelSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/website/$channelId/history")({
   component: ChannelHistoryRoute,
+  ...withRouteSkeleton(ChannelSkeleton),
 });
 
 function ChannelHistoryRoute() {
diff --git a/packages/ui/src/router/routes/website/$channelId/index.tsx b/packages/ui/src/router/routes/website/$channelId/index.tsx
index 22de42fe44..bc7547d7d8 100644
--- a/packages/ui/src/router/routes/website/$channelId/index.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/index.tsx
@@ -1,8 +1,13 @@
 import { WebsiteChannelHome } from "@posthog/ui/features/canvas/components/WebsiteChannelHome";
+import {
+  ChannelSkeleton,
+  withRouteSkeleton,
+} from "@posthog/ui/router/routeSkeletons";
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/website/$channelId/")({
   component: ChannelHomeRoute,
+  ...withRouteSkeleton(ChannelSkeleton),
 });
 
 function ChannelHomeRoute() {
diff --git a/packages/ui/src/router/routes/website/$channelId/tasks/$taskId.tsx b/packages/ui/src/router/routes/website/$channelId/tasks/$taskId.tsx
index 80488d9cf0..01af5857af 100644
--- a/packages/ui/src/router/routes/website/$channelId/tasks/$taskId.tsx
+++ b/packages/ui/src/router/routes/website/$channelId/tasks/$taskId.tsx
@@ -10,17 +10,26 @@ import {
   taskDetailQuery,
 } from "@posthog/ui/features/tasks/queries";
 import { useTasks } from "@posthog/ui/features/tasks/useTasks";
-import { RoutePending } from "@posthog/ui/router/RoutePending";
+import { TaskDetailSkeleton } from "@posthog/ui/router/routeSkeletons";
+import { yieldToPaint } from "@posthog/ui/router/yieldToPaint";
 import { useQuery } from "@tanstack/react-query";
 import { createFileRoute } from "@tanstack/react-router";
 import { useEffect } from "react";
 
 export const Route = createFileRoute("/website/$channelId/tasks/$taskId")({
   component: ChannelTaskDetailRoute,
+  pendingComponent: TaskDetailSkeleton,
   // Cache-only loader (same as /code/tasks/$taskId): never block navigation on
-  // the network; the cold-miss fetch lives in the component.
-  loader: ({ params }): Task | null =>
-    getCachedTaskDetail(params.taskId) ?? getCachedTask(params.taskId) ?? null,
+  // the network; the cold-miss fetch lives in the component. The single-frame
+  // yield lets the skeleton paint before TaskDetail's heavy mount.
+  loader: async ({ params }): Promise<Task | null> => {
+    const task =
+      getCachedTaskDetail(params.taskId) ??
+      getCachedTask(params.taskId) ??
+      null;
+    await yieldToPaint();
+    return task;
+  },
 });
 
 function ChannelTaskDetailRoute() {
@@ -55,7 +64,7 @@ function ChannelTaskDetailRoute() {
   const task = fromList ?? loaderTask ?? fetched;
 
   if (!task) {
-    return <RoutePending />;
+    return <TaskDetailSkeleton />;
   }
 
   return (
diff --git a/packages/ui/src/router/yieldToPaint.ts b/packages/ui/src/router/yieldToPaint.ts
new file mode 100644
index 0000000000..50a5462d47
--- /dev/null
+++ b/packages/ui/src/router/yieldToPaint.ts
@@ -0,0 +1,29 @@
+/**
+ * Route-loader helper that resolves just after the next frame paints.
+ *
+ * Mounting a heavy view (task detail with its chat thread + terminal, a canvas
+ * grid) blocks the main thread for hundreds of ms. Without a pending state the
+ * router commits synchronously and the OLD route stays frozen on screen for
+ * that whole block — a tab click looks ignored for up to a second. Awaiting
+ * this in a route's `loader` keeps the navigation pending for exactly one
+ * frame, which (with `pendingMs: 0`) lets the router commit the URL and paint
+ * the route's skeleton `pendingComponent` BEFORE the heavy mount runs. The
+ * click is acknowledged instantly; the expensive render happens behind the
+ * skeleton.
+ *
+ * Never await anything slower than this in a loader — a network-blocked loader
+ * makes the route un-navigable when the fetch hangs. Cold-miss fetches belong
+ * in the component.
+ */
+export function yieldToPaint(): Promise<void> {
+  return new Promise((resolve) => {
+    // Double rAF: the first fires before the next frame paints, the second
+    // before the frame after — so exactly one frame (the one showing the
+    // pending skeleton) is guaranteed to reach the screen in between. A single
+    // rAF can resolve before the pending state ever commits, letting the
+    // router skip straight to the heavy mount with nothing painted.
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => setTimeout(resolve, 0));
+    });
+  });
+}
diff --git a/packages/ui/src/shell/HeaderRow.tsx b/packages/ui/src/shell/ContentHeader.tsx
similarity index 67%
rename from packages/ui/src/shell/HeaderRow.tsx
rename to packages/ui/src/shell/ContentHeader.tsx
index 89657cb353..c66e3728fa 100644
--- a/packages/ui/src/shell/HeaderRow.tsx
+++ b/packages/ui/src/shell/ContentHeader.tsx
@@ -1,7 +1,5 @@
 import { Cloud, Spinner } from "@phosphor-icons/react";
 import { Button as QuillButton } from "@posthog/quill";
-import { PROJECT_BLUEBIRD_FLAG } from "@posthog/shared";
-import { ANALYTICS_EVENTS } from "@posthog/shared/analytics-events";
 import type { Task } from "@posthog/shared/domain-types";
 import { useAuthStateValue } from "@posthog/ui/features/auth/store";
 import { AutoresearchHeaderButton } from "@posthog/ui/features/autoresearch/AutoresearchHeaderButton";
@@ -19,19 +17,13 @@ import { HandoffConfirmDialog } from "@posthog/ui/features/sessions/components/H
 import { useHandoffDialogStore } from "@posthog/ui/features/sessions/handoffDialogStore";
 import { useSessionCallbacks } from "@posthog/ui/features/sessions/hooks/useSessionCallbacks";
 import { useSessionForTask } from "@posthog/ui/features/sessions/useSession";
-import { SidebarTrigger } from "@posthog/ui/features/sidebar/components/SidebarTrigger";
-import { useSidebarStore } from "@posthog/ui/features/sidebar/sidebarStore";
 import { SkillButtonsMenu } from "@posthog/ui/features/skill-buttons/components/SkillButtonsMenu";
 import { useTasks } from "@posthog/ui/features/tasks/useTasks";
 import { useWorkspace } from "@posthog/ui/features/workspace/useWorkspace";
 import { Tooltip } from "@posthog/ui/primitives/Tooltip";
 import { useAppView } from "@posthog/ui/router/useAppView";
-import { track } from "@posthog/ui/shell/analytics";
-import { getHeaderSidebarPanelLayout } from "@posthog/ui/shell/headerSidebarPanel";
 import { useHeaderStore } from "@posthog/ui/shell/headerStore";
-import { isMac, isWindows } from "@posthog/ui/utils/platform";
-import { Box, Flex } from "@radix-ui/themes";
-import { useNavigate } from "@tanstack/react-router";
+import { Flex } from "@radix-ui/themes";
 import { useState } from "react";
 
 const CLOUD_HANDOFF_FLAG = "phc-cloud-handoff";
@@ -135,122 +127,41 @@ function TaskDiffStatsBadge({ task }: { task: Task }) {
   );
 }
 
-// Switches from the Code space to the Channels space (project-bluebird). Sits to
-// the left of the sidebar toggle, replacing the old vertical app rail.
-function BluebirdButton() {
-  const navigate = useNavigate();
-  const bluebirdEnabled = useFeatureFlag(
-    PROJECT_BLUEBIRD_FLAG,
-    import.meta.env.DEV,
-  );
-  if (!bluebirdEnabled) return null;
-  return (
-    <div className="no-drag">
-      <QuillButton
-        variant="outline"
-        size="sm"
-        onClick={() => {
-          track(ANALYTICS_EVENTS.CHANNEL_ACTION, {
-            action_type: "enter_space",
-            surface: "header_button",
-          });
-          navigate({ to: "/website" });
-        }}
-      >
-        Bluebird
-      </QuillButton>
-    </div>
-  );
-}
-
-export const HEADER_HEIGHT = 36;
-const WINDOWS_TITLEBAR_INSET = 140;
-
-export function HeaderRow() {
+// The in-pane content header for the unified Bluebird chrome. Shows the active
+// view's title (pushed into the header store by each view) on the left and, on
+// a task detail, that task's action row on the right — the branch selector,
+// review-panel toggle, cloud/local handoff, skill buttons and task actions that
+// used to live in the Code header bar. Renders nothing when neither is present.
+// The /website space keeps its own header (WebsiteLayout), so this is mounted
+// only outside it.
+export function ContentHeader() {
   const content = useHeaderStore((state) => state.content);
   const view = useAppView();
 
-  const sidebarOpen = useSidebarStore((state) => state.open);
-  const sidebarWidth = useSidebarStore((state) => state.width);
-  const isResizing = useSidebarStore((state) => state.isResizing);
-  const setIsResizing = useSidebarStore((state) => state.setIsResizing);
-  const panel = getHeaderSidebarPanelLayout({
-    sidebarOpen,
-    sidebarWidth,
-    isMac,
-  });
-
   const activeTaskId = view.type === "task-detail" ? view.taskId : undefined;
-  // Read the live task from the list cache instead of a stale snapshot off the
-  // memoized view, so header content stays current while the user remains on
-  // the task.
   const { data: tasks } = useTasks();
   const activeTask = activeTaskId
     ? tasks?.find((t) => t.id === activeTaskId)
     : undefined;
   const activeWorkspace = useWorkspace(activeTaskId);
   const isCloudTask = activeWorkspace?.mode === "cloud";
-  const showTaskSection = view.type === "task-detail";
+  const showTaskSection = view.type === "task-detail" && Boolean(activeTask);
 
-  const handleLeftSidebarMouseDown = (e: React.MouseEvent) => {
-    e.preventDefault();
-    setIsResizing(true);
-    document.body.style.cursor = "col-resize";
-    document.body.style.userSelect = "none";
-  };
+  if (!content && !showTaskSection) return null;
 
   return (
-    <Flex
-      align="center"
-      className="drag border-b border-b-(--gray-6)"
-      style={{
-        height: `${HEADER_HEIGHT}px`,
-        minHeight: `${HEADER_HEIGHT}px`,
-        paddingRight: isWindows ? `${WINDOWS_TITLEBAR_INSET}px` : undefined,
-      }}
-    >
-      <Flex
-        align="center"
-        justify={panel.justify}
-        px="2"
-        pr="3"
-        style={{
-          width: panel.width,
-          minWidth: panel.minWidth,
-          paddingLeft: panel.paddingLeft,
-          transition: isResizing ? "none" : "width 0.2s ease-in-out",
-        }}
-        className={
-          panel.showBorder
-            ? "relative h-full gap-2 border-r border-r-(--gray-6)"
-            : "relative h-full gap-2"
-        }
-      >
-        <BluebirdButton />
-        <SidebarTrigger />
-        {sidebarOpen && (
-          <Box
-            onMouseDown={handleLeftSidebarMouseDown}
-            className="no-drag absolute top-0 right-0 bottom-0 w-[4px] cursor-col-resize bg-transparent"
-            style={{
-              zIndex: 100,
-            }}
-          />
-        )}
-      </Flex>
-
+    <Flex align="center" className="h-10 shrink-0 border-border border-b px-3">
       {content && (
         <Flex
           align="center"
           justify="between"
-          pl="3"
           className="h-full min-w-0 flex-1 overflow-hidden"
         >
           {content}
         </Flex>
       )}
 
-      {showTaskSection && view.type === "task-detail" && activeTask && (
+      {showTaskSection && activeTask && (
         <Flex
           align="center"
           justify="end"
diff --git a/packages/ui/src/shell/GlobalEventHandlers.tsx b/packages/ui/src/shell/GlobalEventHandlers.tsx
index 451207cf7b..4ba6fa0000 100644
--- a/packages/ui/src/shell/GlobalEventHandlers.tsx
+++ b/packages/ui/src/shell/GlobalEventHandlers.tsx
@@ -4,9 +4,11 @@ import {
 } from "@posthog/core/sessions/sessionService";
 import { useService } from "@posthog/di/react";
 import { useHostTRPC } from "@posthog/host-router/react";
+import { PROJECT_BLUEBIRD_FLAG } from "@posthog/shared";
 import type { Task } from "@posthog/shared/domain-types";
 import { useReviewNavigationStore } from "@posthog/ui/features/code-review/reviewNavigationStore";
 import { SHORTCUTS } from "@posthog/ui/features/command/keyboard-shortcuts";
+import { useFeatureFlag } from "@posthog/ui/features/feature-flags/useFeatureFlag";
 import { useFolders } from "@posthog/ui/features/folders/useFolders";
 import { usePanelLayoutStore } from "@posthog/ui/features/panels/panelLayoutStore";
 import { openSettings } from "@posthog/ui/features/settings/hooks/useOpenSettings";
@@ -70,6 +72,16 @@ export function GlobalEventHandlers({
   const sidebarData = useSidebarData({ activeView: view });
   const visualTaskOrder = useVisualTaskOrder(sidebarData);
 
+  // With channels on, mod+1-9 belongs to the browser tab strip (it switches to
+  // the Nth tab). Yield those keys so task-switching only owns them in the Code
+  // nav; the strip's own handler is gated on the same flag.
+  const bluebirdEnabled = useFeatureFlag(
+    PROJECT_BLUEBIRD_FLAG,
+    import.meta.env.DEV,
+  );
+  const channelsEnabled =
+    useSidebarStore((s) => s.channelsEnabled) && bluebirdEnabled;
+
   const taskById = useMemo(() => {
     const map = new Map<string, Task>();
     for (const task of allTasks) {
@@ -198,7 +210,8 @@ export function GlobalEventHandlers({
     [handleToggleFocus],
   );
 
-  // Task switching with mod+1-9
+  // Task switching with mod+1-9 — off when channels are on (the browser tab
+  // strip claims those keys to switch tabs by index).
   useHotkeys(
     SHORTCUTS.SWITCH_TASK,
     (event, handler) => {
@@ -209,7 +222,7 @@ export function GlobalEventHandlers({
       const index = parseInt(keyPressed, 10);
       handleSwitchTask(index);
     },
-    globalOptions,
+    { ...globalOptions, enabled: !channelsEnabled },
     [handleSwitchTask],
   );
 
diff --git a/packages/workspace-server/src/db/migrations/0019_add_app_view.sql b/packages/workspace-server/src/db/migrations/0019_add_app_view.sql
new file mode 100644
index 0000000000..505918c6dc
--- /dev/null
+++ b/packages/workspace-server/src/db/migrations/0019_add_app_view.sql
@@ -0,0 +1 @@
+ALTER TABLE `browser_tabs` ADD `app_view` text;
diff --git a/packages/workspace-server/src/db/migrations/meta/0019_snapshot.json b/packages/workspace-server/src/db/migrations/meta/0019_snapshot.json
new file mode 100644
index 0000000000..0f8b40fcbf
--- /dev/null
+++ b/packages/workspace-server/src/db/migrations/meta/0019_snapshot.json
@@ -0,0 +1,1023 @@
+{
+  "version": "6",
+  "dialect": "sqlite",
+  "id": "47b5564d-959b-4528-97fc-849a579d05ae",
+  "prevId": "44f02595-2145-4a3a-a2f0-751791193102",
+  "tables": {
+    "archives": {
+      "name": "archives",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "workspace_id": {
+          "name": "workspace_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "branch_name": {
+          "name": "branch_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "checkpoint_id": {
+          "name": "checkpoint_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "archived_at": {
+          "name": "archived_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "archives_workspaceId_unique": {
+          "name": "archives_workspaceId_unique",
+          "columns": ["workspace_id"],
+          "isUnique": true
+        }
+      },
+      "foreignKeys": {
+        "archives_workspace_id_workspaces_id_fk": {
+          "name": "archives_workspace_id_workspaces_id_fk",
+          "tableFrom": "archives",
+          "tableTo": "workspaces",
+          "columnsFrom": ["workspace_id"],
+          "columnsTo": ["id"],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "auth_org_project_preferences": {
+      "name": "auth_org_project_preferences",
+      "columns": {
+        "account_key": {
+          "name": "account_key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "cloud_region": {
+          "name": "cloud_region",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "org_id": {
+          "name": "org_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "last_selected_project_id": {
+          "name": "last_selected_project_id",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "auth_org_project_account_region_org_idx": {
+          "name": "auth_org_project_account_region_org_idx",
+          "columns": ["account_key", "cloud_region", "org_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "auth_preferences": {
+      "name": "auth_preferences",
+      "columns": {
+        "account_key": {
+          "name": "account_key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "cloud_region": {
+          "name": "cloud_region",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "last_selected_project_id": {
+          "name": "last_selected_project_id",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_selected_org_id": {
+          "name": "last_selected_org_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "auth_preferences_account_region_idx": {
+          "name": "auth_preferences_account_region_idx",
+          "columns": ["account_key", "cloud_region"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "auth_sessions": {
+      "name": "auth_sessions",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "integer",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "refresh_token_encrypted": {
+          "name": "refresh_token_encrypted",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "cloud_region": {
+          "name": "cloud_region",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "selected_project_id": {
+          "name": "selected_project_id",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "scope_version": {
+          "name": "scope_version",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "autoresearch_runs": {
+      "name": "autoresearch_runs",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "task_id": {
+          "name": "task_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "ended_at": {
+          "name": "ended_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "data": {
+          "name": "data",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "autoresearch_runs_task_id_idx": {
+          "name": "autoresearch_runs_task_id_idx",
+          "columns": ["task_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "browser_tabs": {
+      "name": "browser_tabs",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "window_id": {
+          "name": "window_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "dashboard_id": {
+          "name": "dashboard_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "task_id": {
+          "name": "task_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "channel_id": {
+          "name": "channel_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "channel_section": {
+          "name": "channel_section",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "position": {
+          "name": "position",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "scroll_state": {
+          "name": "scroll_state",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "last_active_at": {
+          "name": "last_active_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "app_view": {
+          "name": "app_view",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        }
+      },
+      "indexes": {
+        "browser_tabs_window_idx": {
+          "name": "browser_tabs_window_idx",
+          "columns": ["window_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {
+        "browser_tabs_window_id_browser_windows_id_fk": {
+          "name": "browser_tabs_window_id_browser_windows_id_fk",
+          "tableFrom": "browser_tabs",
+          "tableTo": "browser_windows",
+          "columnsFrom": ["window_id"],
+          "columnsTo": ["id"],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "browser_windows": {
+      "name": "browser_windows",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "is_primary": {
+          "name": "is_primary",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": false
+        },
+        "bounds": {
+          "name": "bounds",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "active_tab_id": {
+          "name": "active_tab_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "position": {
+          "name": "position",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": 0
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "claude_session_imports": {
+      "name": "claude_session_imports",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "source_session_id": {
+          "name": "source_session_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "imported_session_id": {
+          "name": "imported_session_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "task_id": {
+          "name": "task_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "repo_path": {
+          "name": "repo_path",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "source_mtime_ms": {
+          "name": "source_mtime_ms",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "source_size_bytes": {
+          "name": "source_size_bytes",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "source_last_entry_uuid": {
+          "name": "source_last_entry_uuid",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "claude_session_imports_importedSessionId_unique": {
+          "name": "claude_session_imports_importedSessionId_unique",
+          "columns": ["imported_session_id"],
+          "isUnique": true
+        },
+        "claude_session_imports_source_idx": {
+          "name": "claude_session_imports_source_idx",
+          "columns": ["source_session_id"],
+          "isUnique": false
+        },
+        "claude_session_imports_task_idx": {
+          "name": "claude_session_imports_task_idx",
+          "columns": ["task_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "default_additional_directories": {
+      "name": "default_additional_directories",
+      "columns": {
+        "path": {
+          "name": "path",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "repositories": {
+      "name": "repositories",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "path": {
+          "name": "path",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "remote_url": {
+          "name": "remote_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_accessed_at": {
+          "name": "last_accessed_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "repositories_path_unique": {
+          "name": "repositories_path_unique",
+          "columns": ["path"],
+          "isUnique": true
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "suspensions": {
+      "name": "suspensions",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "workspace_id": {
+          "name": "workspace_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "branch_name": {
+          "name": "branch_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "checkpoint_id": {
+          "name": "checkpoint_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "suspended_at": {
+          "name": "suspended_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "reason": {
+          "name": "reason",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "suspensions_workspaceId_unique": {
+          "name": "suspensions_workspaceId_unique",
+          "columns": ["workspace_id"],
+          "isUnique": true
+        }
+      },
+      "foreignKeys": {
+        "suspensions_workspace_id_workspaces_id_fk": {
+          "name": "suspensions_workspace_id_workspaces_id_fk",
+          "tableFrom": "suspensions",
+          "tableTo": "workspaces",
+          "columnsFrom": ["workspace_id"],
+          "columnsTo": ["id"],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "task_metadata": {
+      "name": "task_metadata",
+      "columns": {
+        "task_id": {
+          "name": "task_id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "pinned_at": {
+          "name": "pinned_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_viewed_at": {
+          "name": "last_viewed_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_activity_at": {
+          "name": "last_activity_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "archived_at": {
+          "name": "archived_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "workspaces": {
+      "name": "workspaces",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "task_id": {
+          "name": "task_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "repository_id": {
+          "name": "repository_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "mode": {
+          "name": "mode",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "linked_branch": {
+          "name": "linked_branch",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "pinned_at": {
+          "name": "pinned_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_viewed_at": {
+          "name": "last_viewed_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_activity_at": {
+          "name": "last_activity_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "additional_directories": {
+          "name": "additional_directories",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'[]'"
+        },
+        "pr_url": {
+          "name": "pr_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "pr_state": {
+          "name": "pr_state",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "pr_urls": {
+          "name": "pr_urls",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'[]'"
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "workspaces_taskId_unique": {
+          "name": "workspaces_taskId_unique",
+          "columns": ["task_id"],
+          "isUnique": true
+        },
+        "workspaces_repository_id_idx": {
+          "name": "workspaces_repository_id_idx",
+          "columns": ["repository_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {
+        "workspaces_repository_id_repositories_id_fk": {
+          "name": "workspaces_repository_id_repositories_id_fk",
+          "tableFrom": "workspaces",
+          "tableTo": "repositories",
+          "columnsFrom": ["repository_id"],
+          "columnsTo": ["id"],
+          "onDelete": "set null",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "worktrees": {
+      "name": "worktrees",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "workspace_id": {
+          "name": "workspace_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "path": {
+          "name": "path",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(CURRENT_TIMESTAMP)"
+        }
+      },
+      "indexes": {
+        "worktrees_workspaceId_unique": {
+          "name": "worktrees_workspaceId_unique",
+          "columns": ["workspace_id"],
+          "isUnique": true
+        }
+      },
+      "foreignKeys": {
+        "worktrees_workspace_id_workspaces_id_fk": {
+          "name": "worktrees_workspace_id_workspaces_id_fk",
+          "tableFrom": "worktrees",
+          "tableTo": "workspaces",
+          "columnsFrom": ["workspace_id"],
+          "columnsTo": ["id"],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    }
+  },
+  "views": {},
+  "enums": {},
+  "_meta": {
+    "schemas": {},
+    "tables": {},
+    "columns": {}
+  },
+  "internal": {
+    "indexes": {}
+  }
+}
diff --git a/packages/workspace-server/src/db/migrations/meta/_journal.json b/packages/workspace-server/src/db/migrations/meta/_journal.json
index ec1a4276da..695642eb69 100644
--- a/packages/workspace-server/src/db/migrations/meta/_journal.json
+++ b/packages/workspace-server/src/db/migrations/meta/_journal.json
@@ -134,6 +134,13 @@
       "when": 1783430845937,
       "tag": "0018_add_pr_urls",
       "breakpoints": true
+    },
+    {
+      "idx": 19,
+      "version": "6",
+      "when": 1783430845938,
+      "tag": "0019_add_app_view",
+      "breakpoints": true
     }
   ]
 }
diff --git a/packages/workspace-server/src/db/repositories/browser-tabs-repository.ts b/packages/workspace-server/src/db/repositories/browser-tabs-repository.ts
index 5538a0dcd9..84bb44488f 100644
--- a/packages/workspace-server/src/db/repositories/browser-tabs-repository.ts
+++ b/packages/workspace-server/src/db/repositories/browser-tabs-repository.ts
@@ -48,6 +48,7 @@ export class BrowserTabsRepository implements IBrowserTabsRepository {
         taskId: t.taskId ?? null,
         channelId: t.channelId ?? null,
         channelSection: t.channelSection ?? null,
+        appView: t.appView ?? null,
         position: t.position,
         scrollState: t.scrollState ?? null,
         createdAt: t.createdAt,
@@ -88,6 +89,7 @@ export class BrowserTabsRepository implements IBrowserTabsRepository {
               taskId: t.taskId ?? null,
               channelId: t.channelId ?? null,
               channelSection: t.channelSection ?? null,
+              appView: t.appView ?? null,
               position: t.position,
               scrollState: t.scrollState ?? null,
               createdAt: t.createdAt,
diff --git a/packages/workspace-server/src/db/schema.ts b/packages/workspace-server/src/db/schema.ts
index 11081cf0a8..4f2e47de9d 100644
--- a/packages/workspace-server/src/db/schema.ts
+++ b/packages/workspace-server/src/db/schema.ts
@@ -243,6 +243,9 @@ export const browserTabs = sqliteTable(
     /** Channel sub-section (inbox/artifacts/history/context). Null = channel
      * home, or a non-channel tab. */
     channelSection: text(),
+    /** Top-level app page (inbox/agents/skills/mcp-servers/command-center/home).
+     * Null = a canvas / task / channel / blank tab. */
+    appView: text(),
     /** Gap-spaced ordering key within a window. */
     position: integer().notNull(),
     /** Reserved/unwired. Opaque JSON for future per-tab state. */
diff --git a/packages/workspace-server/src/services/browser-tabs/schemas.ts b/packages/workspace-server/src/services/browser-tabs/schemas.ts
index 6765e76a7c..e565a1b89a 100644
--- a/packages/workspace-server/src/services/browser-tabs/schemas.ts
+++ b/packages/workspace-server/src/services/browser-tabs/schemas.ts
@@ -10,9 +10,17 @@ export const openOrFocusTabInput = z.object({
   taskId: z.string().nullable().default(null),
   channelId: z.string().nullable().default(null),
   channelSection: z.string().nullable().default(null),
+  appView: z.string().nullable().default(null),
+  // Renderer-minted id for a tab this call may create, so the optimistic local
+  // apply and the persisted state agree on the id (local-first tab sync).
+  tabId: z.string().optional(),
 });
 
-export const newBlankTabInput = z.object({ windowId: z.string() });
+export const newBlankTabInput = z.object({
+  windowId: z.string(),
+  // Renderer-minted id (see openOrFocusTabInput.tabId).
+  tabId: z.string().optional(),
+});
 
 export const setTabTargetInput = z.object({
   tabId: z.string(),
@@ -20,6 +28,7 @@ export const setTabTargetInput = z.object({
   taskId: z.string().nullable().default(null),
   channelId: z.string().nullable().default(null),
   channelSection: z.string().nullable().default(null),
+  appView: z.string().nullable().default(null),
 });
 
 export const closeTabInput = z.object({ tabId: z.string() });
diff --git a/packages/workspace-server/src/services/browser-tabs/service.ts b/packages/workspace-server/src/services/browser-tabs/service.ts
index 8ffe2ad689..e658412b7b 100644
--- a/packages/workspace-server/src/services/browser-tabs/service.ts
+++ b/packages/workspace-server/src/services/browser-tabs/service.ts
@@ -6,6 +6,7 @@ import {
   openOrFocusTab,
   setTabOrder,
   setTabTarget,
+  setWindowActiveTab,
   type TabsSnapshot,
   type TabTarget,
   TypedEventEmitter,
@@ -26,14 +27,17 @@ export interface IBrowserTabsService {
       windowId: string;
       channelId: string | null;
       channelSection?: string | null;
+      appView?: string | null;
+      tabId?: string;
     },
   ): TabsSnapshot;
-  newBlankTab(input: { windowId: string }): TabsSnapshot;
+  newBlankTab(input: { windowId: string; tabId?: string }): TabsSnapshot;
   setTabTarget(
     input: TabTarget & {
       tabId: string;
       channelId: string | null;
       channelSection?: string | null;
+      appView?: string | null;
     },
   ): TabsSnapshot;
   close(tabId: string): TabsSnapshot;
@@ -99,20 +103,32 @@ export class BrowserTabsService
       windowId: string;
       channelId: string | null;
       channelSection?: string | null;
+      appView?: string | null;
+      tabId?: string;
     },
   ): TabsSnapshot {
+    // Honor a renderer-minted id so the caller's optimistic apply and this
+    // persisted state agree on the id. Dedup-by-identity still applies first,
+    // so a replay of the same open focuses the existing tab.
+    const providedId = input.tabId;
     const { snapshot } = openOrFocusTab(this.snapshot, {
       ...input,
-      makeId,
+      makeId: providedId ? () => providedId : makeId,
       now,
     });
     return this.commit(snapshot);
   }
 
-  newBlankTab(input: { windowId: string }): TabsSnapshot {
+  newBlankTab(input: { windowId: string; tabId?: string }): TabsSnapshot {
+    const providedId = input.tabId;
+    // Idempotent on the renderer-minted id: a replay of the same call (blank
+    // tabs have no identity to dedup on) must not append a second tab.
+    if (providedId && this.snapshot.tabs.some((t) => t.id === providedId)) {
+      return this.snapshot;
+    }
     const { snapshot } = newBlankTab(this.snapshot, {
       windowId: input.windowId,
-      makeId,
+      makeId: providedId ? () => providedId : makeId,
       now,
     });
     return this.commit(snapshot);
@@ -123,6 +139,7 @@ export class BrowserTabsService
       tabId: string;
       channelId: string | null;
       channelSection?: string | null;
+      appView?: string | null;
     },
   ): TabsSnapshot {
     return this.commit(setTabTarget(this.snapshot, { ...input, now }));
@@ -147,12 +164,12 @@ export class BrowserTabsService
     windowId: string;
     tabId: string | null;
   }): TabsSnapshot {
-    const next: TabsSnapshot = {
-      ...this.snapshot,
-      windows: this.snapshot.windows.map((w) =>
-        w.id === input.windowId ? { ...w, activeTabId: input.tabId } : w,
-      ),
-    };
+    // Validated: a tabId that doesn't exist in the window (a stale history tag
+    // replayed after the tab closed) is ignored rather than persisted as a
+    // dangling activeTabId — that dangle makes every later navigation look like
+    // "no active tab" and silently open new tabs.
+    const next = setWindowActiveTab(this.snapshot, input.windowId, input.tabId);
+    if (next === this.snapshot) return this.snapshot;
     return this.commit(next);
   }