feat: 公文三栏单页布局，并修复时间线目录跳转与样式

公告/单页对齐帖子详情三栏壳；时间线按日锚点可跳转，条目改为日志行并用暖金日期区分 feat 色。

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/app/p/[slug]/page.tsx

@@ -1,10 +1,19 @@
 import type { Metadata } from "next";
-import Link from "next/link";
 import { notFound } from "next/navigation";
-import { ChevronRight } from "lucide-react";
-import { fetchSitePageBySlug } from "@/lib/api";
-import { formatDate } from "@/lib/format";
+import { Megaphone } from "lucide-react";
+import { fetchSitePageBySlug, fetchOverview } from "@/lib/api";
+import { getPublicSettingsCached } from "@/lib/serverData";
+import { extractToc, estimateReadingMinutes, markdownHeadingToc } from "@/lib/toc";
 import MarkdownBody from "@/components/MarkdownBody";
+import PostToc from "@/components/PostToc";
+import {
+  SiteDocShell,
+  SiteDocIdentity,
+  SiteDocPageNav,
+  SiteDocAnnoNav,
+  SiteDocMasthead,
+  SiteDocBreadcrumb,
+} from "@/components/site-doc";
 
 interface PageProps {
   params: Promise<{ slug: string }>;
@@ -29,56 +38,109 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
 
 export default async function SitePagePublic({ params }: PageProps) {
   const { slug } = await params;
-  const data = await fetchSitePageBySlug(slug).catch(() => null);
+  const [data, overview, settings] = await Promise.all([
+    fetchSitePageBySlug(slug).catch(() => null),
+    fetchOverview().catch(() => null),
+    getPublicSettingsCached(),
+  ]);
   if (!data) notFound();
 
   const p = data.page;
+  const sidebarPages = overview?.sidebar_pages ?? [];
+  const announcements = overview?.announcements ?? [];
+  const siteLead = settings.site_description?.trim() || undefined;
+  const toc = extractToc(p.content);
+  const headingToc = markdownHeadingToc(toc);
+  const readingMinutes = estimateReadingMinutes(p.content, p.title.length);
+
+  let headingIndex = 0;
+  const headingRenderer = (Tag: "h2" | "h3") =>
+    function Heading({ children }: { children?: React.ReactNode }) {
+      const item = headingToc[headingIndex++];
+      return (
+        <Tag id={item?.id} style={{ scrollMarginTop: 90 }}>
+          {children}
+        </Tag>
+      );
+    };
+
   const jsonLd = {
     "@context": "https://schema.org",
-    "@type": "Article",
-    headline: p.title,
+    "@type": "WebPage",
+    name: p.title,
     description: p.excerpt || undefined,
     datePublished: p.created_at,
     dateModified: p.updated_at,
   };
 
+  const left = (
+    <>
+      <SiteDocIdentity kind="about" lead={siteLead} />
+      <SiteDocPageNav pages={sidebarPages} currentSlug={slug} />
+    </>
+  );
+
+  const right =
+    toc.length > 0 ? (
+      <PostToc items={toc} />
+    ) : (
+      <SiteDocAnnoNav items={announcements} />
+    );
+
   return (
-    <div className="max-w-3xl mx-auto">
+    <>
       <script
         type="application/ld+json"
         dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
       />
 
-      <nav className="meta mb-5 flex items-center gap-1.5 text-[13px]">
-        <Link href="/" className="hover:text-[var(--accent)] transition-colors">
-          首页
-        </Link>
-        <ChevronRight size={13} />
-        <span className="truncate" style={{ color: "var(--accent)" }}>
-          {p.title}
-        </span>
-      </nav>
+      <SiteDocShell
+        left={left}
+        right={right}
+        mobileExtras={
+          <>
+            {toc.length > 0 ? <PostToc items={toc} /> : null}
+            <SiteDocPageNav pages={sidebarPages} currentSlug={slug} title="文档目录" />
+            {toc.length === 0 && announcements.length > 0 ? (
+              <SiteDocAnnoNav items={announcements} />
+            ) : null}
+          </>
+        }
+      >
+        <SiteDocBreadcrumb
+          items={[
+            { href: "/", label: "首页" },
+            { label: "关于本站" },
+            { label: p.title },
+          ]}
+        />
 
-      <article className="panel p-6 sm:p-8">
-        <time className="meta text-[12px] tabular-nums" dateTime={p.updated_at || p.created_at}>
-          {formatDate(p.updated_at || p.created_at)}
-        </time>
-        <h1
-          className="mt-2 text-[24px] sm:text-[28px] font-extrabold leading-snug tracking-tight"
-          style={{ color: "var(--ink)" }}
-        >
-          {p.title}
-        </h1>
-        {p.excerpt ? (
-          <p className="mt-3 text-[14.5px] leading-relaxed" style={{ color: "var(--ink-2)" }}>
-            {p.excerpt}
-          </p>
-        ) : null}
+        <article className="panel p-6 sm:p-8">
+          <SiteDocMasthead
+            kicker="官方文件"
+            title={p.title}
+            excerpt={p.excerpt || undefined}
+            createdAt={p.created_at}
+            updatedAt={p.updated_at}
+            readingMinutes={readingMinutes}
+            showTimeOfDay
+          />
 
-        <div className="mt-5 pt-5" style={{ borderTop: "1px solid var(--line)" }}>
-          <MarkdownBody content={p.content} />
+          <MarkdownBody
+            content={p.content}
+            components={
+              headingToc.length > 0
+                ? { h2: headingRenderer("h2"), h3: headingRenderer("h3") }
+                : undefined
+            }
+          />
+        </article>
+
+        <div className="mt-5 flex items-center gap-2 text-[12.5px] meta">
+          <Megaphone size={14} style={{ color: "var(--accent)" }} />
+          <span>由站点管理团队维护</span>
         </div>
-      </article>
-    </div>
+      </SiteDocShell>
+    </>
   );
 }