feat(ui): 工作台精修 + 拆分（P3-3..7）

- Workbench.tsx 937→467 行，抽出 AiToolbar/WorkbenchToolbar/MobileContextBar
- P3-3 AI 工具条分组留白 + 眉题 + 主 CTA 凸显
- P3-4 专注写作模式（useFocusMode hook+vitest，隐藏侧栏加宽正文）+ 左双栏面色区分
- P3-5 右栏本章参考小标题去衬线(font-sans) + 空态引导(无标题保 h2→h3 大纲)
- P3-6 底栏信息/操作/状态三区 + TOC 当前章高亮；TOC 状态点因无每章状态数据跳过
- P3-7 展示层流式跟随滚动（不触碰 SSE 逻辑，尊重 reduced-motion）
- AppShell 加可选 hideNav（加法式，默认 false）

apps/web/components/workbench/ChapterList.tsx

@@ -29,7 +29,7 @@ export function ChapterList({
   if (collapsed) {
     return (
       <aside
-        className="hidden shrink-0 border-r border-line bg-panel py-4 xl:block"
+        className="hidden shrink-0 border-r border-line bg-surface-soft py-4 xl:block"
         aria-label="目录（已收起）"
       >
         <button
@@ -38,7 +38,7 @@ export function ChapterList({
           aria-expanded={false}
           aria-label="展开目录"
           title="展开目录"
-          className={`mx-auto flex h-8 w-8 items-center justify-center rounded text-ink-soft transition-colors hover:bg-[var(--color-cinnabar-wash)] hover:text-cinnabar ${focusRing}`}
+          className={`mx-auto flex h-8 w-8 items-center justify-center rounded-md border border-line bg-panel text-ink-soft transition-colors duration-fast ease-standard hover:border-cinnabar hover:bg-[var(--color-cinnabar-wash)] hover:text-cinnabar ${focusRing}`}
         >
           <PanelLeftOpen className="h-4 w-4" aria-hidden="true" />
         </button>
@@ -46,7 +46,7 @@ export function ChapterList({
     );
   }
   return (
-    <aside className="hidden border-r border-line bg-panel py-4 xl:block">
+    <aside className="hidden border-r border-line bg-surface-soft py-4 xl:block">
       <ChapterListContent
         projectId={projectId}
         chapters={chapters}
@@ -73,7 +73,7 @@ export function ChapterListContent({
   return (
     <>
       <div className="flex items-center justify-between px-4">
-        <h2 className="text-xs font-semibold uppercase tracking-wide text-ink-soft">
+        <h2 className="font-sans text-eyebrow uppercase tracking-wide text-muted-soft">
           目录
         </h2>
         {onCollapse ? (
@@ -82,7 +82,7 @@ export function ChapterListContent({
             onClick={onCollapse}
             aria-label="收起目录"
             title="收起目录"
-            className={`flex h-6 w-6 items-center justify-center rounded text-ink-soft transition-colors hover:bg-[var(--color-cinnabar-wash)] hover:text-cinnabar ${focusRing}`}
+            className={`flex h-7 w-7 items-center justify-center rounded-md border border-line bg-panel text-ink-soft transition-colors duration-fast ease-standard hover:border-cinnabar hover:bg-[var(--color-cinnabar-wash)] hover:text-cinnabar ${focusRing}`}
           >
             <PanelLeftClose className="h-4 w-4" aria-hidden="true" />
           </button>
@@ -98,8 +98,8 @@ export function ChapterListContent({
                 aria-current={active ? "page" : undefined}
                 className={
                   active
-                    ? "flex flex-col gap-0.5 border-l-2 border-cinnabar bg-[var(--color-cinnabar-wash)] px-4 py-2 text-sm text-cinnabar"
-                    : "flex flex-col gap-0.5 border-l-2 border-transparent px-4 py-2 text-sm text-ink hover:border-cinnabar hover:text-cinnabar"
+                    ? `flex flex-col gap-0.5 border-l-2 border-cinnabar bg-[var(--color-cinnabar-wash)] px-4 py-2 text-sm font-medium text-cinnabar transition-colors duration-fast ease-standard ${focusRing}`
+                    : `flex flex-col gap-0.5 border-l-2 border-transparent px-4 py-2 text-sm text-ink transition-colors duration-fast ease-standard hover:border-line-soft hover:bg-panel/60 hover:text-cinnabar ${focusRing}`
                 }
               >
                 <span className="flex items-center gap-2">