fix(cmux-next sidebar): the icon rail keeps its 48px column (it shared .acpmux-rail with the session rail)

webviews/src/agent-session/acpmux/SessionSidebar.gallery.tsx

@@ -208,7 +208,7 @@ const entry = componentEntry<Props>({
   pane: true,
   height: 620,
   widths: { narrow: 300, normal: 380, wide: 520 },
-  anchors: [{ selector: ".acpmux-sidebar" }, { selector: ".acpmux-rail" }],
+  anchors: [{ selector: ".acpmux-sidebar" }, { selector: ".acpmux-sidebar-rail" }],
   checks: {
     anchorMovePx: {
       value: 0,

webviews/src/agent-session/acpmux/SessionSidebar.tsx

@@ -121,7 +121,7 @@ export function SessionSidebar({
   return (
     <OpenSessions.Provider value={openIds}>
       <nav className="acpmux-sidebar" id="acpmux-sidebar" data-list-keyboard aria-label={t("sidebar.label")}>
-        <div className="acpmux-rail" data-list-keyboard>
+        <div className="acpmux-sidebar-rail" data-list-keyboard>
           <RailButton label={t("picker.newChat")} title={t("picker.newChat")} onClick={onNewChat} icon="home" />
 
           <RailButton

webviews/src/agent-session/acpmux/prototype/prototype.css

@@ -795,7 +795,7 @@ body {
   }
 }
 /* The history layer is the session list alone: the pane's own rail and New chat stay in the pane. */
-.proto-history .acpmux-rail,
+.proto-history .acpmux-sidebar-rail,
 .proto-history .acpmux-sidebar-action,
 .proto-history .acpmux-account {
   display: none;

webviews/test/sidebar-rail-css.test.tsx

@@ -0,0 +1,31 @@
+// The sidebar's icon rail and the chat's session rail are two components; the pane loads both
+// sheets, so the session rail's 240-340px column (summary.css) must not land on the 48px icon rail.
+import { expect, test } from "bun:test";
+import { readFileSync } from "node:fs";
+import { Window } from "happy-dom";
+import { renderToStaticMarkup } from "react-dom/server";
+import { SessionSidebar } from "../src/agent-session/acpmux/SessionSidebar";
+
+const sheet = (path: string) => readFileSync(new URL(path, import.meta.url), "utf8");
+
+test("the sidebar's icon rail keeps its own layout with the session rail's sheet loaded", () => {
+  const markup = renderToStaticMarkup(<SessionSidebar sessions={[]} onSelect={() => {}} />);
+  const window = new Window({ width: 900, height: 600 });
+  const { document } = window;
+  for (const css of [
+    sheet("../src/agent-session/acpmux/styles.css"),
+    sheet("../src/agent-session/acpmux/summary/summary.css"),
+  ]) {
+    const style = document.createElement("style");
+    style.textContent = css;
+    document.head.append(style);
+  }
+  document.body.innerHTML = markup;
+  const rail = document.querySelector("nav.acpmux-sidebar > div")!;
+  expect(rail.querySelector("button")).not.toBeNull();
+  const computed = window.getComputedStyle(rail);
+  // happy-dom drops the session rail's clamp() basis, so check the plain values both rules set.
+  expect([computed.alignItems, computed.paddingLeft]).toEqual(["center", "0px"]);
+  expect(computed.overflowY).not.toBe("auto");
+  window.happyDOM.close();
+});