diff --git a/src/components/chat/agent-selector.tsx b/src/components/chat/agent-selector.tsx
index 20d6923..9cdf22b 100644
--- a/src/components/chat/agent-selector.tsx
+++ b/src/components/chat/agent-selector.tsx
@@ -242,11 +242,18 @@ export function AgentSelector({
             />
             <span
               className={cn(
-                "overflow-hidden whitespace-nowrap transition-all duration-300",
-                isSelected ? "max-w-[80px] opacity-100" : "max-w-0 opacity-0"
+                "grid transition-[grid-template-columns] duration-300",
+                isSelected ? "grid-cols-[1fr]" : "grid-cols-[0fr]"
               )}
             >
-              {AGENT_LABELS[agent.agent_type]}
+              <span
+                className={cn(
+                  "min-w-0 overflow-hidden whitespace-nowrap transition-opacity duration-300",
+                  isSelected ? "opacity-100" : "opacity-0"
+                )}
+              >
+                {AGENT_LABELS[agent.agent_type]}
+              </span>
             </span>
           </button>
         )
diff --git a/src/components/layout/folder-title-bar.tsx b/src/components/layout/folder-title-bar.tsx
index 74269b9..1856315 100644
--- a/src/components/layout/folder-title-bar.tsx
+++ b/src/components/layout/folder-title-bar.tsx
@@ -301,13 +301,20 @@ export function FolderTitleBar() {
                   />
                   <span
                     className={cn(
-                      "overflow-hidden whitespace-nowrap transition-all duration-300",
+                      "grid transition-[grid-template-columns] duration-300",
                       isActive
-                        ? "max-w-[60px] opacity-100"
-                        : "max-w-0 opacity-0"
+                        ? "grid-cols-[1fr]"
+                        : "grid-cols-[0fr]"
                     )}
                   >
-                    {title}
+                    <span
+                      className={cn(
+                        "min-w-0 overflow-hidden whitespace-nowrap transition-opacity duration-300",
+                        isActive ? "opacity-100" : "opacity-0"
+                      )}
+                    >
+                      {title}
+                    </span>
                   </span>
                 </div>
               )