From 455871770d1931483d15e79c8c32c345ba466533 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sat, 19 Sep 2026 17:53:30 +0800
Subject: [PATCH 1/6] fix: align sidebar content columns

---
 web/src/components/Sidebar.jsx | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/web/src/components/Sidebar.jsx b/web/src/components/Sidebar.jsx
index 78378735..bf54f566 100644
--- a/web/src/components/Sidebar.jsx
+++ b/web/src/components/Sidebar.jsx
@@ -534,14 +534,14 @@ function CustomSidebarItem({ item, count, onClick }) {
       type="button"
       onClick={onClick}
       data-sidebar-custom-item={item.id}
-      className="ace-sidebar-primary-text w-full flex items-center gap-[5px] px-3 py-[3px] text-[14px] text-fg hover:bg-surface-hi transition text-left"
+      className="ace-sidebar-primary-text w-full flex items-center gap-[7px] px-3 py-[3px] text-[14px] text-fg hover:bg-surface-hi transition text-left"
     >
-      <span className="w-6 h-6 flex items-center justify-center shrink-0">
+      <span className="w-6 h-6 flex items-center justify-start shrink-0">
         <CustomSidebarIcon icon={item.icon} />
       </span>
       <span className="flex-1 min-w-0 truncate">{item.label}</span>
       {Number.isFinite(count) && (
-        <span className="text-[11px] text-fg-mute shrink-0 tabular-nums">{count}</span>
+        <span className="ace-sidebar-meta-text w-6 text-right text-[13px] text-fg-mute shrink-0 tabular-nums">{count}</span>
       )}
     </button>
   );
@@ -600,11 +600,11 @@ function CustomSidebarSection({ workspaceHash = '', onOpenSettingsSection, onOpe
         </span>
         <span className="flex-1 min-w-0 text-left truncate">扩展</span>
         {totalCount != null && (
-          <span className="mr-2 shrink-0 tabular-nums text-fg-mute">{totalCount}</span>
+          <span className="ace-sidebar-meta-text w-6 text-right text-[13px] text-fg-mute shrink-0 tabular-nums">{totalCount}</span>
         )}
       </button>
       {expanded && (
-        <div id={listId} className="ace-sidebar-custom-list ml-6 my-1 border-l border-border pl-1">
+        <div id={listId} className="ace-sidebar-custom-list">
           {SIDEBAR_CUSTOM_ITEMS.map((item) => (
             <CustomSidebarItem
               key={item.id}
@@ -1125,7 +1125,7 @@ function SessionRow({
       data-sidebar-workspace-session-workspace={workspaceReorderable ? workspaceHash || undefined : undefined}
       aria-describedby={hoverCardVisible ? hoverCardId : undefined}
       className={clsx(
-        'ace-sidebar-session-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 my-px px-2 rounded-md text-[14px] transition',
+        'ace-sidebar-session-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 my-px px-2 rounded-md text-[14px] transition',
         pinned && 'ace-sidebar-pinned-session-row',
         workspaceReorderable && 'ace-sidebar-workspace-session-row',
         dragging && 'is-dragging',
@@ -1267,7 +1267,7 @@ function SessionRow({
           </span>
         ) : null}
         {showSessionTime && !editing && !pendingPermission && !pendingQuestion && (
-          <span className="ace-sidebar-row-idle-slot ace-sidebar-meta-text text-[13px] text-fg-mute shrink-0">
+          <span className="ace-sidebar-row-idle-slot ace-sidebar-meta-text w-12 whitespace-nowrap text-right text-[13px] text-fg-mute shrink-0 tabular-nums">
             {relativeTime(s.updated_at || s.created_at)}
           </span>
         )}
@@ -1683,7 +1683,7 @@ function WorkspaceGroup({
       {expanded && (
         <div className="mt-px mb-[10px]">
           {sessions.length === 0 ? (
-            <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
+            <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
               <span aria-hidden="true" />
               <span>{sessionsLoading ? '加载中...' : '暂无任务'}</span>
             </div>
@@ -1713,7 +1713,7 @@ function WorkspaceGroup({
                 );
               })}
               {projectedSessions.collapsible && (
-                <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 px-2">
+                <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2">
                   <span aria-hidden="true" />
                   <button
                     type="button"
@@ -1753,7 +1753,7 @@ function NoWorkspaceSessionGroup({
   return (
     <div className="mt-px mb-[10px]">
       {sessions.length === 0 ? (
-        <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
+        <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
           <span aria-hidden="true" />
           <span>{sessionsLoading ? '加载中...' : '暂无任务'}</span>
         </div>
@@ -1775,7 +1775,7 @@ function NoWorkspaceSessionGroup({
             />
           ))}
           {projectedSessions.collapsible && (
-            <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 px-2">
+            <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2">
               <span aria-hidden="true" />
               <button
                 type="button"

From 0f42eaac890fc88f5f0bfbecd36813a73ca185a0 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sun, 20 Sep 2026 15:34:42 +0800
Subject: [PATCH 2/6] refine sidebar workspace actions

---
 web/src/components/DesktopContextMenu.jsx     |   7 +-
 web/src/components/Sidebar.jsx                | 153 ++++++------------
 web/src/components/SidebarQuickMenu.jsx       |   2 +-
 web/src/components/TopBar.jsx                 |   1 -
 web/src/lib/desktopContextMenu.js             |   4 +-
 web/src/lib/desktopContextMenu.test.js        |  29 ++--
 web/src/lib/interfaceIcons.test.js            |   2 +-
 web/src/lib/runTests.js                       |   1 +
 ...onCreationActionGuardsArchitecture.test.js |   2 +-
 .../lib/sidebarAlignmentArchitecture.test.js  |  27 ++++
 .../sidebarCustomSectionArchitecture.test.js  |   6 +-
 ...idebarWorkspaceHeadingArchitecture.test.js |  43 ++---
 ...orkspaceGitInfoRefreshArchitecture.test.js |   2 +-
 web/src/styles/globals.css                    |  25 ++-
 14 files changed, 143 insertions(+), 161 deletions(-)
 create mode 100644 web/src/lib/sidebarAlignmentArchitecture.test.js

diff --git a/web/src/components/DesktopContextMenu.jsx b/web/src/components/DesktopContextMenu.jsx
index 8c7b7bf1..e08efd4d 100644
--- a/web/src/components/DesktopContextMenu.jsx
+++ b/web/src/components/DesktopContextMenu.jsx
@@ -45,12 +45,9 @@ const ACTION_LABELS = {
   [DESKTOP_CONTEXT_ACTIONS.COPY_SESSION_ID]: '复制ID',
   [DESKTOP_CONTEXT_ACTIONS.EXPORT_SESSION]: '导出',
   [DESKTOP_CONTEXT_ACTIONS.ARCHIVE_SESSION]: '归档',
-  [DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE]: '切换到项目',
-  [DESKTOP_CONTEXT_ACTIONS.EXPAND_WORKSPACE]: '展开项目',
-  [DESKTOP_CONTEXT_ACTIONS.COLLAPSE_WORKSPACE]: '折叠项目',
-  [DESKTOP_CONTEXT_ACTIONS.NEW_WORKSPACE_SESSION]: '新建会话',
+  [DESKTOP_CONTEXT_ACTIONS.NEW_WORKSPACE_SESSION]: '新建任务',
   [DESKTOP_CONTEXT_ACTIONS.IMPORT_OPENCODE_SESSIONS]: '从opencode导入会话',
-  [DESKTOP_CONTEXT_ACTIONS.RENAME_WORKSPACE]: '重命名项目',
+  [DESKTOP_CONTEXT_ACTIONS.RENAME_WORKSPACE]: '重命名',
   [DESKTOP_CONTEXT_ACTIONS.COPY_WORKSPACE_PATH]: '复制项目路径',
   [DESKTOP_CONTEXT_ACTIONS.REMOVE_WORKSPACE]: '从项目列表移除',
   [DESKTOP_CONTEXT_ACTIONS.PREVIEW_FILE]: '预览文件',
diff --git a/web/src/components/Sidebar.jsx b/web/src/components/Sidebar.jsx
index bf54f566..59a905bf 100644
--- a/web/src/components/Sidebar.jsx
+++ b/web/src/components/Sidebar.jsx
@@ -58,7 +58,6 @@ import {
 } from '../lib/sessionListEvents.js';
 import { sessionHasPendingQuestion } from '../lib/pendingQuestions.js';
 import { sessionHasPendingPermission } from '../lib/permissionRequestQueue.js';
-import { pickExistingWorkspace } from '../lib/workspacePicker.js';
 import {
   applyStatusSnapshot,
   applyStatusUpdate,
@@ -74,7 +73,6 @@ import {
   applyRemoteControlSessionSelection,
   clearRemoteControlSessionBindings,
   completeRemoteControlSurgeRequest,
-  expandedSessionListsAfterWorkspaceCollapseAll,
   expandedSessionListsAfterWorkspaceDisclosure,
   nextRemoteControlSurgeRequest,
   reorderSidebarWorkspaceSession,
@@ -87,7 +85,6 @@ import {
   sidebarRevealTarget,
   sidebarRevealTargetKey,
   sidebarSessionProjection,
-  sidebarWorkspaceListKeys,
   upsertSidebarSession,
 } from '../lib/sidebarSessions.js';
 import {
@@ -488,7 +485,7 @@ function SidebarDisclosure({ expanded, className = '' }) {
       name={icon.name}
       size={icon.size}
       className={clsx('block shrink-0 transition-transform', className)}
-      style={{ transform: expanded ? 'rotate(0deg)' : 'rotate(-90deg)' }}
+      style={{ transform: expanded ? 'rotate(180deg)' : 'rotate(0deg)' }}
     />
   );
 }
@@ -505,9 +502,9 @@ function SidebarNavItem({ item, onClick }) {
       data-tour-target={item.id === 'new-task' ? 'sidebar-new-task' : undefined}
       onPointerDown={item.id === 'new-task' ? preserveHomeComposerFocus : undefined}
       onClick={onClick}
-      className="ace-sidebar-primary-text w-full flex items-center gap-[7px] pl-[19px] pr-3 py-[3px] rounded-md text-[14px] text-fg hover:bg-surface-hi transition text-left"
+      className="ace-sidebar-primary-text w-full flex items-center gap-[7px] pl-[19px] pr-3 h-8 rounded-md text-[14px] text-fg hover:bg-surface-hi transition text-left"
     >
-      <span className="w-6 h-6 flex items-center justify-center shrink-0">
+      <span className="w-6 h-6 flex items-center justify-start shrink-0">
         <VsIcon name={item.icon} size={18} />
       </span>
       <span className="flex-1 min-w-0 truncate">{item.label}</span>
@@ -534,14 +531,14 @@ function CustomSidebarItem({ item, count, onClick }) {
       type="button"
       onClick={onClick}
       data-sidebar-custom-item={item.id}
-      className="ace-sidebar-primary-text w-full flex items-center gap-[7px] px-3 py-[3px] text-[14px] text-fg hover:bg-surface-hi transition text-left"
+      className="ace-sidebar-primary-text w-full flex items-center gap-[7px] pl-[19px] pr-3 h-8 text-[14px] text-fg hover:bg-surface-hi transition text-left"
     >
       <span className="w-6 h-6 flex items-center justify-start shrink-0">
         <CustomSidebarIcon icon={item.icon} />
       </span>
       <span className="flex-1 min-w-0 truncate">{item.label}</span>
       {Number.isFinite(count) && (
-        <span className="ace-sidebar-meta-text w-6 text-right text-[13px] text-fg-mute shrink-0 tabular-nums">{count}</span>
+        <span className="ace-sidebar-meta-text w-[76px] text-right text-[13px] text-fg-mute shrink-0 tabular-nums">{count}</span>
       )}
     </button>
   );
@@ -590,18 +587,20 @@ function CustomSidebarSection({ workspaceHash = '', onOpenSettingsSection, onOpe
         type="button"
         onClick={() => setExpanded((value) => !value)}
         data-sidebar-custom-section="true"
-        className="ace-sidebar-extensions-trigger ace-sidebar-primary-text w-full flex items-center gap-[7px] pl-[19px] pr-3 py-[3px] rounded-md text-[14px] text-fg hover:bg-surface-hi transition"
+        className="ace-sidebar-extensions-trigger ace-sidebar-primary-text w-full flex items-center gap-[7px] pl-[19px] pr-3 h-8 rounded-md text-[14px] text-fg hover:bg-surface-hi transition"
         aria-expanded={expanded}
         aria-controls={listId}
       >
-        <span className="relative w-6 h-6 flex items-center justify-center shrink-0">
+        <span className="w-6 h-6 flex items-center justify-start shrink-0">
           <span className="ace-sidebar-extensions-icon flex"><VsIcon name="extension" size={18} /></span>
-          <span className="ace-sidebar-extensions-arrow absolute inset-0 flex items-center justify-center"><SidebarDisclosure expanded /></span>
         </span>
         <span className="flex-1 min-w-0 text-left truncate">扩展</span>
-        {totalCount != null && (
-          <span className="ace-sidebar-meta-text w-6 text-right text-[13px] text-fg-mute shrink-0 tabular-nums">{totalCount}</span>
-        )}
+        <span className="relative w-6 h-6 flex items-center justify-end shrink-0">
+          {totalCount != null && (
+            <span className="ace-sidebar-extensions-count ace-sidebar-meta-text w-[76px] text-right text-[13px] text-fg-mute tabular-nums">{totalCount}</span>
+          )}
+          <span className="ace-sidebar-extensions-arrow absolute inset-0 flex items-center justify-end"><SidebarDisclosure expanded={expanded} /></span>
+        </span>
       </button>
       {expanded && (
         <div id={listId} className="ace-sidebar-custom-list">
@@ -627,26 +626,25 @@ function SidebarSectionHeader({ sectionId, count, expanded, onToggle, actions =
   return (
     <div
       data-sidebar-section={sectionId}
-      className="ace-sidebar-section-header ace-sidebar-section-text flex items-center gap-0.5 pl-[23px] pr-3 pt-3 pb-1 text-[13px] font-medium text-fg-mute"
+      className="ace-sidebar-section-header ace-sidebar-section-text group flex h-8 items-center gap-0.5 pl-[19px] pr-3 mt-2 mb-0 text-[13px] font-medium text-fg-mute"
     >
       <button
         type="button"
         onClick={onToggle}
-        className="min-w-0 text-left hover:text-fg transition"
-        aria-expanded={expanded}
-      >
-        <span className="block truncate">{title}</span>
-      </button>
-      <button
-        type="button"
-        onClick={onToggle}
-        data-sidebar-section-disclosure={sectionId}
-        className="w-5 h-6 rounded flex items-center justify-center shrink-0 hover:text-fg hover:bg-surface-hi transition"
-        title={expanded ? `折叠${title}` : `展开${title}`}
-        aria-label={expanded ? `折叠${title}` : `展开${title}`}
+        className="group/section-header flex min-w-0 flex-1 items-center gap-[7px] cursor-pointer text-left rounded-md text-[13px] font-medium text-fg-mute hover:text-fg focus:outline-none focus-visible:bg-button-ghost-hover focus-visible:text-primary transition"
         aria-expanded={expanded}
       >
-        <SidebarDisclosure expanded={expanded} />
+        <span
+          data-sidebar-section-disclosure={sectionId}
+          className="inline-flex w-6 h-6 shrink-0 items-center justify-center opacity-0 transition-opacity group-hover:opacity-100 group-focus-visible/section-header:opacity-100"
+          title={expanded ? `折叠${title}` : `展开${title}`}
+          aria-hidden="true"
+        >
+          <SidebarDisclosure expanded={expanded} />
+        </span>
+        <span className={clsx('min-w-0 truncate', (sectionId === SIDEBAR_SECTION_IDS.TASKS || sectionId === SIDEBAR_SECTION_IDS.WORKSPACES) && 'ace-sidebar-section-title text-[11px]')}>
+          {title}
+        </span>
       </button>
       {actions && (
         <span data-sidebar-section-actions={sectionId} className="ace-sidebar-section-actions ml-auto flex items-center shrink-0">
@@ -1125,7 +1123,7 @@ function SessionRow({
       data-sidebar-workspace-session-workspace={workspaceReorderable ? workspaceHash || undefined : undefined}
       aria-describedby={hoverCardVisible ? hoverCardId : undefined}
       className={clsx(
-        'ace-sidebar-session-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 my-px px-2 rounded-md text-[14px] transition',
+        'ace-sidebar-session-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid h-8 grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 rounded-md text-[14px] transition',
         pinned && 'ace-sidebar-pinned-session-row',
         workspaceReorderable && 'ace-sidebar-workspace-session-row',
         dragging && 'is-dragging',
@@ -1204,12 +1202,12 @@ function SessionRow({
           onAnimationEnd={() => finishRemoteControlSurge(activeRemoteControlSurgeSequenceRef.current)}
         />
       )}
-      <span className="relative flex w-6 h-7 items-center justify-center shrink-0">
+      <span className="relative flex w-6 h-7 items-center justify-start shrink-0">
         <SessionAttentionIndicator attention={attention} meta={meta} />
       </span>
       {editing ? (
         <form
-          className="flex items-center min-w-0 py-[3px]"
+          className="flex items-center min-w-0"
           onSubmit={(e) => { e.preventDefault(); commitRename(); }}
         >
           <input
@@ -1235,7 +1233,7 @@ function SessionRow({
           aria-label={remoteControlBound
             ? tr('remoteControl.connectedSessionAria', { title: marqueeTitle || title })
             : (marqueeTitle || title)}
-          className="ace-sidebar-session-title-button flex min-w-0 w-full items-center gap-1.5 py-[4.5px] bg-transparent text-left cursor-pointer"
+          className="ace-sidebar-session-title-button ace-sidebar-tree-content flex min-w-0 w-full items-center gap-1.5 px-0 py-[4.5px] bg-transparent text-left cursor-pointer"
         >
           {remoteControlBound && (
             <VsIcon
@@ -1248,7 +1246,7 @@ function SessionRow({
           <SidebarSessionTitle title={marqueeTitle} marqueeReady={marqueeReady} />
         </button>
       )}
-      <span className="flex min-w-0 items-center justify-end gap-1">
+      <span className="flex w-full min-w-0 items-center justify-end gap-1">
         {!editing && pendingPermission ? (
           <span
             data-sidebar-permission-prompt="true"
@@ -1267,7 +1265,7 @@ function SessionRow({
           </span>
         ) : null}
         {showSessionTime && !editing && !pendingPermission && !pendingQuestion && (
-          <span className="ace-sidebar-row-idle-slot ace-sidebar-meta-text w-12 whitespace-nowrap text-right text-[13px] text-fg-mute shrink-0 tabular-nums">
+          <span className="ace-sidebar-row-idle-slot ace-sidebar-meta-text w-[76px] whitespace-nowrap text-right text-[13px] text-fg-mute shrink-0 tabular-nums">
             {relativeTime(s.updated_at || s.created_at)}
           </span>
         )}
@@ -1620,7 +1618,7 @@ function WorkspaceGroup({
   };
 
   return (
-    <div className={clsx('my-px', ws.active && 'rounded-md')}>
+    <div className={clsx(ws.active && 'rounded-md')}>
       <div
         data-desktop-open-in-explorer-kind="workspace"
         data-desktop-open-in-explorer-path={ws.cwd || undefined}
@@ -1633,12 +1631,12 @@ function WorkspaceGroup({
         data-desktop-workspace-remove={onRemove ? 'true' : undefined}
         data-desktop-workspace-opencode-import-count={opencodeImportCount > 0 ? String(opencodeImportCount) : undefined}
         className={clsx(
-          'ace-sidebar-workspace-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 pl-[12px] pr-2 py-[3px] rounded-md text-[14px] cursor-pointer transition',
+          'ace-sidebar-workspace-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 h-8 rounded-md text-[14px] cursor-pointer transition',
           ws.active ? 'bg-accent-bg text-fg' : 'text-fg hover:bg-surface-hi',
         )}
         onClick={() => (ws.active ? onToggle(ws.hash) : onActivate(ws))}
       >
-        <span className="w-6 h-6 flex items-center justify-center shrink-0">
+        <span className="w-6 h-6 flex items-center justify-start shrink-0">
           <VsIcon name={expanded ? 'folderOpen' : 'folder'} size={18} />
         </span>
         {editing ? (
@@ -1655,17 +1653,17 @@ function WorkspaceGroup({
             className="ace-sidebar-primary-text min-w-0 h-7 px-1 py-0 text-[14px] bg-surface border border-accent rounded outline-none"
           />
         ) : (
-          <span className={clsx('min-w-0 truncate', hasUnread ? 'font-semibold' : 'font-normal')}>
+          <span className={clsx('ace-sidebar-tree-content min-w-0 truncate', hasUnread ? 'font-semibold' : 'font-normal')}>
             {ws.name || ws.hash}
           </span>
         )}
-        <span data-sidebar-workspace-actions="true" className="flex items-center justify-end gap-1 shrink-0">
+        <span data-sidebar-workspace-actions="true" className="flex w-full items-center justify-end gap-1 shrink-0">
           {hasUnread && <span className="w-1.5 h-1.5 rounded-full shrink-0 bg-ok shadow-[0_0_4px_var(--ace-ok)]" title="有未读任务" />}
           <button
             data-sidebar-workspace-menu="true"
             type="button"
             onClick={openWorkspaceContextMenu}
-            className="ace-sidebar-workspace-action w-6 h-6 rounded hover:bg-surface-hi flex items-center justify-center shrink-0 opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus-visible:opacity-100 transition"
+            className="ace-sidebar-workspace-action w-6 h-6 rounded hover:bg-surface-hi flex items-center justify-center shrink-0 transition"
             title="工作区菜单"
             aria-label="工作区菜单"
           ><VsIcon name="workspaceMenu" size={18} /></button>
@@ -1674,16 +1672,16 @@ function WorkspaceGroup({
             type="button"
             onPointerDown={preserveHomeComposerFocus}
             onClick={(e) => { e.stopPropagation(); onNewSession(ws); }}
-            className="ace-sidebar-workspace-action w-6 h-6 rounded hover:bg-surface-hi flex items-center justify-center shrink-0 opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus-visible:opacity-100 transition"
+            className="ace-sidebar-workspace-action w-6 h-6 rounded hover:bg-surface-hi flex items-center justify-center shrink-0 transition"
             title="在此工作区新建任务"
             aria-label="在此工作区新建任务"
           ><VsIcon name="newSession" size={18} /></button>
         </span>
       </div>
       {expanded && (
-        <div className="mt-px mb-[10px]">
+        <div className="-mt-1 mb-2">
           {sessions.length === 0 ? (
-            <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
+            <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 py-[4px] text-[13px] text-fg-mute italic">
               <span aria-hidden="true" />
               <span>{sessionsLoading ? '加载中...' : '暂无任务'}</span>
             </div>
@@ -1713,12 +1711,12 @@ function WorkspaceGroup({
                 );
               })}
               {projectedSessions.collapsible && (
-                <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2">
+                <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2">
                   <span aria-hidden="true" />
                   <button
                     type="button"
                     onClick={() => onToggleSessionList?.(ws.hash)}
-                    className="ace-sidebar-meta-text py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg hover:bg-surface-hi transition"
+                    className="ace-sidebar-tree-content ace-sidebar-meta-text px-0 py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg transition"
                   >
                     {projectedSessions.action === 'expand' ? '展开显示' : '折叠显示'}
                   </button>
@@ -1751,9 +1749,9 @@ function NoWorkspaceSessionGroup({
   const projectedSessions = sidebarSessionProjection(sessions, sessionListExpanded);
 
   return (
-    <div className="mt-px mb-[10px]">
+    <div className="-mt-1 mb-2">
       {sessions.length === 0 ? (
-        <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2 py-[4px] text-[13px] text-fg-mute italic">
+        <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 py-[4px] text-[13px] text-fg-mute italic">
           <span aria-hidden="true" />
           <span>{sessionsLoading ? '加载中...' : '暂无任务'}</span>
         </div>
@@ -1775,12 +1773,12 @@ function NoWorkspaceSessionGroup({
             />
           ))}
           {projectedSessions.collapsible && (
-            <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[13px] mx-1.5 px-2">
+            <div className="ace-sidebar-tree-row-grid grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2">
               <span aria-hidden="true" />
               <button
                 type="button"
                 onClick={() => onToggleSessionList?.(NO_WORKSPACE_SESSION_LIST_KEY)}
-                className="ace-sidebar-meta-text py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg hover:bg-surface-hi transition"
+                className="ace-sidebar-meta-text py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg transition"
               >
                 {projectedSessions.action === 'expand' ? '展开显示' : '折叠显示'}
               </button>
@@ -3437,29 +3435,6 @@ export function Sidebar({
     onOpenHome?.(ws, { composerFeedback: true });
   }, [cancelSessionSelection, onBeforeNavigate, onOpenHome, updateExpanded]);
 
-  const onAddWorkspace = async () => {
-    try {
-      const ws = await pickExistingWorkspace({ api });
-      if (ws == null) return;
-      await refresh(ws.hash);
-      await onActivate(ws);
-    } catch (e) {
-      toast({ kind: 'err', text: '添加工作区失败:' + (e.message || '') });
-    }
-  };
-
-  const collapseAllWorkspaces = useCallback(() => {
-    workspaceCollapseAllRef.current = true;
-    updateExpanded(new Set());
-    for (const hash of sidebarWorkspaceListKeys(workspaces)) {
-      userCollapsedWorkspacesRef.current.add(hash);
-      sessionListDisclosureCompactRef.current.add(hash);
-    }
-    setExpandedSessionLists((previous) => (
-      expandedSessionListsAfterWorkspaceCollapseAll(previous, workspaces)
-    ));
-  }, [updateExpanded, workspaces]);
-
   const sidebarNavCallbacks = {
     onNewTask: () => {
       cancelSessionSelection();
@@ -3497,7 +3472,7 @@ export function Sidebar({
         style={collapsed ? undefined : { width, minWidth: width }}
       >
       <div className="ace-sidebar-content flex-1 flex flex-col min-h-0">
-        <div data-sidebar-brand="true" className="flex shrink-0 items-center gap-1.5 pl-[23px] pr-[18px] py-3 select-none">
+        <div data-sidebar-brand="true" className="flex shrink-0 items-center gap-[11px] pl-[19px] pr-[18px] py-3 select-none">
           <BrandLogo width="20" height="20" className="ace-brand-logo block shrink-0" />
           <span className="text-[15px] font-bold tracking-tight">ACECode</span>
           {appVersionLabel && (
@@ -3507,7 +3482,7 @@ export function Sidebar({
           )}
         </div>
         <div className="ace-sidebar-main flex-1 flex flex-col min-h-0">
-          <div className="ace-sidebar-fixed-nav shrink-0 overflow-y-auto pb-2">
+          <div className="ace-sidebar-fixed-nav shrink-0 overflow-y-auto">
             {SIDEBAR_NAV_ITEMS.map((item) => (
               item.action === 'extensions' ? (
                 <CustomSidebarSection
@@ -3533,7 +3508,7 @@ export function Sidebar({
           </div>
           <div
             ref={sidebarScrollRef}
-            className="ace-sidebar-scroll flex-1 overflow-y-auto pb-2"
+            className="ace-sidebar-scroll flex-1 overflow-y-auto"
             onScroll={clearSessionHover}
           >
             <SidebarSectionHeader
@@ -3601,33 +3576,9 @@ export function Sidebar({
               count={sectionCounts.workspaces}
               expanded={sectionExpansion.workspaces}
               onToggle={() => toggleSidebarSection(SIDEBAR_SECTION_IDS.WORKSPACES)}
-              actions={(
-                <>
-                  <button
-                    data-sidebar-collapse-all-workspaces="true"
-                    type="button"
-                    onClick={collapseAllWorkspaces}
-                    className="ace-sidebar-heading-collapse-btn"
-                    title="全部收缩工作区"
-                    aria-label="全部收缩工作区"
-                  >
-                    <VsIcon name="collapseAll" size={18} />
-                  </button>
-                  <button
-                    data-tour-target="sidebar-add-project"
-                    type="button"
-                    onClick={onAddWorkspace}
-                    className="w-6 h-6 rounded text-fg-mute hover:text-fg hover:bg-surface-hi flex items-center justify-center shrink-0 transition"
-                    title="添加工作区"
-                    aria-label="添加工作区"
-                  >
-                    <VsIcon name="folderAdd" size={18} />
-                  </button>
-                </>
-              )}
             />
             {sidebarSectionIsVisible(sectionCounts.workspaces) && sectionExpansion.workspaces && (
-              <div className="my-1">
+              <div className="-mt-1">
                 {workspaces.map((ws) => {
                   const items = filterPinnedSessions(
                     workspaceSessions.filter((s) => s.workspace_hash ? s.workspace_hash === ws.hash : !!ws.active),
@@ -3688,7 +3639,7 @@ export function Sidebar({
             </div>
           )}
         </div>
-        <div className="ace-sidebar-footer shrink-0 pl-[15px] pr-1.5 py-2 flex items-center gap-1">
+        <div className="ace-sidebar-footer shrink-0 pl-[19px] pr-1.5 py-2 flex items-center gap-1">
           {!collapsed && (
             <SidebarQuickMenu
               data-tour-target="sidebar-settings"
diff --git a/web/src/components/SidebarQuickMenu.jsx b/web/src/components/SidebarQuickMenu.jsx
index dec3b234..174cacce 100644
--- a/web/src/components/SidebarQuickMenu.jsx
+++ b/web/src/components/SidebarQuickMenu.jsx
@@ -47,7 +47,7 @@ export function SidebarQuickMenu({
           if (!open) onBeforeOpen?.();
           setOpen((value) => !value);
         }}
-        className="w-9 h-9 shrink-0 flex items-center justify-center rounded-md text-fg-mute hover:text-fg hover:bg-surface-hi transition focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/20"
+        className="w-6 h-8 shrink-0 flex items-center justify-start rounded-md text-fg-mute hover:text-fg hover:bg-surface-hi transition focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/20"
       >
         <VsIcon name="settings" size={18} />
       </button>
diff --git a/web/src/components/TopBar.jsx b/web/src/components/TopBar.jsx
index ec11b391..1c0d8ac7 100644
--- a/web/src/components/TopBar.jsx
+++ b/web/src/components/TopBar.jsx
@@ -162,7 +162,6 @@ export function TopBar({
           onClick={onToggleSidebar}
           pressed={!sidebarCollapsed}
           panelToggle
-          className="ml-[8px]"
         >
           <PanelToggleIcon side="left" size={16} expanded={!sidebarCollapsed} />
         </QuickBtn>
diff --git a/web/src/lib/desktopContextMenu.js b/web/src/lib/desktopContextMenu.js
index 4487738b..46572642 100644
--- a/web/src/lib/desktopContextMenu.js
+++ b/web/src/lib/desktopContextMenu.js
@@ -295,8 +295,6 @@ export function buildDesktopContextMenuItems({
     }
 
     if (workspaceTarget) {
-      addAction(items, DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE, workspaceTarget, { enabled: !workspaceTarget.active });
-      addAction(items, workspaceTarget.expanded ? DESKTOP_CONTEXT_ACTIONS.COLLAPSE_WORKSPACE : DESKTOP_CONTEXT_ACTIONS.EXPAND_WORKSPACE, workspaceTarget);
       addAction(items, DESKTOP_CONTEXT_ACTIONS.NEW_WORKSPACE_SESSION, workspaceTarget);
       if (workspaceTarget.opencodeImportCount > 0) {
         addAction(items, DESKTOP_CONTEXT_ACTIONS.IMPORT_OPENCODE_SESSIONS, workspaceTarget);
@@ -439,7 +437,7 @@ export function buildDesktopContextMenuItems({
     }
   }
 
-  if (!sessionTarget && !sessionPinTarget) {
+  if (!sessionTarget && !sessionPinTarget && !workspaceTarget) {
     addAction(items, DESKTOP_CONTEXT_ACTIONS.SELECT_ALL, null, { group: GROUPS.GENERIC });
   }
   if (hasSelection) addAction(items, DESKTOP_CONTEXT_ACTIONS.COPY, null, { group: GROUPS.GENERIC });
diff --git a/web/src/lib/desktopContextMenu.test.js b/web/src/lib/desktopContextMenu.test.js
index 5322e016..5a023867 100644
--- a/web/src/lib/desktopContextMenu.test.js
+++ b/web/src/lib/desktopContextMenu.test.js
@@ -250,8 +250,10 @@ test('descriptor metadata includes label keys, disabled states, and scoped confi
   assert.equal(copyTitle.labelKey, DESKTOP_CONTEXT_ACTIONS.COPY_SESSION_TITLE);
   assert.equal(copyTitle.enabled, false);
 
-  const activateWorkspace = items.find((item) => item.id === DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE);
-  assert.equal(activateWorkspace.enabled, false);
+  assert.equal(
+    items.some((item) => item.id === DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE),
+    false,
+  );
 
   const archiveSession = items.find((item) => item.id === DESKTOP_CONTEXT_ACTIONS.ARCHIVE_SESSION);
   assert.equal(archiveSession.danger, true);
@@ -274,8 +276,8 @@ test('已置顶会话目标显示取消置顶菜单项', () => {
   ]);
 });
 
-test('workspace 目标显示项目动作', () => {
-  assert.deepEqual(ids(buildDesktopContextMenuItems({
+test('workspace target omits navigation and select-all actions', () => {
+  const items = buildDesktopContextMenuItems({
     workspaceTarget: {
       workspaceHash: 'w1',
       path: 'C:/repo',
@@ -283,16 +285,22 @@ test('workspace 目标显示项目动作', () => {
       expanded: false,
       canRemove: true,
     },
-  })), [
-    DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE,
-    DESKTOP_CONTEXT_ACTIONS.EXPAND_WORKSPACE,
+  });
+  assert.deepEqual(ids(items), [
     DESKTOP_CONTEXT_ACTIONS.NEW_WORKSPACE_SESSION,
     DESKTOP_CONTEXT_ACTIONS.RENAME_WORKSPACE,
     DESKTOP_CONTEXT_ACTIONS.COPY_WORKSPACE_PATH,
     DESKTOP_CONTEXT_ACTIONS.OPEN_IN_EXPLORER,
     DESKTOP_CONTEXT_ACTIONS.REMOVE_WORKSPACE,
-    DESKTOP_CONTEXT_ACTIONS.SELECT_ALL,
   ]);
+  assert.doesNotMatch(ids(items).join(','), /activate_workspace|expand_workspace|collapse_workspace|select_all/);
+});
+
+test('workspace context menu omits select-all even when no session is targeted', () => {
+  const items = buildDesktopContextMenuItems({
+    workspaceTarget: { workspaceHash: 'w1', path: 'C:/repo' },
+  });
+  assert.equal(items.some((item) => item.id === DESKTOP_CONTEXT_ACTIONS.SELECT_ALL), false);
 });
 
 test('workspace 有 opencode import count 时显示导入动作', () => {
@@ -305,11 +313,10 @@ test('workspace 有 opencode import count 时显示导入动作', () => {
       opencodeImportCount: 3,
     },
   });
-  assert.deepEqual(ids(items).slice(0, 4), [
-    DESKTOP_CONTEXT_ACTIONS.ACTIVATE_WORKSPACE,
-    DESKTOP_CONTEXT_ACTIONS.EXPAND_WORKSPACE,
+  assert.deepEqual(ids(items).slice(0, 3), [
     DESKTOP_CONTEXT_ACTIONS.NEW_WORKSPACE_SESSION,
     DESKTOP_CONTEXT_ACTIONS.IMPORT_OPENCODE_SESSIONS,
+    DESKTOP_CONTEXT_ACTIONS.RENAME_WORKSPACE,
   ]);
 });
 
diff --git a/web/src/lib/interfaceIcons.test.js b/web/src/lib/interfaceIcons.test.js
index e8d848f1..52d706d3 100644
--- a/web/src/lib/interfaceIcons.test.js
+++ b/web/src/lib/interfaceIcons.test.js
@@ -36,7 +36,7 @@ run('all public functional SVGs are complete deterministic exports', () => {
   assert.deepEqual(files, Object.keys(INTERFACE_ICONS).map((name) => `${name}.svg`).sort());
   for (const file of files) {
     const name = file.slice(0, -4);
-    const source = readFileSync(new URL(file, dir), 'utf8');
+    const source = readFileSync(new URL(file, dir), 'utf8').replaceAll('\r\n', '\n');
     assert.equal(source, interfaceIconSvg(name), `${name}: regenerate the assets`);
     const svg = new DOMParser().parseFromString(source, 'image/svg+xml').documentElement;
     assert.equal(svg.tagName, 'svg');
diff --git a/web/src/lib/runTests.js b/web/src/lib/runTests.js
index fca583ad..366a7c6f 100644
--- a/web/src/lib/runTests.js
+++ b/web/src/lib/runTests.js
@@ -234,6 +234,7 @@ import './sidebarWorkspaceDragArchitecture.test.js';
 import './sessionCreationActionGuardsArchitecture.test.js';
 import './sidebarSessionRevealArchitecture.test.js';
 import './sidebarCustomSectionArchitecture.test.js';
+import './sidebarAlignmentArchitecture.test.js';
 import './sidebarSessions.test.js';
 import './sidebarWorkspaceSessions.test.js';
 import './sidebarAuxiliaryFetch.test.js';
diff --git a/web/src/lib/sessionCreationActionGuardsArchitecture.test.js b/web/src/lib/sessionCreationActionGuardsArchitecture.test.js
index dab82d24..3e6aa7e3 100644
--- a/web/src/lib/sessionCreationActionGuardsArchitecture.test.js
+++ b/web/src/lib/sessionCreationActionGuardsArchitecture.test.js
@@ -32,7 +32,7 @@ test('workspace new-task actions route to the shared lazy home entry point', ()
   const openFlow = section(
     sidebar,
     'const openNewTaskInWorkspace = useCallback(async (ws) => {',
-    '\n  const onAddWorkspace = async',
+    '\n  const sidebarNavCallbacks = {',
   );
 
   assert.match(app, /onOpenHome=\{openHomeForWorkspace\}/);
diff --git a/web/src/lib/sidebarAlignmentArchitecture.test.js b/web/src/lib/sidebarAlignmentArchitecture.test.js
new file mode 100644
index 00000000..c3210366
--- /dev/null
+++ b/web/src/lib/sidebarAlignmentArchitecture.test.js
@@ -0,0 +1,27 @@
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const srcRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const sidebar = fs.readFileSync(path.join(srcRoot, 'components/Sidebar.jsx'), 'utf8');
+const topbar = fs.readFileSync(path.join(srcRoot, 'components/TopBar.jsx'), 'utf8');
+
+assert.match(sidebar, /SidebarNavItem[\s\S]*?pl-\[19px\]/);
+assert.match(sidebar, /CustomSidebarItem[\s\S]*?pl-\[19px\]/);
+assert.match(sidebar, /SidebarNavItem[\s\S]*?items-center justify-start shrink-0/);
+assert.match(sidebar, /CustomSidebarItem[\s\S]*?items-center justify-start shrink-0/);
+assert.match(sidebar, /grid-cols-\[24px_minmax\(0,1fr\)_(?:auto|76px)\][\s\S]*?gap-x-\[7px\] mx-1\.5 pl-\[13px\] pr-2/);
+assert.match(sidebar, /ace-sidebar-session-title-button ace-sidebar-tree-content[^\n]*px-0/);
+assert.match(sidebar, /ace-sidebar-tree-content min-w-0 truncate/);
+assert.match(sidebar, /ace-sidebar-tree-content ace-sidebar-meta-text px-0 py-\[5px\]/);
+assert.doesNotMatch(topbar, /className="ml-\[8px\]"/);
+assert.match(sidebar, /SidebarSectionHeader[\s\S]*?group flex h-8 items-center/);
+assert.match(sidebar, /group\/section-header flex min-w-0 flex-1 items-center/);
+assert.match(sidebar, /data-sidebar-section-disclosure=\{sectionId\}[\s\S]*?opacity-0/);
+const sectionHeader = sidebar.match(/function SidebarSectionHeader[\s\S]*?\r?\n}\r?\n/)[0];
+assert.doesNotMatch(sectionHeader, /group-focus-within:opacity-100/);
+assert.doesNotMatch(sectionHeader, /data-sidebar-section-disclosure=\{sectionId\}[\s\S]*?hover:bg-surface-hi/);
+assert.doesNotMatch(sidebar, /\[aria-expanded="true"\].*ace-sidebar-extensions-arrow/);
+
+console.log('[pass] sidebar alignment keeps icon and content columns on shared left baselines');
diff --git a/web/src/lib/sidebarCustomSectionArchitecture.test.js b/web/src/lib/sidebarCustomSectionArchitecture.test.js
index 3cd44e9c..a4328c86 100644
--- a/web/src/lib/sidebarCustomSectionArchitecture.test.js
+++ b/web/src/lib/sidebarCustomSectionArchitecture.test.js
@@ -77,8 +77,10 @@ test('extension disclosure supports accessible buttons and a stable hover icon s
   const css = source('styles/globals.css');
   assert.match(sidebar, /aria-expanded=\{expanded\}\s+aria-controls=\{listId\}/);
   assert.match(sidebar, /id=\{listId\} className="ace-sidebar-custom-list/);
-  assert.match(sidebar, /ace-sidebar-extensions-arrow absolute inset-0/);
-  assert.match(css, /\.ace-sidebar-extensions-trigger:is\(:hover, :focus-visible, \[aria-expanded="true"\]\) \.ace-sidebar-extensions-arrow\s*\{\s*opacity: 1;/);
+  assert.match(sidebar, /ace-sidebar-extensions-arrow absolute inset-0 flex items-center justify-end/);
+  assert.match(css, /\.ace-sidebar-extensions-trigger:is\(:hover, :focus-visible\) \.ace-sidebar-extensions-arrow\s*\{\s*opacity: 1;/);
+  assert.doesNotMatch(css, /\.ace-sidebar-extensions-trigger:is\([^)]*:focus-within[^)]*\)/);
+  assert.doesNotMatch(sidebar, /data-sidebar-section-disclosure=.*group-focus-within/);
   assert.match(css, /\.ace-sidebar-fixed-nav\s*\{\s*max-height: 55%;/);
 });
 
diff --git a/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js b/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
index dfb558ae..1b427d3e 100644
--- a/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
+++ b/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
@@ -25,11 +25,9 @@ test('workspace heading actions stay mounted and reveal on pointer or keyboard i
 
   assert.match(sidebar, /className="ace-sidebar-section-header ace-sidebar-section-text/);
   assert.match(sidebar, /data-sidebar-section-actions=\{sectionId\} className="ace-sidebar-section-actions/);
-  assert.match(sidebar, /data-sidebar-collapse-all-workspaces="true"/);
-  assert.match(
-    sidebar,
-    /setExpandedSessionLists\(\(previous\) => \(\s*expandedSessionListsAfterWorkspaceCollapseAll\(previous, workspaces\)\s*\)\);/,
-  );
+  assert.doesNotMatch(sidebar, /data-sidebar-collapse-all-workspaces="true"/);
+  assert.doesNotMatch(sidebar, /data-tour-target="sidebar-add-project"/);
+  assert.doesNotMatch(sidebar, /添加工作区/);
   assert.match(
     sidebar,
     /updateExpanded\(\(prev\) => \{\s*const next = new Set\(prev\);\s*for \(const w of withActive\) \{\s*if \(w\.active && canAutoExpandWorkspace\(w\.hash\)\) next\.add\(w\.hash\);/,
@@ -38,37 +36,24 @@ test('workspace heading actions stay mounted and reveal on pointer or keyboard i
     sidebar,
     /allowSidebarWorkspaceAutoExpand\(selectedRevealTarget\.workspaceHash, \{\s*noWorkspace: selectedRevealTarget\.noWorkspace,\s*workspaceCollapseAll: workspaceCollapseAllRef\.current,\s*userCollapsedWorkspaces: userCollapsedWorkspacesRef\.current,/,
   );
-  assert.match(sidebar, /data-tour-target="sidebar-add-project"/);
   assert.match(styles, /\.ace-sidebar-section-actions\s*\{\s*opacity: 0;\s*pointer-events: none;/);
   assert.match(
     styles,
-    /\.ace-sidebar-section-header:hover \.ace-sidebar-section-actions,\s*\.ace-sidebar-section-header:focus-within \.ace-sidebar-section-actions\s*\{\s*opacity: 1;\s*pointer-events: auto;/,
-  );
-});
-
-test('workspace collapse-all keeps disclosure-only reopen session lists compact', () => {
-  const sidebar = source('components/Sidebar.jsx');
-  assert.match(
-    sidebar,
-    /allowSidebarSessionListRevealExpansion\(\{\s*listKey,\s*noWorkspace: selectedRevealTarget\.noWorkspace,\s*workspaceCollapseAll: workspaceCollapseAllRef\.current,\s*disclosureCompactKeys: sessionListDisclosureCompactRef\.current,/,
+    /\.ace-sidebar-section-header:hover \.ace-sidebar-section-actions,\s*\.ace-sidebar-section-header:has\(\.ace-sidebar-section-actions :focus-visible\) \.ace-sidebar-section-actions\s*\{\s*opacity: 1;\s*pointer-events: auto;/,
   );
+  assert.doesNotMatch(styles, /\.ace-sidebar-section-header:focus-within \.ace-sidebar-section-actions/);
+  assert.match(styles, /\.ace-sidebar-workspace-action\s*\{[\s\S]*opacity: 0;/);
   assert.match(
-    sidebar,
-    /for \(const hash of sidebarWorkspaceListKeys\(workspaces\)\) \{\s*userCollapsedWorkspacesRef\.current\.add\(hash\);\s*sessionListDisclosureCompactRef\.current\.add\(hash\);/,
+    styles,
+    /\.ace-sidebar-workspace-row:hover \.ace-sidebar-workspace-action,\s*\.ace-sidebar-workspace-row \.ace-sidebar-workspace-action:focus-visible\s*\{\s*opacity: 1;/,
   );
+  assert.doesNotMatch(sidebar, /group-hover:opacity-100 focus-visible:opacity-100/);
+});
 
-  const toggleStart = sidebar.indexOf('const onToggle = (hash) => {');
-  const toggleEnd = sidebar.indexOf('\n  const onActivate', toggleStart);
-  assert.ok(toggleStart >= 0 && toggleEnd > toggleStart);
-  const toggleSource = sidebar.slice(toggleStart, toggleEnd);
-  assert.doesNotMatch(toggleSource, /workspaceCollapseAllRef\.current\s*=\s*false/);
-  assert.match(toggleSource, /sessionListDisclosureCompactRef\.current\.add\(hash\)/);
-  assert.match(
-    toggleSource,
-    /setExpandedSessionLists\(\(previous\) => \(\s*expandedSessionListsAfterWorkspaceDisclosure\(previous, hash\)\s*\)\);/,
-  );
-  assert.match(toggleSource, /userCollapsedWorkspacesRef\.current\.add\(hash\)/);
-  assert.match(toggleSource, /userCollapsedWorkspacesRef\.current\.delete\(hash\)/);
+test('workspace heading no longer exposes a collapse-all action', () => {
+  const sidebar = source('components/Sidebar.jsx');
+  assert.doesNotMatch(sidebar, /collapseAllWorkspaces/);
+  assert.doesNotMatch(sidebar, /data-sidebar-collapse-all-workspaces/);
 });
 
 test('reopening a collapsed workspace always restores the compact five-row session list', () => {
diff --git a/web/src/lib/workspaceGitInfoRefreshArchitecture.test.js b/web/src/lib/workspaceGitInfoRefreshArchitecture.test.js
index d33668e1..bcccea71 100644
--- a/web/src/lib/workspaceGitInfoRefreshArchitecture.test.js
+++ b/web/src/lib/workspaceGitInfoRefreshArchitecture.test.js
@@ -43,7 +43,7 @@ test('all workspace-backed new-task entry points refresh without changing generi
   const expertTask = section(app, 'const dispatchExpertToNewTask =', 'const consumeInitialDraftText =');
   const trayTask = section(app, 'const createDesktopTraySession =', 'const handleSubagentTasksChange =');
   const homeTask = section(chat, 'const createHomeComposerSession =', 'const stageMediaFiles =');
-  const sidebarTask = section(sidebar, 'const openNewTaskInWorkspace =', 'const onAddWorkspace =');
+  const sidebarTask = section(sidebar, 'const openNewTaskInWorkspace =', 'const sidebarNavCallbacks = {');
   const genericNavigation = section(app, 'const navigateToRef =', 'const replaceNavigationState =');
 
   assert.match(expertTask, /refreshWorkspaceGitInfo\(createApi\(base\), base\)/);
diff --git a/web/src/styles/globals.css b/web/src/styles/globals.css
index 1e9ca288..920c7d29 100644
--- a/web/src/styles/globals.css
+++ b/web/src/styles/globals.css
@@ -1711,8 +1711,9 @@ body {
 .ace-topbar {
   /* Add 5px above and 6px below the original 30px row without enlarging controls. */
   --ace-topbar-control-size: 24px;
-  /* Four controls, three gaps, and the sidebar toggle's 8px left inset. */
+  /* Four controls, three gaps, and the shared 19px sidebar first-column inset. */
   --ace-topbar-navigation-min-width: 116px;
+  --ace-topbar-leading-inset: 19px;
   box-sizing: border-box;
   min-height: var(--ace-topbar-height);
   height: auto;
@@ -1791,10 +1792,13 @@ body {
 .ace-sidebar-extensions-arrow {
   opacity: 0;
 }
-.ace-sidebar-extensions-trigger:is(:hover, :focus-visible, [aria-expanded="true"]) .ace-sidebar-extensions-icon {
+.ace-sidebar-extensions-trigger:is(:hover, :focus-visible) .ace-sidebar-extensions-icon {
+  opacity: 1;
+}
+.ace-sidebar-extensions-trigger:is(:hover, :focus-visible) .ace-sidebar-extensions-count {
   opacity: 0;
 }
-.ace-sidebar-extensions-trigger:is(:hover, :focus-visible, [aria-expanded="true"]) .ace-sidebar-extensions-arrow {
+.ace-sidebar-extensions-trigger:is(:hover, :focus-visible) .ace-sidebar-extensions-arrow {
   opacity: 1;
 }
 .ace-desktop-frameless-topbar {
@@ -2193,6 +2197,12 @@ body {
 }
 .ace-sidebar-workspace-action {
   color: var(--ace-fg);
+  opacity: 0;
+  transition: opacity .15s ease, color .15s ease, background-color .15s ease;
+}
+.ace-sidebar-workspace-row:hover .ace-sidebar-workspace-action,
+.ace-sidebar-workspace-row .ace-sidebar-workspace-action:focus-visible {
+  opacity: 1;
 }
 .ace-sidebar-workspace-action:hover,
 .ace-sidebar-workspace-action:focus-visible {
@@ -5200,7 +5210,7 @@ a.ace-thread-link:focus-visible {
   transition: opacity .15s ease;
 }
 .ace-sidebar-section-header:hover .ace-sidebar-section-actions,
-.ace-sidebar-section-header:focus-within .ace-sidebar-section-actions {
+.ace-sidebar-section-header:has(.ace-sidebar-section-actions :focus-visible) .ace-sidebar-section-actions {
   opacity: 1;
   pointer-events: auto;
 }
@@ -6455,7 +6465,12 @@ div.ace-markdown-opaque > div.ace-markdown-opaque-rendered {
 
 /* Preserve the sidebar's medium baseline while following the user's font size.
    Role selectors still outrank utility classes, but use the shared size tokens. */
-.ace-sidebar .ace-sidebar-section-text,
+.ace-sidebar .ace-sidebar-section-text {
+  font-size: var(--ace-font-size-13) !important;
+}
+.ace-sidebar .ace-sidebar-section-title {
+  font-size: var(--ace-font-size-11) !important;
+}
 .ace-sidebar .ace-sidebar-meta-text {
   font-size: var(--ace-font-size-12) !important;
 }

From fe46ece8789c230a65614dc921dd1e6444fbbc45 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sun, 20 Sep 2026 19:09:52 +0800
Subject: [PATCH 3/6] Replace session loading dots with abstract A matrix

---
 web/scripts/check-session-loading-motion.py   | 37 ++++----
 web/src/components/Sidebar.jsx                | 18 ++--
 .../lib/permissionSidebarArchitecture.test.js | 16 ++--
 web/src/styles/globals.css                    | 85 ++++++-------------
 4 files changed, 61 insertions(+), 95 deletions(-)

diff --git a/web/scripts/check-session-loading-motion.py b/web/scripts/check-session-loading-motion.py
index 4ee134a7..3abd39f0 100644
--- a/web/scripts/check-session-loading-motion.py
+++ b/web/scripts/check-session-loading-motion.py
@@ -6,7 +6,6 @@
 
 import argparse
 import json
-import math
 import subprocess
 from html.parser import HTMLParser
 from pathlib import Path
@@ -66,13 +65,13 @@ def production_markup():
 
 SNAPSHOT = '''() => {
   const host = document.querySelector('.ace-session-loading');
-  const orbit = host.querySelector('.ace-session-loading-orbit');
   const dots = [...host.querySelectorAll('.ace-session-loading-dot')];
   const center = node => { const r = node.getBoundingClientRect(); return [r.x+r.width/2, r.y+r.height/2]; };
   return { centers:dots.map(center), hostCenter:center(host),
     diameter:dots.map(node => parseFloat(getComputedStyle(node).width)),
-    slot:[host.offsetWidth, host.offsetHeight], opacity:parseFloat(getComputedStyle(orbit).opacity),
-    transforms:[orbit, ...dots].map(node => getComputedStyle(node).transform),
+    slot:[host.offsetWidth, host.offsetHeight],
+    opacity:dots.map(node => parseFloat(getComputedStyle(node).opacity)),
+    transforms:dots.map(node => getComputedStyle(node).transform),
     label:host.getAttribute('aria-label') };
 }'''
 
@@ -119,23 +118,18 @@ def mount(theme='light', motion='no-preference', width=390):
                         }''', SNAPSHOT)
                         for frame in frames:
                             assert frame['slot'] == [16, 16], frame
-                            assert len(frame['centers']) == 4 and frame['label'] == 'Running'
-                            assert all(abs(d - 4.3) < 0.01 for d in frame['diameter'])
-                            assert all(math.dist(frame['centers'][a], frame['centers'][b]) > 4.3
-                                       for a in range(4) for b in range(a + 1, 4))
-                            centroid = [sum(c[axis] for c in frame['centers']) / 4 for axis in [0, 1]]
-                            assert math.dist(centroid, frame['hostCenter']) < 0.02
+                            assert len(frame['centers']) == 12 and frame['label'] == 'Running'
+                            assert all(abs(d - 2) < 0.01 for d in frame['diameter'])
+                            assert len({tuple(c) for c in frame['centers']}) == 12
                         if motion == 'reduce':
                             assert all(frame['transforms'] == frames[0]['transforms'] for frame in frames)
-                            opacity = [frame['opacity'] for frame in frames]
-                            assert min(opacity) >= 0.599 and max(opacity) <= 1
-                            assert max(opacity) - min(opacity) > 0.39, 'Reduced motion must retain gentle running feedback'
+                            assert all(opacity == 1 for frame in frames for opacity in frame['opacity'])
                         else:
-                            assert all(math.dist(a['centers'][0], b['centers'][0]) > 0.02
-                                       for a, b in zip(frames, frames[1:])), 'Running motion must not stall'
+                            assert any(a['opacity'] != b['opacity']
+                                       for a, b in zip(frames, frames[1:])), 'Dot-matrix animation must not stall'
                         results.append({'browser': browser.version, 'theme': theme, 'width': width, 'motion': motion, 'passed': True})
 
-            # Live preference changes must work without manually controlling animations.
+            # Live preference changes must stop and resume the dot pulse.
             mount()
             for motion in ['no-preference', 'reduce', 'no-preference']:
                 page.emulate_media(reduced_motion=motion)
@@ -144,16 +138,15 @@ def mount(theme='light', motion='no-preference', width=390):
                 last = page.evaluate(SNAPSHOT)
                 if motion == 'reduce':
                     assert first['transforms'] == last['transforms']
-                    assert abs(first['opacity'] - last['opacity']) > 0.01
+                    assert first['opacity'] == last['opacity'] == [1] * 12
                 else:
-                    assert first['transforms'] != last['transforms']
+                    assert first['opacity'] != last['opacity']
 
-            # Defined resting positions keep all four dots separate before animation starts.
+            # The resting dot matrix remains an abstract A with twelve distinct points.
             mount()
-            page.add_style_tag(content='.ace-session-loading * { animation: none !important; }')
+            page.add_style_tag(content='.ace-session-loading * { animation: none !important; opacity: 1 !important; }')
             resting = page.evaluate(SNAPSHOT)
-            assert all(math.dist(c, resting['hostCenter']) > 3.4 for c in resting['centers'])
-            assert len({tuple(c) for c in resting['centers']}) == 4
+            assert len({tuple(c) for c in resting['centers']}) == 12
             if args.screenshot_dir:
                 args.screenshot_dir.mkdir(parents=True, exist_ok=True)
                 page.locator('.ace-session-loading').screenshot(
diff --git a/web/src/components/Sidebar.jsx b/web/src/components/Sidebar.jsx
index 370a61a7..54d7fcf5 100644
--- a/web/src/components/Sidebar.jsx
+++ b/web/src/components/Sidebar.jsx
@@ -675,11 +675,19 @@ function SessionAttentionIndicator({ attention, meta }) {
       role="status"
       aria-label={meta.label}
     >
-      <span className="ace-session-loading-orbit" aria-hidden="true">
-        <span className="ace-session-loading-dot is-top" />
-        <span className="ace-session-loading-dot is-right" />
-        <span className="ace-session-loading-dot is-bottom" />
-        <span className="ace-session-loading-dot is-left" />
+      <span className="ace-session-loading-matrix" aria-hidden="true">
+        <span className="ace-session-loading-dot is-a-0" />
+        <span className="ace-session-loading-dot is-a-1" />
+        <span className="ace-session-loading-dot is-a-2" />
+        <span className="ace-session-loading-dot is-a-3" />
+        <span className="ace-session-loading-dot is-a-4" />
+        <span className="ace-session-loading-dot is-a-5" />
+        <span className="ace-session-loading-dot is-a-6" />
+        <span className="ace-session-loading-dot is-a-7" />
+        <span className="ace-session-loading-dot is-a-8" />
+        <span className="ace-session-loading-dot is-a-9" />
+        <span className="ace-session-loading-dot is-a-10" />
+        <span className="ace-session-loading-dot is-a-11" />
       </span>
     </span>
   ) : (
diff --git a/web/src/lib/permissionSidebarArchitecture.test.js b/web/src/lib/permissionSidebarArchitecture.test.js
index ae00894f..4504178b 100644
--- a/web/src/lib/permissionSidebarArchitecture.test.js
+++ b/web/src/lib/permissionSidebarArchitecture.test.js
@@ -45,19 +45,19 @@ run('SessionRow uses the AskUserQuestion slot with exact permission wording', ()
   assert.match(row, /onSelect\?\.\(s\)/);
 });
 
-run('running sessions use the four-dot breathing indicator', () => {
+run('running sessions use the abstract A dot-matrix indicator', () => {
   const sidebar = source('components/Sidebar.jsx');
   const styles = source('styles/globals.css');
   const indicator = between(sidebar, 'function SessionAttentionIndicator', 'function SessionHoverCard');
   assert.match(indicator, /if \(attention !== 'in_progress' && attention !== 'unread'\) return null/);
-  assert.equal((indicator.match(/ace-session-loading-dot is-/g) || []).length, 4);
+  assert.equal((indicator.match(/ace-session-loading-dot is-a-/g) || []).length, 12);
+  assert.match(indicator, /ace-session-loading-matrix/);
   assert.match(indicator, /role="status"/);
-  assert.match(styles, /\.ace-session-loading-orbit\s*\{[\s\S]*animation: ace-session-loading-turn 6\.47s linear infinite/);
-  assert.match(styles, /\.ace-session-loading-dot\.is-top/);
-  assert.match(styles, /\.ace-session-loading-dot\.is-right/);
-  assert.match(styles, /\.ace-session-loading-dot\.is-bottom/);
-  assert.match(styles, /\.ace-session-loading-dot\.is-left/);
-  assert.match(styles, /@media \(prefers-reduced-motion: reduce\)[\s\S]*\.ace-session-loading-orbit/);
+  assert.match(styles, /@keyframes ace-session-loading-dot-pulse/);
+  assert.match(styles, /\/\* Abstract A: two interrupted strokes joined by a crossbar\. \*\//);
+  assert.match(styles, /\.ace-session-loading-dot\.is-a-0/);
+  assert.match(styles, /\.ace-session-loading-dot\.is-a-11/);
+  assert.match(styles, /@media \(prefers-reduced-motion: reduce\)[\s\S]*\.ace-session-loading \.ace-session-loading-dot[\s\S]*opacity: 1/);
 });
 
 run('permission state reaches pinned, no-workspace, and workspace session rows', () => {
diff --git a/web/src/styles/globals.css b/web/src/styles/globals.css
index 6c492ea6..7a1c3698 100644
--- a/web/src/styles/globals.css
+++ b/web/src/styles/globals.css
@@ -2532,29 +2532,9 @@ body {
   50%      { opacity: 1;   transform: scale(1); }
 }
 @keyframes ace-spin { to { transform: rotate(360deg); } }
-@keyframes ace-session-loading-turn {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}
-@keyframes ace-session-loading-fade {
-  0%, 100% { opacity: 0.6; }
-  50% { opacity: 1; }
-}
-@keyframes ace-session-loading-dot-top {
-  0%, 100% { transform: translateY(-5px); }
-  50% { transform: translateY(-3.5px); }
-}
-@keyframes ace-session-loading-dot-right {
-  0%, 100% { transform: translateX(5px); }
-  50% { transform: translateX(3.5px); }
-}
-@keyframes ace-session-loading-dot-bottom {
-  0%, 100% { transform: translateY(5px); }
-  50% { transform: translateY(3.5px); }
-}
-@keyframes ace-session-loading-dot-left {
-  0%, 100% { transform: translateX(-5px); }
-  50% { transform: translateX(-3.5px); }
+@keyframes ace-session-loading-dot-pulse {
+  0%, 18%, 100% { opacity: 0.24; transform: scale(0.7); }
+  9% { opacity: 1; transform: scale(1); }
 }
 .ace-spinner {
   display: inline-block; width: 1em; height: 1em;
@@ -2575,53 +2555,38 @@ body {
   height: 16px;
   color: var(--ace-accent);
 }
-.ace-session-loading-orbit {
+.ace-session-loading-matrix {
   position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  transform: rotate(0deg);
-  animation: ace-session-loading-turn 6.47s linear infinite;
+  inset: 0;
 }
 .ace-session-loading-dot {
   position: absolute;
-  left: 50%;
-  top: 50%;
-  width: 4.3px;
-  height: 4.3px;
-  margin: -2.15px 0 0 -2.15px;
+  width: 2px;
+  height: 2px;
   border-radius: 9999px;
   background: currentColor;
-  transform-origin: center;
-  animation-duration: 2.156s;
-  animation-timing-function: cubic-bezier(.65, 0, .35, 1);
-  animation-iteration-count: infinite;
-}
-.ace-session-loading-dot.is-top {
-  transform: translateY(-3.5px);
-  animation-name: ace-session-loading-dot-top;
-}
-.ace-session-loading-dot.is-right {
-  transform: translateX(3.5px);
-  animation-name: ace-session-loading-dot-right;
-}
-.ace-session-loading-dot.is-bottom {
-  transform: translateY(3.5px);
-  animation-name: ace-session-loading-dot-bottom;
-}
-.ace-session-loading-dot.is-left {
-  transform: translateX(-3.5px);
-  animation-name: ace-session-loading-dot-left;
-}
+  animation: ace-session-loading-dot-pulse 1.8s cubic-bezier(.65, 0, .35, 1) infinite;
+}
+/* Abstract A: two interrupted strokes joined by a crossbar. */
+.ace-session-loading-dot.is-a-0 { left: 7px; top: 1px; animation-delay: 0ms; }
+.ace-session-loading-dot.is-a-1 { left: 5px; top: 3px; animation-delay: 150ms; }
+.ace-session-loading-dot.is-a-2 { left: 9px; top: 3px; animation-delay: 300ms; }
+.ace-session-loading-dot.is-a-3 { left: 4px; top: 6px; animation-delay: 450ms; }
+.ace-session-loading-dot.is-a-4 { left: 10px; top: 6px; animation-delay: 600ms; }
+.ace-session-loading-dot.is-a-5 { left: 5px; top: 8px; animation-delay: 750ms; }
+.ace-session-loading-dot.is-a-6 { left: 7px; top: 8px; animation-delay: 900ms; }
+.ace-session-loading-dot.is-a-7 { left: 9px; top: 8px; animation-delay: 1050ms; }
+.ace-session-loading-dot.is-a-8 { left: 3px; top: 11px; animation-delay: 1200ms; }
+.ace-session-loading-dot.is-a-9 { left: 11px; top: 11px; animation-delay: 1350ms; }
+.ace-session-loading-dot.is-a-10 { left: 2px; top: 14px; animation-delay: 1500ms; }
+.ace-session-loading-dot.is-a-11 { left: 12px; top: 14px; animation-delay: 1650ms; }
 
 @media (prefers-reduced-motion: reduce) {
-  /* Keep running feedback visible when Windows requests reduced motion. */
-  .ace-session-loading-orbit {
-    animation: ace-session-loading-fade 2.4s ease-in-out infinite;
-  }
+  /* Keep the abstract A visible without movement. */
   .ace-session-loading .ace-session-loading-dot {
     animation: none;
+    opacity: 1;
+    transform: none;
   }
 }
 

From e65c53ea430c0c0345c7cd690acd64797d3cb3e8 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sun, 20 Sep 2026 19:11:55 +0800
Subject: [PATCH 4/6] Optimize sidebar vertical spacing

---
 .../2026-09-20-sidebar-spacing-design.md      | 584 ++++++++++++++++++
 web/src/components/Sidebar.jsx                |  22 +-
 .../lib/sidebarAlignmentArchitecture.test.js  |  15 +-
 web/src/styles/globals.css                    |   2 +-
 4 files changed, 608 insertions(+), 15 deletions(-)
 create mode 100644 docs/specs/2026-09-20-sidebar-spacing-design.md

diff --git a/docs/specs/2026-09-20-sidebar-spacing-design.md b/docs/specs/2026-09-20-sidebar-spacing-design.md
new file mode 100644
index 00000000..0b301651
--- /dev/null
+++ b/docs/specs/2026-09-20-sidebar-spacing-design.md
@@ -0,0 +1,584 @@
+# ACECode 左侧侧边栏间距调整设计方案
+
+## 1. 背景与目标
+
+ACECode 左侧侧边栏当前的问题不是单纯“整体太松”或“整体太紧”，而是纵向间距缺少稳定语义：
+
+- 分组标题上方留白较大，标题下方却因负 margin 显得拥挤；
+- 同类任务行连续贴合，缺少稳定的扫描节奏；
+- 工作区父行、子任务和下一工作区使用不同的间距规则；
+- 局部负 margin 会让标题、工作区行和子任务行的布局范围发生重叠。
+
+本次调整只重新定义侧边栏的纵向节奏，并允许轻微调整分组标题字号。必须保留现有信息结构、交互行为、左侧基线、右侧基线和列宽关系。
+
+核心原则：
+
+> 只重新定义纵向关系，不重新设计横向网格。
+
+## 2. 范围
+
+### 2.1 包含
+
+- 统一普通列表行之间的纵向间距；
+- 统一分组之间的纵向间距；
+- 移除侧边栏列表中的负 margin 重叠；
+- 将分组标题调整为更紧凑的高度；
+- 将分组标题字号从 11px token 调整为 12px token；
+- 固化现有横向对齐规则，防止后续修改造成回归；
+- 补充相应的结构测试和视觉验收。
+
+### 2.2 不包含
+
+- 不修改侧边栏宽度；
+- 不修改 TopBar 与侧边栏的水平对应关系；
+- 不改变任务、工作区、置顶任务或扩展的信息结构；
+- 不删除会话左侧状态槽；
+- 不隐藏会话时间；
+- 不改变右侧时间列宽度；
+- 不修改图标大小、操作按钮位置或折叠按钮显示逻辑；
+- 不修改会话拖拽、工作区展开或数据加载行为；
+- 不重构 Sidebar 数据流；
+- 不编辑导出的 `ACECode.html` 或构建产物。
+
+## 3. 不可破坏的横向对齐契约
+
+以下数值是现有布局契约，不是本次可自由调整的参数。
+
+### 3.1 树形行三列结构
+
+会话行、工作区行、空状态行和“展开显示”行继续使用：
+
+```text
+24px 图标/状态列
+7px 列间距
+minmax(0, 1fr) 标题列
+7px 列间距
+76px 右侧信息/操作列
+```
+
+对应 class 必须继续保持：
+
+```jsx
+grid-cols-[24px_minmax(0,1fr)_76px]
+gap-x-[7px]
+mx-1.5
+pl-[13px]
+pr-2
+```
+
+主要位置：
+
+- `SessionRow`；
+- `WorkspaceGroup`；
+- 工作区和无工作区空状态；
+- 工作区和无工作区“展开显示”行。
+
+禁止：
+
+- 将 `76px` 改为 `auto`；
+- 修改 `gap-x-[7px]`；
+- 删除 `mx-1.5`；
+- 修改 `pl-[13px] pr-2`；
+- 让标题跨列；
+- 根据内容动态改变右侧列宽。
+
+该契约保证：
+
+- 所有会话标题左对齐；
+- 工作区名称与会话标题左对齐；
+- “展开显示”与标题列左对齐；
+- 时间、计数和操作按钮右对齐；
+- 时间、状态、悬浮操作切换时标题不会水平跳动。
+
+### 3.2 一级导航左侧基线
+
+一级导航继续保持：
+
+```jsx
+pl-[19px]
+pr-3
+w-6
+gap-[7px]
+justify-start
+```
+
+其文字起点保持为：
+
+```text
+19px 左边距 + 24px 图标槽 + 7px gap = 50px
+```
+
+适用于：
+
+- `SidebarNavItem`；
+- `CustomSidebarItem`；
+- 扩展入口。
+
+### 3.3 分组标题左侧基线
+
+分组标题中的折叠图标槽继续保留：
+
+```jsx
+pl-[19px]
+w-6
+gap-[7px]
+```
+
+即使折叠图标默认透明，也不得删除这个槽位。它负责让“任务”“工作区”等分组标题与标题列共享既有基线。
+
+### 3.4 右侧基线
+
+以下元素继续使用固定的 76px 右侧列：
+
+- 会话时间；
+- 权限请求状态；
+- 等待回复状态；
+- 工作区菜单和新建任务按钮区域；
+- 扩展数量；
+- 空状态对应的第三列。
+
+右侧容器继续保持：
+
+```jsx
+w-full
+justify-end
+```
+
+不得为了缩小空白移除固定右侧列。
+
+## 4. 目标纵向节奏
+
+采用两档间距系统：
+
+| 关系 | 目标值 |
+|---|---:|
+| 普通行高度 | 32px |
+| 同类行之间 | 2px |
+| 分组标题高度 | 24px |
+| 分组标题到首行 | 2px |
+| 前一组到下一分组标题 | 8px |
+| 展开工作区结束到下一工作区 | 8px |
+| 品牌区 | 保持现状 |
+
+统一规则：
+
+```text
+组内：2px
+组间：8px
+普通行：32px
+标题行：24px
+```
+
+不再使用负 margin 表达层级关系。
+
+## 5. 详细设计
+
+### 5.1 品牌区
+
+品牌区保持现状：
+
+```jsx
+gap-[11px]
+pl-[19px]
+pr-[18px]
+py-3
+```
+
+Logo、品牌名称、版本号和品牌区总高度都不调整。
+
+### 5.2 一级导航
+
+以下项目继续使用 `h-8`：
+
+- 新建任务；
+- 定时任务；
+- 扩展；
+- 扩展展开后的子项。
+
+由列表父容器统一提供 2px 间隔：
+
+```jsx
+<div className="ace-sidebar-fixed-nav shrink-0 flex flex-col gap-0.5 overflow-y-auto">
+```
+
+不要在各个导航项上单独增加 margin。
+
+扩展子项也应维持 32px 行高和 2px 行间距。如果现有扩展列表不是 flex column，应只在其现有容器上补充 `flex flex-col gap-0.5`，不要引入新的布局模块。
+
+### 5.3 分组标题
+
+`SidebarSectionHeader` 从：
+
+```jsx
+h-8 mt-2
+```
+
+调整为：
+
+```jsx
+h-6 mt-2
+```
+
+要求：
+
+- 标题行高度从 32px 调整为 24px；
+- 标题上方 8px 组间距保持不变；
+- 标题颜色、字重、左右 padding 和内部图标槽保持不变；
+- 标题内部按钮继续保留 `gap-[7px]` 和 `w-6` 图标槽。
+
+`globals.css` 中：
+
+```css
+.ace-sidebar .ace-sidebar-section-title {
+  font-size: var(--ace-font-size-11) !important;
+}
+```
+
+调整为：
+
+```css
+.ace-sidebar .ace-sidebar-section-title {
+  font-size: var(--ace-font-size-12) !important;
+}
+```
+
+不要修改 `.ace-sidebar-primary-text` 和 `.ace-sidebar-meta-text` 的字号规则。
+
+### 5.4 置顶任务列表
+
+当前置顶任务容器使用 `my-1`。调整为：
+
+```jsx
+<div className="mt-0.5 flex flex-col gap-0.5">
+```
+
+含义：
+
+- 标题到第一行 2px；
+- 任务行之间 2px；
+- 不提供额外底部 margin，下一分组标题自己的 `mt-2` 负责 8px 组间距。
+
+### 5.5 无工作区任务列表
+
+移除：
+
+```jsx
+-mt-1
+```
+
+容器调整为：
+
+```jsx
+<div className="mt-0.5 flex flex-col gap-0.5">
+```
+
+不要保留额外 `mb-2`，避免与下一分组标题的 `mt-2` 叠加为 16px。
+
+目标关系：
+
+```text
+任务标题      24px
+              2px
+任务行        32px
+              2px
+任务行        32px
+              8px
+工作区标题    24px
+```
+
+### 5.6 工作区列表外层
+
+移除：
+
+```jsx
+-mt-1
+```
+
+调整为：
+
+```jsx
+<div className="mt-0.5 flex flex-col gap-0.5">
+```
+
+含义：
+
+- 工作区标题到第一个工作区 2px；
+- 折叠工作区之间 2px；
+- 展开的工作区由其内部组尾间距与下一个工作区分隔。
+
+### 5.7 工作区子任务列表
+
+移除：
+
+```jsx
+-mt-1
+```
+
+调整为：
+
+```jsx
+<div className="mt-0.5 mb-2 flex flex-col gap-0.5">
+```
+
+含义：
+
+- 工作区父行到第一个子任务 2px；
+- 子任务之间 2px；
+- 展开工作区组结束后到下一个工作区 8px。
+
+不得以负 margin 或 transform 模拟父子贴合。
+
+### 5.8 普通行
+
+以下行继续使用 `h-8`：
+
+- `SessionRow`；
+- `WorkspaceGroup`；
+- `SidebarNavItem`；
+- `CustomSidebarItem`；
+- 扩展入口。
+
+普通行不改为 30px 或 34px。目标是 `32px 行高 + 2px 行间距`。
+
+这可以保持现有点击目标、拖拽命中范围、悬浮背景高度和内部控件垂直居中。
+
+### 5.9 空状态及展开/折叠显示
+
+“暂无任务”“加载中……”“展开显示”“折叠显示”继续使用现有三列 grid。父容器已有 `gap-0.5` 后，不再给这些行添加额外上下 margin。
+
+“展开显示”按钮必须继续位于第二列：
+
+```jsx
+<span aria-hidden="true" />
+<button className="ace-sidebar-tree-content ...">
+```
+
+工作区和无工作区版本都必须包含：
+
+```jsx
+ace-sidebar-tree-content
+px-0
+```
+
+确保二者文字起点一致。
+
+## 6. 目标结构示意
+
+### 6.1 顶部导航
+
+```text
+[ACECode 品牌区]
+
+新建任务          32px
+                  2px
+定时任务          32px
+                  2px
+扩展              32px
+```
+
+### 6.2 普通任务分组
+
+```text
+                  8px
+任务 (19)         24px
+                  2px
+任务 A            32px
+                  2px
+任务 B            32px
+                  2px
+任务 C            32px
+                  2px
+展开显示          原有内容高度
+```
+
+### 6.3 工作区分组
+
+```text
+                  8px
+工作区 (3)        24px
+                  2px
+acecode           32px
+                  2px
+会话 A            32px
+                  2px
+会话 B            32px
+                  2px
+展开显示          原有内容高度
+                  8px
+tui-studio-i18n   32px
+                  2px
+万能服务          32px
+```
+
+示意中的父子关系不代表新增横向缩进；所有水平位置继续遵循第 3 节的现有对齐契约。
+
+## 7. 实现范围
+
+原则上只修改以下文件：
+
+1. `web/src/components/Sidebar.jsx`
+   - 调整列表容器的纵向 class；
+   - 删除目标区域的 `-mt-1`；
+   - 分组标题 `h-8` 改为 `h-6`；
+   - 无工作区“展开显示”补齐统一内容 class；
+   - 不改 grid、水平 padding 和右侧列。
+
+2. `web/src/styles/globals.css`
+   - 分组标题字号 token 从 11 调整为 12；
+   - 不新建复杂布局系统。
+
+3. `web/src/lib/sidebarAlignmentArchitecture.test.js`
+   - 固化横向对齐契约；
+   - 增加纵向节奏防回归断言。
+
+不新增依赖，不新建布局模块，不重构组件层级。
+
+## 8. 测试设计
+
+### 8.1 横向对齐测试
+
+现有 `sidebarAlignmentArchitecture.test.js` 对第三列允许 `auto|76px`，应收紧为精确的 `76px`。
+
+至少断言以下契约：
+
+```text
+一级导航左 padding = 19px
+一级导航图标 = justify-start
+树形 grid = 24px / minmax / 76px
+树形列 gap = 7px
+树形外 margin = mx-1.5
+树形左 padding = 13px
+树形右 padding = 8px
+标题内容 = px-0
+工作区内容 = ace-sidebar-tree-content
+右侧容器 = w-full + justify-end
+```
+
+### 8.2 纵向节奏测试
+
+增加断言：
+
+```text
+SidebarSectionHeader 使用 h-6
+SidebarSectionHeader 使用 mt-2
+分组标题 CSS 使用 font-size-12 token
+置顶、无工作区任务和工作区列表使用 mt-0.5
+列表容器使用 gap-0.5
+工作区子任务容器使用 mb-2
+目标区域不再包含 -mt-1
+```
+
+若使用负 margin 全局断言会误伤文件中无关区域，应分别截取以下函数或渲染区间后断言：
+
+- `WorkspaceGroup`；
+- `NoWorkspaceSessionGroup`；
+- `Sidebar` 的工作区 section。
+
+### 8.3 自动化验证
+
+在 `web/` 目录运行：
+
+```bash
+pnpm test
+pnpm build
+```
+
+两项都必须通过。
+
+## 9. 手工视觉验收
+
+### 9.1 数据状态
+
+至少覆盖：
+
+- 没有置顶任务；
+- 有多条置顶任务；
+- 无工作区任务少于 5 条；
+- 无工作区任务超过 5 条并出现“展开显示”；
+- 折叠工作区；
+- 展开且无任务的工作区；
+- 展开且有多条任务的工作区；
+- 多个连续工作区；
+- 会话显示时间；
+- 会话显示“权限请求”；
+- 会话显示“等待回复”；
+- 工作区悬浮显示两个操作按钮。
+
+### 9.2 宽度状态
+
+至少检查：
+
+- 侧栏允许的最窄宽度；
+- 360px 当前宽度；
+- 更宽的用户自定义宽度。
+
+### 9.3 字体状态
+
+至少检查：
+
+- 默认字体大小；
+- 放大一级；
+- 缩小一级。
+
+### 9.4 对齐验收
+
+必须确认：
+
+1. 一级入口文字左边缘不变；
+2. “任务”“工作区”标题左边缘不变；
+3. 工作区名称和会话标题左边缘不变；
+4. “展开显示”与会话标题左边缘一致；
+5. 所有时间文本右边缘一致；
+6. 扩展数量与时间列右边缘一致；
+7. 工作区操作按钮继续贴齐右侧列；
+8. 从时间切换到悬浮操作按钮时，标题不水平移动；
+9. 权限请求或等待回复出现时，标题不水平移动；
+10. 分组标题、工作区行和首个子任务之间不再发生几何重叠。
+
+## 10. 禁止事项
+
+实施 Agent 不得借本次任务执行以下修改：
+
+- 修改侧栏宽度；
+- 移除会话左侧空状态槽；
+- 将时间列改成自动宽度；
+- 隐藏会话时间；
+- 调整图标大小；
+- 调整 TopBar 与侧栏的水平对应关系；
+- 移动工作区操作按钮；
+- 改变折叠按钮显示逻辑；
+- 修改会话拖拽行为；
+- 修改工作区展开/收缩行为；
+- 重写整个 Sidebar；
+- 直接编辑构建产物或导出的 HTML；
+- 覆盖或回退当前工作区已有的未提交修改。
+
+当前相关文件可能已有未提交修改。实施时必须基于文件当前内容做增量修改，不能恢复文件、复制旧版本或重写整个文件。
+
+## 11. 完成标准
+
+同时满足以下条件才算完成：
+
+- 目标区域的负 margin 重叠被移除；
+- 普通列表行之间稳定为 2px；
+- 分组之间稳定为 8px；
+- 分组标题高度为 24px；
+- 分组标题字号为 12px token；
+- 普通行继续为 32px；
+- 现有左侧文字基线没有变化；
+- 现有右侧时间和操作区基线没有变化；
+- 状态和悬浮操作切换时标题不水平跳动；
+- `pnpm test` 通过；
+- `pnpm build` 通过；
+- 默认宽度和窄侧栏下均无文字或操作区溢出；
+- 手工视觉验收确认不存在标题、父行和子行重叠。
+
+## 12. 给实施 Agent 的执行摘要
+
+1. 先阅读本设计和相关文件的当前 diff，不覆盖现有改动。
+2. 保持所有横向 grid、padding、gap 和 76px 右侧列原样。
+3. 仅通过父容器 `gap`、正 margin、标题高度和标题字号调整纵向节奏。
+4. 删除目标区域的 `-mt-1`，禁止用新的负 margin 替代。
+5. 更新对齐测试，先固定横向契约，再增加纵向节奏断言。
+6. 运行 `pnpm test` 和 `pnpm build`。
+7. 按第 9 节完成视觉验收并记录结果。
diff --git a/web/src/components/Sidebar.jsx b/web/src/components/Sidebar.jsx
index 54d7fcf5..5cf62489 100644
--- a/web/src/components/Sidebar.jsx
+++ b/web/src/components/Sidebar.jsx
@@ -613,7 +613,7 @@ function CustomSidebarSection({ workspaceHash = '', onOpenSettingsSection, onOpe
         </span>
       </button>
       {expanded && (
-        <div id={listId} className="ace-sidebar-custom-list">
+        <div id={listId} className="ace-sidebar-custom-list flex flex-col gap-0.5">
           {SIDEBAR_CUSTOM_ITEMS.map((item) => (
             <CustomSidebarItem
               key={item.id}
@@ -636,7 +636,7 @@ function SidebarSectionHeader({ sectionId, count, expanded, onToggle, actions =
   return (
     <div
       data-sidebar-section={sectionId}
-      className="ace-sidebar-section-header ace-sidebar-section-text group flex h-8 items-center gap-0.5 pl-[19px] pr-3 mt-2 mb-0 text-[13px] font-medium text-fg-mute"
+      className="ace-sidebar-section-header ace-sidebar-section-text group flex h-6 items-center gap-0.5 pl-[19px] pr-3 mt-2 mb-0 text-[13px] font-medium text-fg-mute"
     >
       <button
         type="button"
@@ -652,7 +652,7 @@ function SidebarSectionHeader({ sectionId, count, expanded, onToggle, actions =
         >
           <SidebarDisclosure expanded={expanded} />
         </span>
-        <span className={clsx('min-w-0 truncate', (sectionId === SIDEBAR_SECTION_IDS.TASKS || sectionId === SIDEBAR_SECTION_IDS.WORKSPACES) && 'ace-sidebar-section-title text-[11px]')}>
+        <span className={clsx('min-w-0 truncate', (sectionId === SIDEBAR_SECTION_IDS.TASKS || sectionId === SIDEBAR_SECTION_IDS.WORKSPACES) && 'ace-sidebar-section-title text-[12px]')}>
           {title}
         </span>
       </button>
@@ -1644,7 +1644,7 @@ function WorkspaceGroup({
     <div
       data-sidebar-workspace-folder-hash={ws.hash}
       className={clsx(
-        'ace-sidebar-workspace-folder-group my-px',
+        'ace-sidebar-workspace-folder-group',
         ws.active && 'rounded-md',
         folderDragState?.source === ws.hash && 'is-folder-dragging',
       )}
@@ -1669,7 +1669,7 @@ function WorkspaceGroup({
         data-desktop-workspace-opencode-import-count={opencodeImportCount > 0 ? String(opencodeImportCount) : undefined}
         data-folder-reorderable={folderReorderable && !editing ? 'true' : undefined}
         className={clsx(
-          'ace-sidebar-workspace-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid grid-cols-[24px_minmax(0,1fr)_auto] items-center gap-x-[5px] mx-1.5 pl-[12px] pr-2 py-[3px] rounded-md text-[14px] cursor-pointer transition',
+          'ace-sidebar-workspace-row ace-sidebar-tree-row-grid ace-sidebar-primary-text group grid h-8 grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 rounded-md text-[14px] cursor-pointer transition',
           ws.active ? 'bg-accent-bg text-fg' : 'text-fg hover:bg-surface-hi',
         )}
         role="button"
@@ -1732,7 +1732,7 @@ function WorkspaceGroup({
         </span>
       </div>
       {expanded && (
-        <div className="-mt-1 mb-2">
+        <div className="mt-0.5 mb-2 flex flex-col gap-0.5">
           {sessions.length === 0 ? (
             <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 py-[4px] text-[13px] text-fg-mute italic">
               <span aria-hidden="true" />
@@ -1802,7 +1802,7 @@ function NoWorkspaceSessionGroup({
   const projectedSessions = sidebarSessionProjection(sessions, sessionListVisibleLimit);
 
   return (
-    <div className="-mt-1 mb-2">
+    <div className="mt-0.5 flex flex-col gap-0.5">
       {sessions.length === 0 ? (
         <div className="ace-sidebar-tree-row-grid ace-sidebar-meta-text grid grid-cols-[24px_minmax(0,1fr)_76px] items-center gap-x-[7px] mx-1.5 pl-[13px] pr-2 py-[4px] text-[13px] text-fg-mute italic">
           <span aria-hidden="true" />
@@ -1831,7 +1831,7 @@ function NoWorkspaceSessionGroup({
               <button
                 type="button"
                 onClick={() => onToggleSessionList?.(NO_WORKSPACE_SESSION_LIST_KEY, projectedSessions.action)}
-                className="ace-sidebar-meta-text py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg transition-colors"
+                className="ace-sidebar-tree-content ace-sidebar-meta-text px-0 py-[5px] rounded-md text-left text-[13px] text-fg-mute hover:text-fg transition-colors"
               >
                 {projectedSessions.action === 'expand' ? '展开显示' : '折叠显示'}
               </button>
@@ -3668,7 +3668,7 @@ export function Sidebar({
           )}
         </div>
         <div className="ace-sidebar-main flex-1 flex flex-col min-h-0">
-          <div className="ace-sidebar-fixed-nav shrink-0 overflow-y-auto">
+          <div className="ace-sidebar-fixed-nav shrink-0 flex flex-col gap-0.5 overflow-y-auto">
             {SIDEBAR_NAV_ITEMS.map((item) => (
               item.action === 'extensions' ? (
                 <CustomSidebarSection
@@ -3704,7 +3704,7 @@ export function Sidebar({
               onToggle={() => toggleSidebarSection(SIDEBAR_SECTION_IDS.PINNED)}
             />
             {sidebarSectionIsVisible(sectionCounts.pinned) && sectionExpansion.pinned && (
-              <div className="my-1">
+              <div className="mt-0.5 flex flex-col gap-0.5">
                 {pinnedSessions.map((s) => {
                   const pinScope = sessionPinScope(s);
                   const rowKey = sidebarSessionDragKey(pinScope, s.id);
@@ -3765,7 +3765,7 @@ export function Sidebar({
             />
             {sidebarSectionIsVisible(sectionCounts.workspaces) && sectionExpansion.workspaces && (
               <div
-                className="my-1"
+                className="mt-0.5 flex flex-col gap-0.5"
                 ref={folderReorder.listRef}
                 data-sidebar-workspace-folder-list
                 aria-busy={workspaceOrderSaving}
diff --git a/web/src/lib/sidebarAlignmentArchitecture.test.js b/web/src/lib/sidebarAlignmentArchitecture.test.js
index c3210366..2ed0b752 100644
--- a/web/src/lib/sidebarAlignmentArchitecture.test.js
+++ b/web/src/lib/sidebarAlignmentArchitecture.test.js
@@ -11,17 +11,26 @@ assert.match(sidebar, /SidebarNavItem[\s\S]*?pl-\[19px\]/);
 assert.match(sidebar, /CustomSidebarItem[\s\S]*?pl-\[19px\]/);
 assert.match(sidebar, /SidebarNavItem[\s\S]*?items-center justify-start shrink-0/);
 assert.match(sidebar, /CustomSidebarItem[\s\S]*?items-center justify-start shrink-0/);
-assert.match(sidebar, /grid-cols-\[24px_minmax\(0,1fr\)_(?:auto|76px)\][\s\S]*?gap-x-\[7px\] mx-1\.5 pl-\[13px\] pr-2/);
+assert.match(sidebar, /grid-cols-\[24px_minmax\(0,1fr\)_76px\][\s\S]*?gap-x-\[7px\] mx-1\.5 pl-\[13px\] pr-2/);
 assert.match(sidebar, /ace-sidebar-session-title-button ace-sidebar-tree-content[^\n]*px-0/);
 assert.match(sidebar, /ace-sidebar-tree-content min-w-0 truncate/);
 assert.match(sidebar, /ace-sidebar-tree-content ace-sidebar-meta-text px-0 py-\[5px\]/);
 assert.doesNotMatch(topbar, /className="ml-\[8px\]"/);
-assert.match(sidebar, /SidebarSectionHeader[\s\S]*?group flex h-8 items-center/);
+assert.match(sidebar, /SidebarSectionHeader[\s\S]*?group flex h-6 items-center/);
 assert.match(sidebar, /group\/section-header flex min-w-0 flex-1 items-center/);
 assert.match(sidebar, /data-sidebar-section-disclosure=\{sectionId\}[\s\S]*?opacity-0/);
 const sectionHeader = sidebar.match(/function SidebarSectionHeader[\s\S]*?\r?\n}\r?\n/)[0];
 assert.doesNotMatch(sectionHeader, /group-focus-within:opacity-100/);
 assert.doesNotMatch(sectionHeader, /data-sidebar-section-disclosure=\{sectionId\}[\s\S]*?hover:bg-surface-hi/);
 assert.doesNotMatch(sidebar, /\[aria-expanded="true"\].*ace-sidebar-extensions-arrow/);
+assert.match(sidebar, /SidebarSectionHeader[\s\S]*?group flex h-6 items-center/);
+assert.match(sidebar, /SidebarSectionHeader[\s\S]*?mt-2/);
+assert.match(sidebar, /ace-sidebar-section-title text-\[12px\]/);
+assert.match(sidebar, /ace-sidebar-fixed-nav shrink-0 flex flex-col gap-0\.5/);
+assert.match(sidebar, /ace-sidebar-custom-list flex flex-col gap-0\.5/);
+assert.match(sidebar, /mt-0\.5 mb-2 flex flex-col gap-0\.5/);
+assert.match(sidebar, /mt-0\.5 flex flex-col gap-0\.5/);
+assert.doesNotMatch(sidebar, /-mt-1/);
+assert.match(sidebar, /ace-sidebar-workspace-row[\s\S]*?grid h-8 grid-cols-\[24px_minmax\(0,1fr\)_76px\][\s\S]*?gap-x-\[7px\] mx-1\.5 pl-\[13px\] pr-2/);
 
-console.log('[pass] sidebar alignment keeps icon and content columns on shared left baselines');
+console.log('[pass] sidebar alignment and vertical rhythm preserve shared baselines');
diff --git a/web/src/styles/globals.css b/web/src/styles/globals.css
index 7a1c3698..a0e6194b 100644
--- a/web/src/styles/globals.css
+++ b/web/src/styles/globals.css
@@ -6438,7 +6438,7 @@ div.ace-markdown-opaque > div.ace-markdown-opaque-rendered {
   font-size: var(--ace-font-size-13) !important;
 }
 .ace-sidebar .ace-sidebar-section-title {
-  font-size: var(--ace-font-size-11) !important;
+  font-size: var(--ace-font-size-12) !important;
 }
 .ace-sidebar .ace-sidebar-meta-text {
   font-size: var(--ace-font-size-12) !important;

From 9d154a372c0bc35841cb6353ffcea1cafc48a8b9 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sun, 20 Sep 2026 19:30:39 +0800
Subject: [PATCH 5/6] Add token-free sidebar spacing preview

---
 web/public/sidebar-spacing-preview.html | 126 ++++++++++++++++++++++++
 1 file changed, 126 insertions(+)
 create mode 100644 web/public/sidebar-spacing-preview.html

diff --git a/web/public/sidebar-spacing-preview.html b/web/public/sidebar-spacing-preview.html
new file mode 100644
index 00000000..c50791c8
--- /dev/null
+++ b/web/public/sidebar-spacing-preview.html
@@ -0,0 +1,126 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>ACECode Sidebar Spacing Preview</title>
+  <style>
+    :root {
+      color-scheme: dark;
+      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+      --bg: #171717;
+      --panel: #202020;
+      --panel-hover: #2b2b2b;
+      --active: #343434;
+      --border: #373737;
+      --text: #e8e8e8;
+      --muted: #999;
+      --faint: #707070;
+      --accent: #d7a85c;
+    }
+    * { box-sizing: border-box; }
+    body { margin: 0; min-height: 100vh; background: #101010; color: var(--text); }
+    .preview { min-height: 100vh; display: flex; flex-direction: column; }
+    .toolbar { min-height: 58px; display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--border); background: #191919; }
+    .toolbar strong { font-size: 14px; letter-spacing: .02em; }
+    .toolbar span { color: var(--muted); font-size: 12px; }
+    .toolbar button { margin-left: auto; border: 1px solid #555; border-radius: 6px; padding: 7px 11px; color: var(--text); background: #292929; cursor: pointer; }
+    .toolbar button:hover { background: #3a3a3a; }
+    .workspace { flex: 1; display: flex; min-height: 0; }
+    .sidebar { width: 330px; min-height: calc(100vh - 58px); overflow: auto; background: var(--panel); border-right: 1px solid var(--border); padding-bottom: 18px; }
+    .main { flex: 1; padding: 42px; color: var(--muted); }
+    .brand { display: flex; align-items: center; gap: 11px; padding: 12px 18px; height: 62px; border-bottom: 1px solid #2b2b2b; }
+    .brand-mark { width: 24px; height: 24px; border: 2px solid var(--accent); border-radius: 7px; transform: rotate(45deg); }
+    .brand-name { color: var(--text); font-weight: 650; font-size: 15px; }
+    .brand-version { display: block; margin-top: 2px; color: var(--faint); font-size: 10px; }
+    .fixed-nav { display: flex; flex-direction: column; gap: 2px; padding: 10px 0 2px; }
+    .nav-row, .tree-row { height: 32px; display: grid; align-items: center; }
+    .nav-row { grid-template-columns: 24px minmax(0, 1fr); gap: 7px; padding: 0 12px 0 19px; color: var(--text); font-size: 13px; }
+    .nav-row:hover, .tree-row:hover { background: var(--panel-hover); }
+    .icon { color: var(--muted); text-align: center; font-size: 13px; }
+    .section-header { height: 24px; display: flex; align-items: center; gap: 2px; padding: 0 12px 0 19px; margin-top: 8px; color: var(--muted); font-size: 12px; font-weight: 600; }
+    .section-header .chevron { width: 24px; margin-right: 0; color: var(--faint); }
+    .section-list { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; }
+    .tree-row { grid-template-columns: 24px minmax(0, 1fr) 76px; column-gap: 7px; margin: 0 6px; padding: 0 8px 0 13px; border-radius: 6px; font-size: 13px; }
+    .tree-row .title { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
+    .tree-row .meta { min-width: 0; display: flex; justify-content: flex-end; gap: 7px; color: var(--muted); font-size: 11px; }
+    .tree-row.active { background: var(--active); }
+    .subtree { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; margin-bottom: 8px; }
+    .workspace-row .icon { color: #a9c58b; }
+    .session-row .icon { color: #8c8c8c; }
+    .empty { color: var(--faint); font-style: italic; }
+    .show-more { color: #b9b9b9; cursor: pointer; }
+    .show-more:hover { color: white; }
+    .hint { max-width: 630px; line-height: 1.7; }
+    .hint h1 { margin: 0 0 12px; color: var(--text); font-size: 22px; }
+    .hint code { padding: 2px 5px; border-radius: 4px; background: #282828; color: #e0bd7e; }
+    .measure { position: fixed; right: 22px; bottom: 18px; padding: 8px 11px; border: 1px solid var(--border); border-radius: 6px; background: #222; color: var(--muted); font-size: 11px; }
+    @media (max-width: 700px) { .main { display: none; } .sidebar { width: 100%; } .toolbar span { display: none; } }
+  </style>
+</head>
+<body>
+  <div class="preview">
+    <header class="toolbar">
+      <strong>ACECode 侧边栏间距预览</strong>
+      <span>独立预览，不需要访问令牌，不连接 daemon</span>
+      <button id="toggle">折叠工作区</button>
+    </header>
+    <div class="workspace">
+      <aside class="sidebar">
+        <div class="brand"><div class="brand-mark"></div><div><div class="brand-name">ACECode</div><span class="brand-version">Frontend preview</span></div></div>
+        <div class="fixed-nav">
+          <div class="nav-row"><span class="icon">＋</span><span>新建任务</span></div>
+          <div class="nav-row"><span class="icon">◷</span><span>定时任务</span></div>
+          <div class="nav-row"><span class="icon">◇</span><span>扩展</span></div>
+        </div>
+
+        <div class="section-header"><span class="chevron">⌄</span><span>任务 <small>(3)</small></span></div>
+        <div class="section-list">
+          <div class="tree-row active"><span class="icon">●</span><span class="title">调整侧边栏间距</span><span class="meta">刚刚</span></div>
+          <div class="tree-row"><span class="icon">○</span><span class="title">分析 AceCode 与 Trae 页面间距差异</span><span class="meta">2 分钟</span></div>
+          <div class="tree-row"><span class="icon">○</span><span class="title">验证窄窗口下的布局效果</span><span class="meta">昨天</span></div>
+        </div>
+
+        <div class="section-header"><span class="chevron">⌄</span><span>工作区 <small>(3)</small></span></div>
+        <div class="section-list" id="workspace-list">
+          <div class="workspace-group">
+            <div class="tree-row workspace-row"><span class="icon">▾</span><span class="title">acecode</span><span class="meta">⋮ ＋</span></div>
+            <div class="subtree">
+              <div class="tree-row session-row"><span class="icon">○</span><span class="title">侧边栏视觉节奏</span><span class="meta">10:42</span></div>
+              <div class="tree-row session-row"><span class="icon">○</span><span class="title">开发环境启动</span><span class="meta">09:18</span></div>
+              <div class="tree-row session-row"><span class="icon">○</span><span class="title">展开显示</span><span class="meta"></span></div>
+            </div>
+          </div>
+          <div class="workspace-group"><div class="tree-row workspace-row"><span class="icon">▸</span><span class="title">tui-studio-i18n</span><span class="meta">⋮</span></div></div>
+          <div class="workspace-group"><div class="tree-row workspace-row"><span class="icon">▸</span><span class="title">万能服务</span><span class="meta">⋮</span></div></div>
+        </div>
+
+        <div class="section-header"><span class="chevron">⌄</span><span>会话 <small>(2)</small></span></div>
+        <div class="section-list">
+          <div class="tree-row"><span class="icon">○</span><span class="title">无工作区会话示例</span><span class="meta">11:06</span></div>
+          <div class="tree-row"><span class="icon">○</span><span class="title">权限请求状态示例</span><span class="meta">等待</span></div>
+        </div>
+      </aside>
+      <main class="main">
+        <div class="hint">
+          <h1>间距验证预览</h1>
+          <p>左侧使用本次方案的纵向节奏：普通行 <code>32px</code>、组内间距 <code>2px</code>、分组标题 <code>24px</code>、分组间距 <code>8px</code>。</p>
+          <p>横向树形行保持 <code>24px / minmax(0,1fr) / 76px</code>，列间距 <code>7px</code>。点击顶部按钮可以切换工作区内容，观察展开和折叠状态。</p>
+        </div>
+      </main>
+    </div>
+    <div class="measure">PROTOTYPE · no token required</div>
+  </div>
+  <script>
+    const button = document.querySelector('#toggle');
+    const list = document.querySelector('#workspace-list');
+    let expanded = true;
+    button.addEventListener('click', () => {
+      expanded = !expanded;
+      list.querySelector('.subtree').style.display = expanded ? 'flex' : 'none';
+      list.querySelector('.workspace-row .icon').textContent = expanded ? '▾' : '▸';
+      button.textContent = expanded ? '折叠工作区' : '展开工作区';
+    });
+  </script>
+</body>
+</html>

From dfc74a9e9468fef4241293861facc3a95eaf6a70 Mon Sep 17 00:00:00 2001
From: Trae User <trae@example.com>
Date: Sun, 20 Sep 2026 19:58:36 +0800
Subject: [PATCH 6/6] Fix workspace heading architecture assertion

---
 web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js b/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
index 11d247f3..c0d9b4d0 100644
--- a/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
+++ b/web/src/lib/sidebarWorkspaceHeadingArchitecture.test.js
@@ -91,15 +91,15 @@ test('reopening a collapsed workspace always restores the compact five-row sessi
   assert.match(sidebar, /loadWorkspaceSessions\(hash, \{\s*full: true,/);
 });
 
-test('workspace folder clicks only disclose and headings have no selected styling', () => {
+test('workspace folder clicks disclose active workspaces or activate inactive ones', () => {
   const sidebar = source('components/Sidebar.jsx');
   const rowStart = sidebar.indexOf('data-desktop-open-in-explorer-kind="workspace"');
   const rowEnd = sidebar.indexOf('data-sidebar-workspace-actions="true"', rowStart);
   assert.ok(rowStart >= 0 && rowEnd > rowStart);
   const row = sidebar.slice(rowStart, rowEnd);
-  assert.match(row, /onClick=\{\(\) => onToggle\(ws\.hash\)\}/);
+  assert.match(row, /onClick=\{\(\) => \(ws\.active \? onToggle\(ws\.hash\) : onActivate\(ws\)\)\}/);
   assert.match(row, /aria-expanded=\{expanded\}/);
-  assert.doesNotMatch(row, /onActivate\(|onNewSession\(|bg-accent-bg|aria-selected|aria-current/);
+  assert.doesNotMatch(row, /aria-selected|aria-current/);
   assert.match(sidebar, /onClick=\{\(e\) => \{ e\.stopPropagation\(\); onNewSession\(ws\); \}\}/);
 });