feat: M3 — 伏笔账本 + 节奏引擎 + 大纲（含并发记账 bugfix）

- 伏笔账本：纯函数状态机(OPEN/PARTIAL/CLOSED/OVERDUE) + ForeshadowLedger repo；验收后到期扫描(BackgroundTask 自建 session 置 OVERDUE)；登记/状态变更端点
- 节奏 + 三审齐：foreshadow-analyst + pace-checker 并入 LangGraph 并行审(REVIEW_SPECS)，collect 分列落 chapter_reviews(conflicts/foreshadow_sug/pace)，review SSE 加 foreshadow/pace 事件
- 大纲：outliner Agent 产 OutlineResult(含 foreshadow_windows)，POST /outline 逐章 upsert outline 表；GET /foreshadow?status= 看板
- 前端：伏笔四泳道看板(OVERDUE 琥珀) + 大纲编辑器(窗口徽标) + 节奏节拍图(▁▃▅) + 审稿页消费 foreshadow/pace SSE
- bugfix(T3.8)：并行三审共用请求 session 记账触发 'Session is already flushing' → foreshadow/pace 静默丢失；SqlAlchemyLedgerSink.record 改 add-only(靠端点/事务 commit)，加并发回归测试
- M3 E2E：真实 DB + mock 网关零 token 走通 埋设→进展→验收后扫描 OVERDUE→看板 + 大纲含窗口 + 三审齐 SSE/留痕；E2E 暴露并钉住上述 bug
- 门禁绿：mypy 111 / pytest 228(0 xfailed) / alembic 无漂移；前端 gen:api/lint/tsc/vitest 69/build

apps/web/components/AppShell.tsx

@@ -8,10 +8,20 @@ interface AppShellProps {
   // 顶栏右侧的上下文信息（如作品名 / 进度）。
   title?: string;
   subtitle?: string;
+  // 项目内页给出 projectId → 左导航展开项目级入口（大纲/伏笔/审稿，UX §3.1）。
+  projectId?: string;
+  // 当前激活的项目级入口键（用于高亮）。
+  activeNav?: "write" | "outline" | "foreshadow" | "review";
 }
 
 // 全局外壳：顶栏(64px) + 左导航 + 主区（UX §5.1）。
-export function AppShell({ children, title, subtitle }: AppShellProps) {
+export function AppShell({
+  children,
+  title,
+  subtitle,
+  projectId,
+  activeNav,
+}: AppShellProps) {
   return (
     <div className="min-h-screen">
       <header className="flex h-16 items-center gap-4 border-b border-line bg-panel px-6">
@@ -38,7 +48,7 @@ export function AppShell({ children, title, subtitle }: AppShellProps) {
         </nav>
       </header>
       <div className="flex">
-        <LeftNav />
+        <LeftNav projectId={projectId} activeNav={activeNav} />
         <main className="min-h-[calc(100vh-4rem)] flex-1 bg-bg">{children}</main>
       </div>
     </div>

apps/web/components/LeftNav.tsx

@@ -3,64 +3,126 @@
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
+export type ActiveNav = "write" | "outline" | "foreshadow" | "review";
+
+interface LeftNavProps {
+  // 项目内页传 projectId → 展开项目级入口（大纲/伏笔/审稿，UX §3.1）。
+  projectId?: string;
+  activeNav?: ActiveNav;
+}
+
 interface NavItem {
   href: string;
   label: string;
-  // M1 仅作品库 + 设置可达；其余为后续里程碑占位（禁用）。
   enabled: boolean;
+  // 项目级入口的激活键（与 activeNav 比对高亮）。
+  key?: ActiveNav;
 }
 
-const NAV_ITEMS: NavItem[] = [
+const GLOBAL_ITEMS: NavItem[] = [
   { href: "/", label: "作品库", enabled: true },
   { href: "/settings/providers", label: "设置", enabled: true },
-  { href: "#outline", label: "大纲", enabled: false },
-  { href: "#codex", label: "设定库", enabled: false },
-  { href: "#foreshadow", label: "伏笔", enabled: false },
-  { href: "#review", label: "审稿", enabled: false },
-  { href: "#style", label: "文风", enabled: false },
 ];
 
-// 左导航：当前项朱砂竖条 + 浅晕底（UX §5.1）。
-export function LeftNav() {
+function projectItems(projectId: string): NavItem[] {
+  return [
+    {
+      href: `/projects/${projectId}/write`,
+      label: "写作",
+      enabled: true,
+      key: "write",
+    },
+    {
+      href: `/projects/${projectId}/outline`,
+      label: "大纲",
+      enabled: true,
+      key: "outline",
+    },
+    {
+      href: `/projects/${projectId}/foreshadow`,
+      label: "伏笔",
+      enabled: true,
+      key: "foreshadow",
+    },
+    {
+      href: `/projects/${projectId}/review`,
+      label: "审稿",
+      enabled: true,
+      key: "review",
+    },
+    { href: "#codex", label: "设定库", enabled: false },
+    { href: "#style", label: "文风", enabled: false },
+  ];
+}
+
+// 左导航：当前项朱砂竖条 + 浅晕底（UX §5.1 / §3.1）。
+export function LeftNav({ projectId, activeNav }: LeftNavProps) {
   const pathname = usePathname();
+  const scoped = projectId ? projectItems(projectId) : [];
+
   return (
     <nav
       className="w-44 shrink-0 border-r border-line bg-panel py-4"
       aria-label="主导航"
     >
       <ul className="flex flex-col gap-1 px-2">
-        {NAV_ITEMS.map((item) => {
-          const active = item.enabled && pathname === item.href;
-          if (!item.enabled) {
-            return (
-              <li key={item.label}>
-                <span
-                  className="block cursor-not-allowed rounded px-3 py-2 text-sm text-ink-soft/50"
-                  aria-disabled="true"
-                  title="后续里程碑开放"
-                >
-                  {item.label}
-                </span>
-              </li>
-            );
-          }
-          return (
-            <li key={item.label}>
-              <Link
-                href={item.href}
-                aria-current={active ? "page" : undefined}
-                className={`flex items-center gap-2 rounded px-3 py-2 text-sm ${
-                  active
-                    ? "border-l-2 border-cinnabar bg-[var(--color-cinnabar-wash)] text-cinnabar"
-                    : "text-ink hover:bg-[var(--color-cinnabar-wash)]"
-                }`}
-              >
-                {item.label}
-              </Link>
-            </li>
-          );
-        })}
+        {GLOBAL_ITEMS.map((item) => (
+          <NavLink
+            key={item.label}
+            item={item}
+            active={item.enabled && pathname === item.href}
+          />
+        ))}
+        {scoped.length > 0 ? (
+          <li
+            className="mt-3 px-3 pb-1 text-xs font-semibold uppercase tracking-wide text-ink-soft/60"
+            aria-hidden="true"
+          >
+            本作
+          </li>
+        ) : null}
+        {scoped.map((item) => (
+          <NavLink
+            key={item.label}
+            item={item}
+            active={
+              item.key !== undefined &&
+              (item.key === activeNav || pathname === item.href)
+            }
+          />
+        ))}
       </ul>
     </nav>
   );
 }
+
+function NavLink({ item, active }: { item: NavItem; active: boolean }) {
+  if (!item.enabled) {
+    return (
+      <li>
+        <span
+          className="block cursor-not-allowed rounded px-3 py-2 text-sm text-ink-soft/50"
+          aria-disabled="true"
+          title="后续里程碑开放"
+        >
+          {item.label}
+        </span>
+      </li>
+    );
+  }
+  return (
+    <li>
+      <Link
+        href={item.href}
+        aria-current={active ? "page" : undefined}
+        className={`flex items-center gap-2 rounded px-3 py-2 text-sm ${
+          active
+            ? "border-l-2 border-cinnabar bg-[var(--color-cinnabar-wash)] text-cinnabar"
+            : "text-ink hover:bg-[var(--color-cinnabar-wash)]"
+        }`}
+      >
+        {item.label}
+      </Link>
+    </li>
+  );
+}

apps/web/components/foreshadow/ForeshadowBoard.tsx

@@ -0,0 +1,72 @@
+"use client";
+
+import { useMemo } from "react";
+
+import { AppShell } from "@/components/AppShell";
+import type { ForeshadowView, ProjectResponse } from "@/lib/api/types";
+import {
+  LANES,
+  groupByStatus,
+  type ForeshadowStatus,
+} from "@/lib/foreshadow/board";
+import { useForeshadow } from "@/lib/foreshadow/useForeshadow";
+import { KanbanColumn } from "./KanbanColumn";
+import { RegisterForm } from "./RegisterForm";
+
+interface ForeshadowBoardProps {
+  project: ProjectResponse;
+  initialItems: ForeshadowView[];
+}
+
+// 伏笔看板主体（UX §6.8）：四泳道 + 登记/状态变更交互。
+// RSC 取全量种入；Client 承载登记/转移（乐观 + 回滚 + Toast）。
+export function ForeshadowBoard({
+  project,
+  initialItems,
+}: ForeshadowBoardProps) {
+  const { items, busy, register, transition } = useForeshadow(initialItems);
+  const lanes = useMemo(() => groupByStatus(items), [items]);
+
+  const onTransition = (
+    code: string,
+    toStatus: ForeshadowStatus | null,
+    progressNote: string,
+  ): void => {
+    void transition(code, {
+      projectId: project.id,
+      toStatus,
+      progressEntry: progressNote ? { note: progressNote } : null,
+    });
+  };
+
+  return (
+    <AppShell
+      title={`〈${project.title}〉`}
+      subtitle="伏笔看板"
+      projectId={project.id}
+      activeNav="foreshadow"
+    >
+      <div className="flex h-[calc(100vh-4rem)] flex-col p-4">
+        <div className="mb-4 flex items-start justify-between gap-4">
+          <h1 className="font-serif text-lg text-ink">伏笔看板</h1>
+          <RegisterForm
+            projectId={project.id}
+            busy={busy}
+            onRegister={register}
+          />
+        </div>
+        <div className="grid min-h-0 flex-1 grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-4">
+          {LANES.map((status) => (
+            <KanbanColumn
+              key={status}
+              status={status}
+              items={lanes[status]}
+              busy={busy}
+              onTransition={onTransition}
+            />
+          ))}
+        </div>
+      </div>
+    </AppShell>
+  );
+}

apps/web/components/foreshadow/ForeshadowCard.tsx

@@ -0,0 +1,133 @@
+"use client";
+
+import { useState } from "react";
+
+import type { ForeshadowView } from "@/lib/api/types";
+import type { ForeshadowStatus } from "@/lib/foreshadow/board";
+
+interface ForeshadowCardProps {
+  item: ForeshadowView;
+  overdue: boolean;
+  busy: boolean;
+  onTransition: (
+    code: string,
+    toStatus: ForeshadowStatus | null,
+    progressNote: string,
+  ) => void;
+}
+
+const NEXT_STATUS: Record<string, ForeshadowStatus[]> = {
+  OPEN: ["PARTIAL", "CLOSED"],
+  PARTIAL: ["CLOSED"],
+  OVERDUE: ["PARTIAL", "CLOSED"],
+  CLOSED: [],
+};
+
+// 伏笔卡（UX §6.8）：code/title/回收窗口/importance/progress 时间线 + 状态变更/加进展。
+// OVERDUE 用琥珀强调（不单靠色：加 ⚠ 图标 + 文案，a11y §10）。
+export function ForeshadowCard({
+  item,
+  overdue,
+  busy,
+  onTransition,
+}: ForeshadowCardProps) {
+  const [note, setNote] = useState("");
+  const transitions = NEXT_STATUS[item.status] ?? [];
+  const windowText = recoveryWindow(item);
+
+  return (
+    <li
+      className={`rounded border bg-panel p-3 ${
+        overdue ? "border-overdue ring-1 ring-overdue/40" : "border-line"
+      }`}
+    >
+      <div className="flex items-baseline gap-2">
+        <span className="font-mono text-xs text-cinnabar">{item.code}</span>
+        {overdue ? (
+          <span className="text-xs text-overdue" aria-label="逾期">
+            ⚠ 逾期
+          </span>
+        ) : null}
+      </div>
+      <p className="mt-0.5 font-serif text-sm text-ink">{item.title}</p>
+
+      <dl className="mt-2 space-y-0.5 text-xs text-ink-soft">
+        {typeof item.planted_at === "number" ? (
+          <div>埋于 {item.planted_at} 章</div>
+        ) : null}
+        {windowText ? <div>窗口 {windowText}</div> : null}
+        {item.importance ? <div>{item.importance}</div> : null}
+      </dl>
+
+      {item.progress && item.progress.length > 0 ? (
+        <ul className="mt-2 border-l-2 border-line pl-2 text-xs text-ink-soft">
+          {item.progress.map((p, i) => (
+            <li key={i}>· {progressLabel(p)}</li>
+          ))}
+        </ul>
+      ) : null}
+
+      {transitions.length > 0 || item.status !== "CLOSED" ? (
+        <div className="mt-3 space-y-2">
+          {transitions.length > 0 ? (
+            <div className="flex flex-wrap gap-1.5">
+              {transitions.map((to) => (
+                <button
+                  key={to}
+                  type="button"
+                  disabled={busy}
+                  onClick={() => onTransition(item.code, to, "")}
+                  className="rounded border border-line px-2 py-0.5 text-xs text-ink hover:border-cinnabar hover:text-cinnabar disabled:opacity-40"
+                >
+                  → {to === "CLOSED" ? "回收" : to}
+                </button>
+              ))}
+            </div>
+          ) : null}
+          {item.status !== "CLOSED" ? (
+            <div className="flex gap-1.5">
+              <label htmlFor={`prog-${item.code}`} className="sr-only">
+                {item.code} 进展
+              </label>
+              <input
+                id={`prog-${item.code}`}
+                type="text"
+                value={note}
+                onChange={(e) => setNote(e.target.value)}
+                placeholder="加进展（如：23章发光）"
+                className="min-w-0 flex-1 rounded border border-line bg-bg px-2 py-0.5 text-xs text-ink focus:border-cinnabar focus:outline-none"
+              />
+              <button
+                type="button"
+                disabled={busy || note.trim().length === 0}
+                onClick={() => {
+                  onTransition(item.code, null, note.trim());
+                  setNote("");
+                }}
+                className="rounded border border-line px-2 py-0.5 text-xs text-ink hover:border-cinnabar disabled:opacity-40"
+              >
+                记
+              </button>
+            </div>
+          ) : null}
+        </div>
+      ) : null}
+    </li>
+  );
+}
+
+function recoveryWindow(item: ForeshadowView): string | null {
+  const from = item.expected_close_from;
+  const to = item.expected_close_to;
+  if (typeof from === "number" && typeof to === "number") return `${from}-${to}`;
+  if (typeof to === "number") return `≤${to}`;
+  if (typeof from === "number") return `≥${from}`;
+  return null;
+}
+
+function progressLabel(entry: Record<string, unknown>): string {
+  const chapter = entry["chapter"];
+  const note = entry["note"];
+  const noteStr = typeof note === "string" ? note : JSON.stringify(entry);
+  return typeof chapter === "number" ? `${chapter}章：${noteStr}` : noteStr;
+}

apps/web/components/foreshadow/KanbanColumn.tsx

@@ -0,0 +1,61 @@
+"use client";
+
+import type { ForeshadowView } from "@/lib/api/types";
+import type { ForeshadowStatus } from "@/lib/foreshadow/board";
+import { ForeshadowCard } from "./ForeshadowCard";
+
+interface KanbanColumnProps {
+  status: ForeshadowStatus;
+  items: ForeshadowView[];
+  busy: boolean;
+  onTransition: (
+    code: string,
+    toStatus: ForeshadowStatus | null,
+    progressNote: string,
+  ) => void;
+}
+
+// 单个状态泳道（UX §6.8）。OVERDUE 列整列琥珀强调（表头 + 卡片）。
+export function KanbanColumn({
+  status,
+  items,
+  busy,
+  onTransition,
+}: KanbanColumnProps) {
+  const overdue = status === "OVERDUE";
+  return (
+    <section
+      className="flex min-w-0 flex-col rounded border border-line bg-bg"
+      aria-label={`${status} 泳道`}
+    >
+      <header
+        className={`flex items-center justify-between rounded-t border-b px-3 py-2 ${
+          overdue
+            ? "border-overdue bg-overdue/10 text-overdue"
+            : "border-line bg-panel text-ink-soft"
+        }`}
+      >
+        <span className="font-mono text-xs font-semibold">
+          {overdue ? "⚠ " : ""}
+          {status}
+        </span>
+        <span className="font-mono text-xs">{items.length}</span>
+      </header>
+      <ul className="flex-1 space-y-2 overflow-auto p-2">
+        {items.length === 0 ? (
+          <li className="px-1 py-3 text-xs text-ink-soft/60">—</li>
+        ) : (
+          items.map((item) => (
+            <ForeshadowCard
+              key={item.code}
+              item={item}
+              overdue={overdue}
+              busy={busy}
+              onTransition={onTransition}
+            />
+          ))
+        )}
+      </ul>
+    </section>
+  );
+}

apps/web/components/foreshadow/RegisterForm.tsx

@@ -0,0 +1,185 @@
+"use client";
+
+import { useState } from "react";
+
+import type { RegisterInput } from "@/lib/foreshadow/board";
+
+interface RegisterFormProps {
+  projectId: string;
+  busy: boolean;
+  onRegister: (input: RegisterInput) => Promise<boolean>;
+}
+
+const EMPTY = {
+  code: "",
+  title: "",
+  plantedAt: "",
+  content: "",
+  expectedCloseFrom: "",
+  expectedCloseTo: "",
+  importance: "",
+};
+
+// 登记新伏笔（UX §6.8）。受控表单 → 组装 RegisterInput；成功后清空。
+export function RegisterForm({
+  projectId,
+  busy,
+  onRegister,
+}: RegisterFormProps) {
+  const [open, setOpen] = useState(false);
+  const [form, setForm] = useState({ ...EMPTY });
+
+  const set = (key: keyof typeof EMPTY, value: string): void =>
+    setForm((prev) => ({ ...prev, [key]: value }));
+
+  const submit = async (): Promise<void> => {
+    const ok = await onRegister({
+      projectId,
+      code: form.code,
+      title: form.title,
+      plantedAt: toInt(form.plantedAt),
+      content: form.content || null,
+      expectedCloseFrom: toInt(form.expectedCloseFrom),
+      expectedCloseTo: toInt(form.expectedCloseTo),
+      importance: form.importance || null,
+    });
+    if (ok) {
+      setForm({ ...EMPTY });
+      setOpen(false);
+    }
+  };
+
+  if (!open) {
+    return (
+      <button
+        type="button"
+        onClick={() => setOpen(true)}
+        className="rounded bg-cinnabar px-3 py-1.5 text-sm text-panel hover:opacity-90"
+      >
+        ＋ 登记伏笔
+      </button>
+    );
+  }
+
+  const canSubmit =
+    form.code.trim().length > 0 && form.title.trim().length > 0 && !busy;
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        void submit();
+      }}
+      className="rounded border border-line bg-panel p-4"
+    >
+      <div className="grid grid-cols-2 gap-3 sm:grid-cols-3">
+        <Field label="代号 *" id="f-code">
+          <input
+            id="f-code"
+            value={form.code}
+            onChange={(e) => set("code", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+        <Field label="标题 *" id="f-title" span2>
+          <input
+            id="f-title"
+            value={form.title}
+            onChange={(e) => set("title", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+        <Field label="埋设章" id="f-planted">
+          <input
+            id="f-planted"
+            inputMode="numeric"
+            value={form.plantedAt}
+            onChange={(e) => set("plantedAt", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+        <Field label="回收窗口起" id="f-from">
+          <input
+            id="f-from"
+            inputMode="numeric"
+            value={form.expectedCloseFrom}
+            onChange={(e) => set("expectedCloseFrom", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+        <Field label="回收窗口止" id="f-to">
+          <input
+            id="f-to"
+            inputMode="numeric"
+            value={form.expectedCloseTo}
+            onChange={(e) => set("expectedCloseTo", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+        <Field label="重要度" id="f-imp">
+          <input
+            id="f-imp"
+            value={form.importance}
+            onChange={(e) => set("importance", e.target.value)}
+            placeholder="主线/支线"
+            className={inputCls}
+          />
+        </Field>
+        <Field label="线索内容" id="f-content" span3>
+          <input
+            id="f-content"
+            value={form.content}
+            onChange={(e) => set("content", e.target.value)}
+            className={inputCls}
+          />
+        </Field>
+      </div>
+      <div className="mt-3 flex items-center gap-2">
+        <button
+          type="submit"
+          disabled={!canSubmit}
+          className="rounded bg-cinnabar px-3 py-1.5 text-sm text-panel hover:opacity-90 disabled:opacity-40"
+        >
+          {busy ? "登记中…" : "登记"}
+        </button>
+        <button
+          type="button"
+          onClick={() => setOpen(false)}
+          className="rounded border border-line px-3 py-1.5 text-sm text-ink-soft hover:border-cinnabar"
+        >
+          取消
+        </button>
+      </div>
+    </form>
+  );
+}
+
+const inputCls =
+  "w-full rounded border border-line bg-bg px-2 py-1 text-sm text-ink focus:border-cinnabar focus:outline-none";
+
+interface FieldProps {
+  label: string;
+  id: string;
+  span2?: boolean;
+  span3?: boolean;
+  children: React.ReactNode;
+}
+
+function Field({ label, id, span2, span3, children }: FieldProps) {
+  const span = span3 ? "col-span-2 sm:col-span-3" : span2 ? "col-span-2" : "";
+  return (
+    <div className={span}>
+      <label htmlFor={id} className="block text-xs text-ink-soft">
+        {label}
+      </label>
+      <div className="mt-0.5">{children}</div>
+    </div>
+  );
+}
+
+function toInt(raw: string): number | null {
+  const trimmed = raw.trim();
+  if (trimmed.length === 0) return null;
+  const n = Number.parseInt(trimmed, 10);
+  return Number.isInteger(n) ? n : null;
+}

apps/web/components/outline/OutlineChapterRow.tsx

@@ -0,0 +1,51 @@
+"use client";
+
+import type { OutlineChapterView } from "@/lib/api/types";
+import {
+  isCloseWindow,
+  windowBadgeLabel,
+} from "@/lib/outline/outline";
+
+interface OutlineChapterRowProps {
+  chapter: OutlineChapterView;
+}
+
+// 单章大纲行（UX §6.7）：章号 + beats + 伏笔窗口徽标（⚑）。
+// 接近回收窗口的徽标用琥珀 + 「可回收」提示（a11y：图标 + 文案，不单靠色）。
+export function OutlineChapterRow({ chapter }: OutlineChapterRowProps) {
+  const windows = chapter.foreshadow_windows ?? [];
+  return (
+    <li className="border-l-2 border-line py-2 pl-3">
+      <div className="flex flex-wrap items-center gap-2">
+        <span className="font-mono text-xs text-ink-soft">
+          第 {chapter.no} 章
+        </span>
+        {windows.map((w) => {
+          const close = isCloseWindow(chapter, w);
+          return (
+            <span
+              key={w.code}
+              title={close ? "进入回收窗口，建议本章安排回收" : undefined}
+              className={`rounded px-1.5 py-0.5 text-xs ${
+                close
+                  ? "bg-overdue/15 text-overdue"
+                  : "bg-[var(--color-cinnabar-wash)] text-cinnabar"
+              }`}
+            >
+              {windowBadgeLabel(w)}
+              {close ? " · 可回收" : ""}
+            </span>
+          );
+        })}
+      </div>
+      {chapter.beats && chapter.beats.length > 0 ? (
+        <p className="mt-1 text-sm text-ink">
+          <span className="text-ink-soft">beats: </span>
+          {chapter.beats.join(" / ")}
+        </p>
+      ) : (
+        <p className="mt-1 text-sm text-ink-soft/60">（无节拍）</p>
+      )}
+    </li>
+  );
+}

apps/web/components/outline/OutlineEditor.tsx

@@ -0,0 +1,97 @@
+"use client";
+
+import { useMemo, useState } from "react";
+
+import { AppShell } from "@/components/AppShell";
+import type { OutlineChapterView, ProjectResponse } from "@/lib/api/types";
+import { groupByVolume } from "@/lib/outline/outline";
+import { useOutline } from "@/lib/outline/useOutline";
+import { OutlineChapterRow } from "./OutlineChapterRow";
+
+interface OutlineEditorProps {
+  project: ProjectResponse;
+  initialChapters: OutlineChapterView[];
+}
+
+// 大纲编辑器主体（UX §6.7）。RSC 种入已存大纲；Client 承载生成（POST .../outline）。
+// 无凭据 → 503 LLM_UNAVAILABLE 经 error 检出、引导去设置。
+export function OutlineEditor({
+  project,
+  initialChapters,
+}: OutlineEditorProps) {
+  const { chapters, status, error, generate } = useOutline(initialChapters);
+  const [volume, setVolume] = useState(1);
+  const volumes = useMemo(() => groupByVolume(chapters), [chapters]);
+  const generating = status === "generating";
+
+  return (
+    <AppShell
+      title={`〈${project.title}〉`}
+      subtitle="大纲"
+      projectId={project.id}
+      activeNav="outline"
+    >
+      <div className="flex h-[calc(100vh-4rem)] flex-col p-6">
+        <div className="mb-4 flex items-center gap-3">
+          <h1 className="font-serif text-lg text-ink">大纲</h1>
+          <label htmlFor="vol" className="ml-auto text-xs text-ink-soft">
+            卷号
+          </label>
+          <input
+            id="vol"
+            inputMode="numeric"
+            value={volume}
+            onChange={(e) => setVolume(Math.max(1, Number(e.target.value) || 1))}
+            className="w-16 rounded border border-line bg-bg px-2 py-1 text-sm text-ink focus:border-cinnabar focus:outline-none"
+          />
+          <button
+            type="button"
+            disabled={generating}
+            onClick={() => void generate(project.id, volume)}
+            className="rounded bg-cinnabar px-3 py-1.5 text-sm text-panel hover:opacity-90 disabled:opacity-40"
+          >
+            {generating ? "排大纲中…" : "✦ AI 排大纲"}
+          </button>
+        </div>
+
+        {error ? (
+          <p className="mb-4 text-sm text-conflict">
+            大纲生成失败（{error.code}）：{error.message}
+            {error.code === "LLM_UNAVAILABLE" ? (
+              <>
+                {" "}
+                <a
+                  href="/settings/providers"
+                  className="underline hover:text-cinnabar"
+                >
+                  去设置提供商
+                </a>
+              </>
+            ) : null}
+          </p>
+        ) : null}
+
+        <div className="min-h-0 flex-1 overflow-auto">
+          {volumes.length === 0 ? (
+            <p className="rounded border border-dashed border-line p-6 text-sm text-ink-soft">
+              暂无大纲。点「✦ AI 排大纲」生成逐章节拍与伏笔窗口。
+            </p>
+          ) : (
+            volumes.map((group) => (
+              <section key={group.volume} className="mb-6">
+                <h2 className="mb-2 font-serif text-base text-ink">
+                  卷 {group.volume}
+                </h2>
+                <ul className="space-y-1">
+                  {group.chapters.map((ch) => (
+                    <OutlineChapterRow key={ch.no} chapter={ch} />
+                  ))}
+                </ul>
+              </section>
+            ))
+          )}
+        </div>
+      </div>
+    </AppShell>
+  );
+}

apps/web/components/review/BeatMap.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import { toBeatCells, toSparkline } from "@/lib/pace/beatmap";
+
+interface BeatMapProps {
+  beatMap: number[];
+}
+
+// 爽点节拍图（UX §6.4）：beat_map(int 序列) → ▁▃▅ 柱状条。
+// 渲染为定高柱（CSS height%），同时给文本 sparkline 作无障碍标签（a11y §10）。
+// 静态高度，无动画 → 天然尊重 prefers-reduced-motion。
+export function BeatMap({ beatMap }: BeatMapProps) {
+  const cells = toBeatCells(beatMap);
+  if (cells.length === 0) {
+    return <span className="text-xs text-ink-soft/60">无节拍数据</span>;
+  }
+  const spark = toSparkline(beatMap);
+  return (
+    <div
+      className="flex h-12 items-end gap-0.5"
+      role="img"
+      aria-label={`爽点节拍图 ${spark}`}
+    >
+      {cells.map((cell, i) => (
+        <div
+          key={i}
+          className="min-w-[4px] flex-1 rounded-t bg-cinnabar/70"
+          style={{ height: `${cell.heightPct}%` }}
+          title={`第${i + 1}拍 强度${cell.value}`}
+        />
+      ))}
+    </div>
+  );
+}

apps/web/components/review/ForeshadowSuggestions.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import type { ForeshadowSuggestion } from "@/lib/review/sse";
+
+interface ForeshadowSuggestionsProps {
+  suggestions: ForeshadowSuggestion[];
+  // 审项是否未完成（incomplete）。
+  incomplete: boolean;
+}
+
+// 伏笔建议区（UX §6.4 ②）：planted「新埋待确认」/ resolved「疑似回收」，只读建议。
+// 不静默写库（不变量#3）：仅展示，登记/回收经伏笔看板显式确认。
+export function ForeshadowSuggestions({
+  suggestions,
+  incomplete,
+}: ForeshadowSuggestionsProps) {
+  return (
+    <section className="mb-4">
+      <h2 className="text-xs font-semibold uppercase tracking-wide text-ink-soft">
+        伏笔 (foreshadow-analyst)
+      </h2>
+      {incomplete ? (
+        <p className="mt-1 text-xs text-overdue">◌ 未完成</p>
+      ) : suggestions.length === 0 ? (
+        <p className="mt-1 text-xs text-ink-soft">无伏笔建议。</p>
+      ) : (
+        <ul className="mt-2 space-y-2">
+          {suggestions.map((s, i) => (
+            <li
+              key={i}
+              className="rounded border border-line bg-panel p-2 text-xs"
+            >
+              <span
+                className={`mr-1 rounded px-1.5 py-0.5 ${
+                  s.kind === "resolved"
+                    ? "bg-pass/15 text-pass"
+                    : "bg-[var(--color-cinnabar-wash)] text-cinnabar"
+                }`}
+              >
+                {s.kind === "resolved" ? "⚑ 疑似回收" : "＋ 新埋待确认"}
+              </span>
+              {s.code ? (
+                <span className="font-mono text-ink-soft"> {s.code}</span>
+              ) : null}
+              <p className="mt-1 text-ink">{s.title}</p>
+              {s.where ? (
+                <span className="text-ink-soft">{s.where}</span>
+              ) : null}
+              {s.note ? (
+                <p className="mt-0.5 text-ink-soft">{s.note}</p>
+              ) : null}
+            </li>
+          ))}
+        </ul>
+      )}
+    </section>
+  );
+}

apps/web/components/review/PacePanel.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import type { PaceReport } from "@/lib/review/sse";
+import { BeatMap } from "./BeatMap";
+
+interface PacePanelProps {
+  pace: PaceReport | null;
+  incomplete: boolean;
+}
+
+// 节奏报告区（UX §6.4 ④）：节拍图 ▁▃▅ + 注水段列表 + 章末钩子徽标。只读建议。
+export function PacePanel({ pace, incomplete }: PacePanelProps) {
+  return (
+    <section className="mb-4">
+      <h2 className="text-xs font-semibold uppercase tracking-wide text-ink-soft">
+        节奏 (pace-checker)
+      </h2>
+      {incomplete ? (
+        <p className="mt-1 text-xs text-overdue">◌ 未完成</p>
+      ) : pace === null ? (
+        <p className="mt-1 text-xs text-ink-soft">无节奏报告。</p>
+      ) : (
+        <div className="mt-2 space-y-2 text-xs">
+          <div>
+            <p className="mb-1 text-ink-soft">爽点节拍图</p>
+            <BeatMap beatMap={pace.beat_map} />
+          </div>
+
+          <p>
+            章末钩子：
+            {pace.hook ? (
+              <span className="text-pass">✓ 有</span>
+            ) : (
+              <span className="text-overdue">⚠ 无（建议补悬念）</span>
+            )}
+          </p>
+
+          {pace.water.length > 0 ? (
+            <div>
+              <p className="text-overdue">⚠ 注水段</p>
+              <ul className="mt-1 space-y-1">
+                {pace.water.map((w, i) => (
+                  <li key={i} className="text-ink-soft">
+                    {w.where}：{w.reason}
+                  </li>
+                ))}
+              </ul>
+            </div>
+          ) : (
+            <p className="text-pass">✓ 无明显注水</p>
+          )}
+        </div>
+      )}
+    </section>
+  );
+}

apps/web/components/review/ReviewReport.tsx

@@ -13,13 +13,19 @@ import {
   type DecisionDraft,
   type Verdict,
 } from "@/lib/review/decisions";
-import { normalizeConflicts } from "@/lib/review/history";
+import {
+  normalizeConflicts,
+  normalizeForeshadowSug,
+  normalizePace,
+} from "@/lib/review/history";
 import { useAccept } from "@/lib/review/useAccept";
 import { useReviewStream } from "@/lib/review/useReviewStream";
 import type { ReviewConflict } from "@/lib/review/sse";
 import { AcceptPanel } from "./AcceptPanel";
 import { AnnotatedText } from "./AnnotatedText";
 import { ConflictCard } from "./ConflictCard";
+import { ForeshadowSuggestions } from "./ForeshadowSuggestions";
+import { PacePanel } from "./PacePanel";
 
 interface ReviewReportProps {
   project: ProjectResponse;
@@ -48,19 +54,41 @@ export function ReviewReport({
   const [missing, setMissing] = useState<Set<number>>(new Set());
   const seededRef = useRef(false);
 
-  // 进页一次性把历史 conflicts 种入流状态（无需重审即可裁决）。
+  // 进页一次性把历史留痕（冲突 + 伏笔建议 + 节奏）种入流状态（无需重审即可裁决/查看）。
   const seededConflicts = useMemo(
     () => normalizeConflicts(initialReview),
     [initialReview],
   );
+  const seededForeshadow = useMemo(
+    () => normalizeForeshadowSug(initialReview),
+    [initialReview],
+  );
+  const seededPace = useMemo(
+    () => normalizePace(initialReview),
+    [initialReview],
+  );
   useEffect(() => {
     if (seededRef.current) return;
     seededRef.current = true;
-    if (seededConflicts.length > 0) review.seed(seededConflicts);
-  }, [review, seededConflicts]);
+    const hasSeed =
+      seededConflicts.length > 0 ||
+      seededForeshadow.length > 0 ||
+      seededPace !== null;
+    if (hasSeed) {
+      review.seed({
+        conflicts: seededConflicts,
+        foreshadow: seededForeshadow,
+        pace: seededPace,
+      });
+    }
+  }, [review, seededConflicts, seededForeshadow, seededPace]);
 
   // 当前生效冲突 = 流状态（重审后即时更新，否则种入的历史）。
   const conflicts: ReviewConflict[] = review.state.conflicts;
+  const foreshadow = review.state.foreshadow;
+  const pace = review.state.pace;
+  const sectionStatus = (name: string): string | undefined =>
+    review.state.sections.find((s) => s.name === name)?.status;
 
   // 重审完成（done 边沿）→ 重置裁决草稿对齐新冲突集（冲突可能整组变化）。
   const conflictCount = conflicts.length;
@@ -127,6 +155,8 @@ export function ReviewReport({
     <AppShell
       title={`〈${project.title}〉`}
       subtitle={`第 ${chapterNo} 章 · 审稿报告`}
+      projectId={project.id}
+      activeNav="review"
     >
       <div className="grid h-[calc(100vh-4rem)] grid-cols-1 lg:grid-cols-[1fr_24rem]">
         {/* 左：终稿正文 + 就地标注 */}
@@ -240,6 +270,17 @@ export function ReviewReport({
             )}
           </section>
 
+          <div className="mt-4 border-t border-line pt-4">
+            <ForeshadowSuggestions
+              suggestions={foreshadow}
+              incomplete={sectionStatus("foreshadow") === "incomplete"}
+            />
+            <PacePanel
+              pace={pace}
+              incomplete={sectionStatus("pace") === "incomplete"}
+            />
+          </div>
+
           <section className="mt-4">
             <AcceptPanel
               conflictCount={conflictCount}

apps/web/components/workbench/Workbench.tsx

@@ -55,6 +55,8 @@ export function Workbench({ project }: WorkbenchProps) {
     <AppShell
       title={`〈${project.title}〉`}
       subtitle={`第 ${chapterNo} 章`}
+      projectId={project.id}
+      activeNav="write"
     >
       <div className="grid h-[calc(100vh-4rem)] grid-cols-1 lg:grid-cols-[12rem_1fr_18rem]">
         <ChapterList currentChapterNo={chapterNo} />
@@ -137,6 +139,18 @@ function Toolbar({
         <span className="font-mono text-xs text-ink-soft">
           字数 {wordCount.toLocaleString()}
         </span>
+        <Link
+          href={`/projects/${projectId}/outline`}
+          className="rounded border border-line px-4 py-2 text-sm text-ink hover:border-cinnabar hover:text-cinnabar"
+        >
+          大纲
+        </Link>
+        <Link
+          href={`/projects/${projectId}/foreshadow`}
+          className="rounded border border-line px-4 py-2 text-sm text-ink hover:border-cinnabar hover:text-cinnabar"
+        >
+          伏笔
+        </Link>
         <Link
           href={`/projects/${projectId}/review?chapter=${chapterNo}`}
           className="rounded border border-cinnabar px-4 py-2 text-sm text-cinnabar hover:bg-[var(--color-cinnabar-wash)]"