diff --git a/client/src/components/Layout/InAppNotificationBell.test.tsx b/client/src/components/Layout/InAppNotificationBell.test.tsx
index b9fe381d7..f9eacd905 100644
--- a/client/src/components/Layout/InAppNotificationBell.test.tsx
+++ b/client/src/components/Layout/InAppNotificationBell.test.tsx
@@ -1,4 +1,4 @@
-// FE-COMP-BELL-001 to FE-COMP-BELL-020
+// FE-COMP-BELL-001 to FE-COMP-BELL-021
 import { render, screen, waitFor } from '../../../tests/helpers/render';
 import userEvent from '@testing-library/user-event';
 import { vi } from 'vitest';
@@ -238,4 +238,13 @@ describe('InAppNotificationBell', () => {
     // fetchNotifications should be called once per open (2 total)
     expect(fetchNotifications).toHaveBeenCalledTimes(2);
   });
+
+  it('FE-COMP-BELL-021: unread badge is large enough that the count is not squeezed', () => {
+    seedStore(useInAppNotificationStore, { notifications: [], unreadCount: 150, isLoading: false });
+    render(<InAppNotificationBell />);
+    const badge = screen.getByTestId('notification-badge');
+    expect(badge).toHaveTextContent('99+');
+    expect(badge.style.height).toBe('20px');
+    expect(badge.style.minWidth).toBe('20px');
+  });
 });
diff --git a/client/src/components/Layout/InAppNotificationBell.tsx b/client/src/components/Layout/InAppNotificationBell.tsx
index bc9595b54..ce1572acd 100644
--- a/client/src/components/Layout/InAppNotificationBell.tsx
+++ b/client/src/components/Layout/InAppNotificationBell.tsx
@@ -52,12 +52,13 @@ export default function InAppNotificationBell(): React.ReactElement {
         <Bell className="w-4 h-4" />
         {unreadCount > 0 && (
           <span
-            className="absolute -top-1 -end-1 flex items-center justify-center rounded-full text-white font-bold tabular-nums ring-2 ring-surface-card"
+            data-testid="notification-badge"
+            className="absolute -top-1.5 -end-1.5 flex items-center justify-center rounded-full text-white font-bold tabular-nums ring-2 ring-surface-card"
             style={{
               background: '#ef4444',
-              fontSize: 'calc(10px * var(--fs-scale-caption, 1))',
-              minWidth: 18,
-              height: 18,
+              fontSize: 'calc(10.5px * var(--fs-scale-caption, 1))',
+              minWidth: 20,
+              height: 20,
               padding: '0 5px',
               lineHeight: 1,
             }}