diff --git a/apps/web/src/styles/workspace/mention-home.css b/apps/web/src/styles/workspace/mention-home.css
index b9d720aa68..05ba06edbf 100644
--- a/apps/web/src/styles/workspace/mention-home.css
+++ b/apps/web/src/styles/workspace/mention-home.css
@@ -43,13 +43,18 @@
   display: flex;
   align-items: center;
   align-content: flex-start;
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
   gap: 4px;
   min-height: 0;
   padding: 6px;
   background: var(--bg-subtle);
   border-bottom: 1px solid var(--border-soft);
-  overflow: hidden;
+  overflow-x: auto;
+  overflow-y: hidden;
+  scrollbar-width: none;
+}
+.mention-tabs::-webkit-scrollbar {
+  display: none;
 }
 .mention-tab {
   flex: 0 0 auto;
diff --git a/apps/web/tests/styles/mention-popover.test.ts b/apps/web/tests/styles/mention-popover.test.ts
index c8bdc478f1..1786fa2dfa 100644
--- a/apps/web/tests/styles/mention-popover.test.ts
+++ b/apps/web/tests/styles/mention-popover.test.ts
@@ -36,13 +36,16 @@ describe('mention popover styles', () => {
     expect(ruleValue(results, 'overflow-y')).toBe('auto');
   });
 
-  it('wraps category tabs inside the panel without clipping labels', () => {
+  it('keeps category tabs on one line without clipping labels', () => {
     const tabs = cssBlock('.mention-tabs');
     const tab = cssBlock('.mention-tab');
 
-    expect(ruleValue(tabs, 'flex-wrap')).toBe('wrap');
-    expect(ruleValue(tabs, 'overflow')).toBe('hidden');
+    expect(ruleValue(tabs, 'flex-wrap')).toBe('nowrap');
+    expect(ruleValue(tabs, 'overflow-x')).toBe('auto');
+    expect(ruleValue(tabs, 'overflow-y')).toBe('hidden');
+    expect(ruleValue(tabs, 'scrollbar-width')).toBe('none');
     expect(ruleValue(tab, 'flex')).toBe('0 0 auto');
+    expect(ruleValue(tab, 'min-inline-size')).toBe('max-content');
     expect(ruleValue(tab, 'white-space')).toBe('nowrap');
   });