From 92382bb9494c12cff2991f6b148182f7ec4ba7e3 Mon Sep 17 00:00:00 2001
From: Manish Prakash <manisharies.iitg@gmail.com>
Date: Wed, 15 Jul 2026 10:12:54 +0530
Subject: [PATCH] Fix terminal rail filter overlap

---
 frontend/src/components/TerminalCenter.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/TerminalCenter.tsx b/frontend/src/components/TerminalCenter.tsx
index a369f0ba..4667d136 100644
--- a/frontend/src/components/TerminalCenter.tsx
+++ b/frontend/src/components/TerminalCenter.tsx
@@ -4034,7 +4034,7 @@ const TerminalCenterInner: React.FC<TerminalCenterProps> = ({ currentSessionId,
 
   const renderRailControls = () => {
     const filterButtonClass = (filter: TerminalRailFilter) => (
-      `inline-flex min-w-0 items-center justify-center gap-1 rounded px-1.5 py-1 text-[10px] font-medium leading-none transition-colors ${
+      `inline-flex min-w-0 flex-col items-center justify-center gap-0.5 overflow-hidden rounded px-0.5 py-1.5 text-[10px] font-medium leading-none transition-colors ${
         terminalRailFilter === filter
           ? 'bg-neutral-800 text-neutral-100 shadow-sm'
           : 'text-neutral-500 hover:bg-neutral-900 hover:text-neutral-200'
@@ -4069,8 +4069,8 @@ const TerminalCenterInner: React.FC<TerminalCenterProps> = ({ currentSessionId,
                 className={filterButtonClass(filter.key)}
                 title={`Show ${filter.label.toLowerCase()} agents`}
               >
-                <span>{railNarrow ? filter.narrowLabel : filter.label}</span>
-                {!railNarrow && <span className="text-neutral-500">{filter.count}</span>}
+                <span className="max-w-full truncate whitespace-nowrap">{railNarrow ? filter.narrowLabel : filter.label}</span>
+                {!railNarrow && <span className="text-[9px] tabular-nums text-neutral-500">{filter.count}</span>}
               </button>
             ))}
           </div>