fix(gui): keep models tabs aligned

gui/src/styles-models-workspace.css

@@ -8,14 +8,17 @@
 /*
   The catalog wants a wider column than the 980px default.
 
-  Scoped to a VISIBLE catalog panel, not merely a present one: panels mount lazily and
-  then stay mounted so drafts survive a tab hop, so a bare `:has(.models-workspace-shell)`
-  keeps matching after the catalog has been opened once. Routing would then render at
-  980px on a direct visit and 1200px afterwards — a width that depends on browsing
-  history. No surface renders the shell outside a tabpanel any more, so the old
-  direct-child arm is gone with the standalone pages it served.
+  Scoped to a VISIBLE catalog or routing panel, not merely a present one: panels mount
+  lazily and then stay mounted so drafts survive a tab hop, so a bare
+  `:has(.models-workspace-shell)` keeps matching after the catalog has been opened once.
+  Routing must share the catalog's 1200px page width or switching between those tabs
+  shifts the content horizontally. No surface renders the shell outside a tabpanel any
+  more, so the old direct-child arm is gone with the standalone pages it served.
 */
-.main-inner:has(#models-panel-catalog:not([hidden]) .models-workspace-shell) {
+.main-inner:has(
+  #models-panel-catalog:not([hidden]),
+  #models-panel-routing:not([hidden])
+) {
   max-width: 1200px;
 }
 

gui/tests/models-provider-head.test.ts

@@ -31,6 +31,17 @@ test("Models workspace stacks via content-width container query before mobile dr
   expect(css).toContain("@media (max-width: 768px)");
 });
 
+test("Models catalog and routing tabs keep the same wide page width", async () => {
+  const css = await Bun.file(new URL("../src/styles-models-workspace.css", import.meta.url)).text();
+
+  // Both panels stay mounted after first visit, so the width rule must follow the
+  // visible panel rather than the catalog shell's historical presence in the DOM.
+  expect(css).toMatch(
+    /\.main-inner:has\(\s*#models-panel-catalog:not\(\[hidden\]\),\s*#models-panel-routing:not\(\[hidden\]\)\s*\)\s*\{\s*max-width:\s*1200px;/s,
+  );
+  expect(css).not.toContain("#models-panel-catalog:not([hidden]) .models-workspace-shell");
+});
+
 test("Models exposes provider and per-model context-window controls (#1073)", async () => {
   const page = await Bun.file(new URL("../src/pages/Models.tsx", import.meta.url)).text();
   const groups = await Bun.file(new URL("../src/models-groups.ts", import.meta.url)).text();