feat: M4 文风 + M5 生成/多provider/Skill + Kimi Code 订阅接入 + 本地联调修复

M4（文风）: style-auditor 双轨（提取指纹/漂移第四审）+ jobs 长任务框架(zombie reaper) + 回炉 refine + GET /style read-back。
M5（生成+扩展）: worldbuilder/character-gen（入库 continuity 409 gate + partition_writes 白名单 + schema→JSONB 形变）；
  网关多 provider 回退链/熔断/能力降级（Anthropic/Gemini 适配器）；Skill registry + 表权限沙箱 + 规则；
  前端 角色生成器/世界观/Codex/规则页/技能库/⌘K 命令面板。
K1（Kimi Code 订阅接入）: OAuth device-flow（kimi-code）+ 静态 Console key（kimi-code-key）两路径；
  coding 端点 KimiCLI 伪造头（实测 UA allow-list 门禁，缺则 403）+ JSON 模式结构化（thinking ⊥ tool_choice）。
本地联调修复: CORS 中间件；assemble 注入 premise+「写第N章」指令（修空 prompt 400）；
  GET /outline·/draft read-back + 大纲/工作台/审稿页重载；写页 client/server 常量边界 + notFound 健壮化；
  字数 toLocaleString locale 水合；审稿页终稿从已存草稿 seed（修 accept 422）。
门禁: backend ruff/mypy(157)/alembic 无漂移/pytest 451 · frontend lint/tsc/vitest/build。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

apps/web/components/rules/RulesPage.tsx

@@ -0,0 +1,107 @@
+"use client";
+
+import { useMemo, useState } from "react";
+
+import { AppShell } from "@/components/AppShell";
+import type { ProjectResponse, RuleView } from "@/lib/api/types";
+import {
+  RULE_LEVELS,
+  RULE_LEVEL_LABELS,
+  groupByLevel,
+  type RuleLevel,
+} from "@/lib/rules/rules";
+import { useRules } from "@/lib/rules/useRules";
+
+interface RulesPageProps {
+  project: ProjectResponse;
+  initialRules: RuleView[];
+}
+
+// 规则页（UX §7）：四级规则列表 + 新增（乐观 + 回滚）。
+export function RulesPage({ project, initialRules }: RulesPageProps) {
+  const { items, busy, add } = useRules(initialRules);
+  const [level, setLevel] = useState<RuleLevel>("project");
+  const [content, setContent] = useState("");
+  const groups = useMemo(() => groupByLevel(items), [items]);
+
+  const onSubmit = async (e: React.FormEvent): Promise<void> => {
+    e.preventDefault();
+    const ok = await add(project.id, level, content);
+    if (ok) setContent("");
+  };
+
+  return (
+    <AppShell
+      title={`〈${project.title}〉`}
+      subtitle="规则"
+      projectId={project.id}
+      activeNav="rules"
+    >
+      <div className="mx-auto flex max-w-3xl flex-col gap-6 p-6">
+        <form
+          onSubmit={onSubmit}
+          className="rounded border border-line bg-panel p-4"
+        >
+          <h1 className="mb-3 font-serif text-lg text-ink">新增规则</h1>
+          <div className="mb-3 flex items-end gap-3">
+            <label className="text-sm text-ink-soft">
+              级别
+              <select
+                value={level}
+                onChange={(e) => setLevel(e.target.value as RuleLevel)}
+                className="mt-1 block rounded border border-line bg-bg px-2 py-1.5 text-sm text-ink"
+              >
+                {RULE_LEVELS.map((lv) => (
+                  <option key={lv} value={lv}>
+                    {RULE_LEVEL_LABELS[lv]}
+                  </option>
+                ))}
+              </select>
+            </label>
+          </div>
+          <textarea
+            value={content}
+            onChange={(e) => setContent(e.target.value)}
+            placeholder="如：本作禁用现代科技词汇；称呼一律用「道友」"
+            rows={3}
+            className="w-full resize-y rounded border border-line bg-bg px-3 py-2 text-sm text-ink"
+          />
+          <button
+            type="submit"
+            disabled={busy || content.trim().length === 0}
+            className="mt-3 rounded bg-cinnabar px-4 py-2 text-sm text-white disabled:opacity-50"
+          >
+            {busy ? "保存中…" : "新增规则"}
+          </button>
+        </form>
+
+        <div className="flex flex-col gap-4">
+          {RULE_LEVELS.map((lv) => (
+            <section key={lv}>
+              <h2 className="mb-2 font-serif text-sm text-ink">
+                {RULE_LEVEL_LABELS[lv]}
+                <span className="ml-2 text-xs text-ink-soft">
+                  {groups[lv].length}
+                </span>
+              </h2>
+              {groups[lv].length === 0 ? (
+                <p className="text-xs text-ink-soft">（暂无）</p>
+              ) : (
+                <ul className="flex flex-col gap-2">
+                  {groups[lv].map((rule, i) => (
+                    <li
+                      key={i}
+                      className="rounded border border-line bg-panel px-3 py-2 text-sm text-ink"
+                    >
+                      {rule.content}
+                    </li>
+                  ))}
+                </ul>
+              )}
+            </section>
+          ))}
+        </div>
+      </div>
+    </AppShell>
+  );
+}