fix(web): polish sidebar v2 chrome and composer surfaces

apps/web/src/components/AppSidebarLayout.tsx

@@ -164,14 +164,10 @@ export function AppSidebarLayout({ children }: { children: ReactNode }) {
       <Sidebar
         side="left"
         collapsible="offcanvas"
-        className={
-          // v2 is a darker, higher-contrast panel: it sits below the main
-          // surface instead of matching it, so its bordered cards read as
-          // raised blocks.
-          useSidebarV2
-            ? "border-r border-black/15 bg-neutral-100 text-foreground [--sidebar-stage-fade:var(--color-neutral-100)] dark:border-white/10 dark:bg-neutral-950 dark:[--sidebar-stage-fade:var(--color-neutral-950)]"
-            : "border-r border-border bg-card text-foreground"
-        }
+        className={cn(
+          "border-r border-border text-foreground",
+          useSidebarV2 ? "app-sidebar" : "bg-card",
+        )}
         resizable={{
           maxWidth: sidebarMaximumWidth,
           minWidth: THREAD_SIDEBAR_MIN_WIDTH,

apps/web/src/components/BranchToolbar.tsx

@@ -25,7 +25,6 @@ import {
 import { BranchToolbarBranchSelector } from "./BranchToolbarBranchSelector";
 import { BranchToolbarEnvironmentSelector } from "./BranchToolbarEnvironmentSelector";
 import { BranchToolbarEnvModeSelector } from "./BranchToolbarEnvModeSelector";
-import { ProjectFavicon } from "./ProjectFavicon";
 import { Button } from "./ui/button";
 import {
   Menu,
@@ -250,21 +249,6 @@ export const BranchToolbar = memo(function BranchToolbar({
 
   return (
     <div className="mx-auto flex w-full max-w-3xl items-center gap-2 px-2.5 pb-3 pt-1 sm:px-3">
-      {/* The submit target leads the run-context strip: this is the one
-          surface where "which project am I about to send this to" must be
-          answered before the first keystroke, especially on drafts.
-          Mirrors the sidebar cards' title bar — favicon + mono name. */}
-      <span className="inline-flex shrink-0 items-center gap-1.5 border border-black/12 py-0.5 pl-1.5 pr-2 dark:border-white/12">
-        <ProjectFavicon
-          environmentId={activeProject.environmentId}
-          cwd={activeProject.workspaceRoot}
-          className="size-3"
-        />
-        <span className="max-w-32 truncate font-mono text-[10px] font-semibold uppercase tracking-[0.08em] text-muted-foreground">
-          {activeProject.title}
-        </span>
-      </span>
-      <Separator orientation="vertical" className="mx-0.5 h-3.5!" />
       {isMobile ? (
         <MobileRunContextSelector
           envLocked={envLocked}

apps/web/src/components/Sidebar.logic.ts

@@ -418,10 +418,12 @@ export function resolveThreadRowClassName(input: {
 }
 
 // ── Sidebar v2 status model ─────────────────────────────────────────
-// Four visual states, three colors: color is reserved for "act now"
+// Five visual states, three colors: color is reserved for "act now"
 // (approval), "in motion" (working), and "broken" (failed). Ready is the
 // unlabeled resting state — the agent stopped and is waiting on the user,
 // whether it finished, asked a question, or proposed a plan.
+// Unread completion is tracked separately: it describes whether a ready
+// thread needs attention, not what the thread is currently doing.
 export type SidebarV2Status = "approval" | "input" | "working" | "failed" | "ready";
 
 type SidebarV2StatusInput = Pick<