feat(web): unified app sidebar — global nav, gear settings, sidebar New Task

apps/web/app/globals.css

@@ -1459,3 +1459,54 @@
 .animate-queue-close {
   animation: queue-panel-close 180ms cubic-bezier(0.32, 0.72, 0, 1);
 }
+
+/* Unified AppSidebar — header/text content fades in when the rail expands
+ * from its collapsed (icon-only) state. */
+@keyframes app-sidebar-fade-in {
+  from {
+    opacity: 0;
+    transform: translateX(-4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+.sidebar-fade-in {
+  animation: app-sidebar-fade-in 200ms ease-out;
+}
+
+/* AppSidebar section expand/collapse — a quick height animation that pushes
+ * sibling sections, replacing the old opacity fade. Driven by the Radix
+ * Collapsible `data-state` + content-height CSS var. */
+@keyframes sidebar-section-expand {
+  from {
+    height: 0;
+  }
+  to {
+    height: var(--radix-collapsible-content-height);
+  }
+}
+@keyframes sidebar-section-collapse {
+  from {
+    height: var(--radix-collapsible-content-height);
+  }
+  to {
+    height: 0;
+  }
+}
+.sidebar-section-content {
+  overflow: hidden;
+}
+.sidebar-section-content[data-state="open"] {
+  animation: sidebar-section-expand 180ms cubic-bezier(0.32, 0.72, 0, 1);
+}
+.sidebar-section-content[data-state="closed"] {
+  animation: sidebar-section-collapse 160ms cubic-bezier(0.32, 0.72, 0, 1);
+}
+@media (prefers-reduced-motion: reduce) {
+  .sidebar-section-content[data-state="open"],
+  .sidebar-section-content[data-state="closed"] {
+    animation: none;
+  }
+}

apps/web/app/layout.tsx

@@ -11,6 +11,7 @@ import { CommandPanel } from "@/components/command-panel";
 import { GlobalCommands } from "@/components/global-commands";
 import { RecentTaskSwitcher } from "@/components/task/recent-task-switcher";
 import { DiffWorkerPoolProvider } from "@/components/diff-worker-pool-provider";
+import { AppSidebar } from "@/components/app-sidebar/app-sidebar";
 import { QuickChatProvider } from "@/components/quick-chat/quick-chat-provider";
 import { ConfigChatProvider } from "@/components/config-chat/config-chat-provider";
 import { SessionFailureToastBridge } from "@/components/session-failure-toast-bridge";
@@ -81,7 +82,12 @@ export default async function RootLayout({
                     <CommandPanel />
                     <RecentTaskSwitcher />
                     <ConfigChatProvider>
-                      <QuickChatProvider>{children}</QuickChatProvider>
+                      <QuickChatProvider>
+                        <div className="flex h-screen min-h-0 w-full overflow-hidden">
+                          <AppSidebar />
+                          <div className="flex-1 min-w-0 min-h-0 flex flex-col">{children}</div>
+                        </div>
+                      </QuickChatProvider>
                     </ConfigChatProvider>
                   </CommandRegistryProvider>
                 </ToastProvider>