diff --git a/frontend/src/components/TabManager.empty-workbench.layout.test.ts b/frontend/src/components/TabManager.empty-workbench.layout.test.ts
new file mode 100644
index 00000000..a7bf7525
--- /dev/null
+++ b/frontend/src/components/TabManager.empty-workbench.layout.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, it } from 'vitest';
+import { readV2ThemeCss } from '../test/readV2ThemeCss';
+
+describe('empty workbench layout', () => {
+  it('keeps hero actions from overlapping recent cards in small windows', () => {
+    const css = readV2ThemeCss();
+    const heroSelector = 'body[data-ui-version="v2"] .gn-v2-empty-hero {';
+    const firstHeroRule = css.indexOf(heroSelector);
+    const heroRule = css.slice(
+      css.indexOf(heroSelector, firstHeroRule + heroSelector.length),
+      css.indexOf('body[data-ui-version="v2"] .gn-v2-empty-eyebrow {'),
+    );
+
+    expect(heroRule).toContain('flex: 0 0 auto;');
+  });
+});
diff --git a/frontend/src/v2-theme.css b/frontend/src/v2-theme.css
index b316d01c..561c7eb4 100644
--- a/frontend/src/v2-theme.css
+++ b/frontend/src/v2-theme.css
@@ -3342,6 +3342,7 @@ body[data-ui-version="v2"] .gn-v2-empty-hero {
 }
 
 body[data-ui-version="v2"] .gn-v2-empty-hero {
+  flex: 0 0 auto;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;