Verify and standardize panel control styling

agent.md

@@ -41,6 +41,7 @@ This project replaces the Excel/VBA workflow named `Catalog maker - 20` with a N
 - When the left sidebar is closed on desktop, its open control keeps a dedicated narrow rail; it must not be positioned inside the secondary product-details panel. On mobile, the rail collapses and the control may overlay the stacked layout.
 - Top headers for the sidebar, secondary panel and main workspace must use one shared fixed height so the columns align visually across the application.
 - Panel collapse/open controls must use the shared `panel-control-button` style; do not create separate visual variants for `X`, chevrons or future panel toggles.
+- Verify shared panel-control styling through computed browser styles, not only by checking class names.
 - Use Playwright to inspect the rendered result after every visual change at desktop and narrow viewport sizes.
 
 ## TypeScript workflow

src/tailwind.css

@@ -228,6 +228,7 @@
   html:not(.dark) .arrow-button,
   html:not(.dark) .action-button,
   html:not(.dark) .input-like { @apply border-slate-300 bg-white text-slate-700; }
+  html:not(.dark) .panel-control-button { @apply border-slate-400 bg-white text-slate-700; }
   html:not(.dark) .sidebar-close-button:hover,
   html:not(.dark) .sidebar-open-button:hover,
   html:not(.dark) .drawer-trigger:hover,

tests/ui/catalog-maker.smoke.spec.ts

@@ -81,6 +81,15 @@ test("uses one shared height for the top panel headers", async ({ page }) => {
   expect(new Set(heights).size).toBe(1);
 });
 
+test("uses one shared visual style for panel controls", async ({ page }) => {
+  await page.goto("/");
+  const styles = await page.locator("#sidebarCloseButton, #secondaryPanelToggle, #mainWorkspaceToggle").evaluateAll((elements) => elements.map((element) => {
+    const style = getComputedStyle(element);
+    return [style.width, style.height, style.borderColor, style.backgroundColor, style.borderRadius];
+  }));
+  expect(new Set(styles.map((style) => JSON.stringify(style))).size).toBe(1);
+});
+
 test("theme toggle switches and persists dark mode", async ({ page }) => {
   await page.goto("/");
   await page.evaluate(() => localStorage.clear());