feat(app-switcher): add compact mode for takeover with 3+ visible apps

src/App.tsx

@@ -889,7 +889,12 @@ function App() {
                   </>
                 )}
 
-                <AppSwitcher activeApp={activeApp} onSwitch={setActiveApp} visibleApps={visibleApps} />
+                <AppSwitcher
+                  activeApp={activeApp}
+                  onSwitch={setActiveApp}
+                  visibleApps={visibleApps}
+                  compact={isCurrentAppTakeoverActive && Object.values(visibleApps).filter(Boolean).length >= 3}
+                />
 
                 <div className="flex items-center gap-1 p-1 bg-muted rounded-xl">
                   <Button

src/components/AppSwitcher.tsx

@@ -6,11 +6,12 @@ interface AppSwitcherProps {
   activeApp: AppId;
   onSwitch: (app: AppId) => void;
   visibleApps?: VisibleApps;
+  compact?: boolean;
 }
 
 const ALL_APPS: AppId[] = ["claude", "codex", "gemini", "opencode"];
 
-export function AppSwitcher({ activeApp, onSwitch, visibleApps }: AppSwitcherProps) {
+export function AppSwitcher({ activeApp, onSwitch, visibleApps, compact }: AppSwitcherProps) {
   const handleSwitch = (app: AppId) => {
     if (app === activeApp) return;
     onSwitch(app);
@@ -52,13 +53,8 @@ export function AppSwitcher({ activeApp, onSwitch, visibleApps }: AppSwitcherPro
             icon={appIconName[app]}
             name={appDisplayName[app]}
             size={iconSize}
-            className={
-              activeApp === app
-                ? "text-foreground"
-                : "text-muted-foreground group-hover:text-foreground transition-colors"
-            }
           />
-          <span>{appDisplayName[app]}</span>
+          {!compact && <span>{appDisplayName[app]}</span>}
         </button>
       ))}
     </div>