From 178dfd20665011af8209737acada693a177b7fca Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 02:26:45 +0800
Subject: [PATCH 01/13] =?UTF-8?q?chore:=20=E6=9B=B4=E6=96=B0UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ActivityTicker.tsx | 121 ++----
 app/components/BrandMark.tsx      |   5 +-
 app/components/Community.tsx      | 219 +++++------
 app/components/Contribute.tsx     |  62 +--
 app/components/Features.tsx       |  74 ++--
 app/components/Footer.tsx         | 203 +++++-----
 app/components/Header.tsx         | 114 +++---
 app/components/Hero.tsx           | 127 ++++--
 app/components/LicenseNotice.tsx  |  87 +++--
 app/components/ZoteroFeed.tsx     |  76 ++--
 app/globals.css                   | 617 ++++--------------------------
 app/layout.tsx                    |  11 +-
 tsconfig.json                     |  10 +-
 13 files changed, 636 insertions(+), 1090 deletions(-)

diff --git a/app/components/ActivityTicker.tsx b/app/components/ActivityTicker.tsx
index 6c0f981b..84a97909 100644
--- a/app/components/ActivityTicker.tsx
+++ b/app/components/ActivityTicker.tsx
@@ -87,95 +87,38 @@ export function ActivityTicker({ className }: ActivityTickerProps) {
   const showPlayback = activeEvent.deprecated && Boolean(activeEvent.playback);
 
   return (
-    <div className="group relative">
-      <button
-        type="button"
-        aria-label="关闭活动轮播"
-        onClick={() => setIsClosed(true)}
-        className="pointer-events-none absolute -top-3 -right-3 z-40 flex h-7 w-7 items-center justify-center rounded-full border border-border bg-background text-foreground opacity-0 shadow transition group-hover:pointer-events-auto group-hover:opacity-100 focus-visible:pointer-events-auto focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-      >
-        <X className="h-4 w-4" />
-      </button>
-      <aside
-        className={cn(
-          "relative w-full overflow-hidden rounded-2xl border border-border bg-background/70 text-left shadow-md backdrop-blur supports-[backdrop-filter]:bg-background/50",
-          className,
-        )}
-      >
-        <div className="relative aspect-[5/4] w-full overflow-hidden">
-          <Image
-            src={coverSrc}
-            alt={activeEvent.name}
-            fill
-            sizes="(min-width: 1024px) 320px, (min-width: 640px) 288px, 90vw"
-            priority
-            className="object-contain object-top"
-          />
-          {/* 下半透明渐变，用于保证文字与按钮对比度 */}
-          <div className="absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-black/70 via-black/30 to-transparent" />
-          {events.length > 1 && (
-            <>
-              {/* 多条活动时显示手动切换指示器 */}
-              <div className="absolute inset-x-0 top-0 flex justify-end gap-1 p-3">
-                {events.map((event, idx) => (
-                  <button
-                    key={`${event.name}-${idx}`}
-                    type="button"
-                    onClick={() => setActiveIndex(idx)}
-                    aria-label={`切换到 ${event.name}`}
-                    className={cn(
-                      "h-1.5 w-6 rounded-full transition-opacity",
-                      idx === activeIndex
-                        ? "bg-white/90 opacity-100"
-                        : "bg-white/40 opacity-60 hover:opacity-85",
-                    )}
-                  />
-                ))}
-              </div>
-              <button
-                type="button"
-                aria-label="上一条活动"
-                onClick={handlePrev}
-                className="absolute left-3 top-1/2 z-30 flex h-9 w-9 -translate-y-1/2 items-center justify-center rounded-full bg-black/35 text-white shadow-sm transition hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/70"
-              >
-                <ChevronLeft className="h-4 w-4" />
-              </button>
-              <button
-                type="button"
-                aria-label="下一条活动"
-                onClick={handleNext}
-                className="absolute right-3 top-1/2 z-30 flex h-9 w-9 -translate-y-1/2 items-center justify-center rounded-full bg-black/35 text-white shadow-sm transition hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/70"
-              >
-                <ChevronRight className="h-4 w-4" />
-              </button>
-            </>
-          )}
-          {/* 底部毛玻璃按钮，根据 deprecated 控制回放按钮可见性 */}
-          <div
-            className={cn(
-              "absolute inset-x-0 bottom-0 top-3/4 z-10 grid border-t border-white/15 bg-white/20 text-sm font-medium text-white shadow-lg backdrop-blur-md",
-              showPlayback ? "grid-cols-2" : "grid-cols-1",
-            )}
-          >
-            <Link
-              href={activeEvent.discord}
-              prefetch={false}
-              className="flex h-full items-center justify-center px-3 text-white transition-colors hover:bg-white/25 hover:text-white"
-            >
-              Discord
-            </Link>
-            {showPlayback && (
-              <Link
-                href={activeEvent.playback as string}
-                prefetch={false}
-                className="flex h-full items-center justify-center border-l border-white/15 px-3 text-white transition-colors hover:bg-white/25 hover:text-white"
-              >
-                Playback
-              </Link>
-            )}
-          </div>
-        </div>
-      </aside>
+    <div className="flex items-center w-full h-8 overflow-hidden group">
+      <div className="flex items-center gap-4 animate-in slide-in-from-right duration-500">
+        <span className="bg-[#CC0000] text-white px-2 py-0.5 font-mono text-[10px] uppercase tracking-tighter shrink-0">
+          Update
+        </span>
+        <Link
+          href={activeEvent.discord}
+          className="font-sans text-xs font-bold uppercase tracking-widest hover:text-[#CC0000] truncate"
+        >
+          {activeEvent.name} —{" "}
+          {activeEvent.deprecated ? "Archives Available" : "Event Active"}
+        </Link>
+        <span className="text-neutral-400 font-mono text-[10px]">&bull;</span>
+        <span className="font-mono text-[10px] text-neutral-500 uppercase">
+          Edition 1.0.0
+        </span>
+      </div>
+
+      <div className="ml-auto flex border-l border-[#111111] h-full">
+        <button
+          onClick={handlePrev}
+          className="px-3 hover:bg-[#111111] hover:text-white transition-colors border-r border-[#111111]"
+        >
+          <ChevronLeft className="h-3 w-3" />
+        </button>
+        <button
+          onClick={handleNext}
+          className="px-3 hover:bg-[#111111] hover:text-white transition-colors"
+        >
+          <ChevronRight className="h-3 w-3" />
+        </button>
+      </div>
     </div>
   );
 }
diff --git a/app/components/BrandMark.tsx b/app/components/BrandMark.tsx
index a0407d71..efbfa1f2 100644
--- a/app/components/BrandMark.tsx
+++ b/app/components/BrandMark.tsx
@@ -58,7 +58,10 @@ export function BrandMark({
         />
       </div>
       <span
-        className={cn("font-semibold text-lg tracking-tight", textClassName)}
+        className={cn(
+          "font-serif font-black text-2xl tracking-tighter uppercase italic",
+          textClassName,
+        )}
       >
         {BRAND_NAME}
       </span>
diff --git a/app/components/Community.tsx b/app/components/Community.tsx
index b1d1201a..cbd43dbf 100644
--- a/app/components/Community.tsx
+++ b/app/components/Community.tsx
@@ -10,123 +10,124 @@ import {
 
 export function Community() {
   return (
-    <section id="community" className="py-24">
+    <section
+      id="community"
+      className="py-24 border-t border-[#111111] newsprint-texture"
+    >
       <div className="container mx-auto px-6">
-        <div className="text-center mb-16">
-          <h2 className="text-4xl md:text-5xl font-bold mb-6">
-            成为{" "}
-            <span className="bg-gradient-primary bg-clip-text text-transparent">
-              社区
-            </span>{" "}
-            的一员
+        <div className="flex flex-col lg:flex-row justify-between items-baseline mb-16 pb-4 border-b border-[#111111]">
+          <h2 className="text-6xl md:text-8xl font-serif font-black uppercase italic tracking-tighter">
+            Community <br /> Archives
           </h2>
-          <p className="text-xl text-muted-foreground max-w-3xl mx-auto">
-            与来自世界各地的开发者一起学习、成长、创造。每个人的贡献都让社区变得更好。
-          </p>
+          <div className="font-mono text-xs uppercase tracking-widest text-neutral-500 max-w-sm text-right">
+            Join thousands of researchers and developers in our distributed
+            network.
+          </div>
         </div>
 
-        {/* Main CTA Card */}
-        <div className="max-w-4xl mx-auto mb-16">
-          <Card className="relative overflow-hidden border-2 border-primary/20 bg-transparent shadow-none">
-            <CardContent className="p-8 md:p-12 text-center">
-              <div className="mb-6">
-                <div className="inline-flex items-center justify-center w-16 h-16 mb-4">
-                  <BookOpen className="h-8 w-8 text-sky-500" />
-                </div>
-                <h3 className="text-2xl md:text-3xl font-bold mb-4">
-                  内卷知识库
-                </h3>
-                <p className="text-muted-foreground text-lg mb-6 max-w-2xl mx-auto">
-                  探索我们精心整理的技术文档、教程和工具。从基础到进阶，应有尽有。
-                </p>
-                <Button
-                  variant="outline"
-                  asChild
-                  className="text-lg px-8 py-6 h-auto"
-                >
-                  <a href="docs/ai" target="_blank" rel="noopener noreferrer">
-                    访问知识库 <ExternalLink className="ml-2 h-5 w-5" />
-                  </a>
-                </Button>
-              </div>
-            </CardContent>
-          </Card>
+        {/* Main CTA Section - Inverted */}
+        <div className="mb-16 border-4 border-[#111111] bg-[#111111] text-[#F9F9F7] p-12 lg:p-24 relative overflow-hidden">
+          <div className="relative z-10 max-w-3xl mx-auto text-center">
+            <div className="inline-block border border-[#F9F9F7] p-4 mb-8">
+              <BookOpen className="h-12 w-12 text-[#F9F9F7]" />
+            </div>
+            <h3 className="text-4xl md:text-6xl font-serif font-bold italic mb-6">
+              内卷知识库
+            </h3>
+            <p className="font-body text-xl mb-12 opacity-80 leading-relaxed text-justify md:text-center">
+              探索我们精心整理的技术文档、教程和工具。从基础到进阶，应有尽有。我们不仅是在分享知识，更是在构建共识。
+            </p>
+            <Button
+              variant="outline"
+              asChild
+              className="bg-transparent border-[#F9F9F7] text-[#F9F9F7] hover:bg-[#F9F9F7] hover:text-[#111111] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
+            >
+              <a href="docs/ai" target="_blank" rel="noopener noreferrer">
+                Access Archives <ExternalLink className="ml-4 h-5 w-5" />
+              </a>
+            </Button>
+          </div>
+          {/* Halftone background effect */}
+          <div className="absolute inset-0 halftone pointer-events-none opacity-20" />
         </div>
 
-        {/* Action Cards */}
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-6xl mx-auto">
-          <Card className="border-border bg-transparent shadow-none hover:shadow-elegant transition-all duration-300 hover:-translate-y-1">
-            <CardContent className="p-8 text-center">
-              <div className="mb-6">
-                <div className="inline-flex items-center justify-center w-12 h-12 mb-4">
-                  <Github className="h-6 w-6 text-sky-500" />
-                </div>
-                <h3 className="text-xl font-semibold mb-3">GitHub 仓库</h3>
-                <p className="text-muted-foreground mb-6">
-                  查看源代码，提交 Issue，参与项目讨论。
-                </p>
-                <Button variant="outline" asChild className="w-full">
-                  <a
-                    href="https://github.com/involutionhell"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    访问 GitHub <ExternalLink className="ml-2 h-4 w-4" />
-                  </a>
-                </Button>
-              </div>
-            </CardContent>
-          </Card>
+        {/* Action Cards Grid */}
+        <div className="grid grid-cols-1 md:grid-cols-3 border-t border-l border-[#111111]">
+          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
+              <Github className="h-6 w-6" />
+            </div>
+            <h3 className="text-2xl font-serif font-bold italic mb-4">
+              GitHub 仓库
+            </h3>
+            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+              查看源代码，提交 Issue，参与项目讨论。每一个 Commit
+              都是对社区的贡献。
+            </p>
+            <Button
+              variant="outline"
+              asChild
+              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+            >
+              <a
+                href="https://github.com/involutionhell"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                Source Code <ExternalLink className="ml-2 h-4 w-4" />
+              </a>
+            </Button>
+          </div>
 
-          <Card className="border-border bg-transparent shadow-none hover:shadow-elegant transition-all duration-300 hover:-translate-y-1">
-            <CardContent className="p-8 text-center">
-              <div className="mb-6">
-                <div className="inline-flex items-center justify-center w-12 h-12 mb-4">
-                  <MessageCircle className="h-6 w-6 text-sky-500" />
-                </div>
-                <h3 className="text-xl font-semibold mb-3">Discord 社区</h3>
-                <p className="text-muted-foreground mb-6">
-                  实时交流，分享经验，结识志同道合的朋友。
-                </p>
-                <Button
-                  variant="outline"
-                  asChild
-                  className="w-full text-sky-600 dark:text-sky-400"
-                >
-                  <a
-                    href="https://discord.com/invite/6CGP73ZWbD"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    加入 Discord <ExternalLink className="ml-2 h-4 w-4" />
-                  </a>
-                </Button>
-              </div>
-            </CardContent>
-          </Card>
+          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
+              <MessageCircle className="h-6 w-6" />
+            </div>
+            <h3 className="text-2xl font-serif font-bold italic mb-4">
+              Discord 社区
+            </h3>
+            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+              实时交流，分享经验，结识志同道合的朋友。打破孤岛，共同成长。
+            </p>
+            <Button
+              variant="outline"
+              asChild
+              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+            >
+              <a
+                href="https://discord.com/invite/6CGP73ZWbD"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                Join Dispatch <ExternalLink className="ml-2 h-4 w-4" />
+              </a>
+            </Button>
+          </div>
 
-          <Card className="border-border bg-transparent shadow-none hover:shadow-elegant transition-all duration-300 hover:-translate-y-1">
-            <CardContent className="p-8 text-center">
-              <div className="mb-6">
-                <div className="inline-flex items-center justify-center w-12 h-12 mb-4">
-                  <GraduationCap className="h-6 w-6 text-sky-500" />
-                </div>
-                <h3 className="text-xl font-semibold mb-3">文献资料</h3>
-                <p className="text-muted-foreground mb-6">
-                  访问我们在 Zotero 的文献库，获取精选学术资源。
-                </p>
-                <Button variant="outline" asChild className="w-full">
-                  <a
-                    href="https://www.zotero.org/groups/6053219/unsw_ai/library"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    访问文献库 <ExternalLink className="ml-2 h-4 w-4" />
-                  </a>
-                </Button>
-              </div>
-            </CardContent>
-          </Card>
+          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
+              <GraduationCap className="h-6 w-6" />
+            </div>
+            <h3 className="text-2xl font-serif font-bold italic mb-4">
+              文献资料
+            </h3>
+            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+              访问我们在 Zotero 的文献库，获取精选学术资源。连接前沿科技。
+            </p>
+            <Button
+              variant="outline"
+              asChild
+              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+            >
+              <a
+                href="https://www.zotero.org/groups/6053219/unsw_ai/library"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                View Library <ExternalLink className="ml-2 h-4 w-4" />
+              </a>
+            </Button>
+          </div>
         </div>
       </div>
     </section>
diff --git a/app/components/Contribute.tsx b/app/components/Contribute.tsx
index 670f72d8..5cca77cd 100644
--- a/app/components/Contribute.tsx
+++ b/app/components/Contribute.tsx
@@ -159,62 +159,18 @@ export function Contribute() {
           <Button
             variant="hero"
             size="lg"
-            className="relative isolate w-full sm:w-auto h-16 md:h-20 px-10 md:px-14 rounded-none
-                     text-lg md:text-2xl font-semibold tracking-wide overflow-hidden
-                     shadow-xl ring-1 ring-white/30 dark:ring-white/10
-                     bg-gradient-to-r from-sky-300 via-sky-400 to-blue-600
-                     dark:from-indigo-950 dark:via-slate-900 dark:to-black
-                     hover:shadow-[0_25px_60px_-12px] hover:scale-[1.03] transition-all duration-300 ease-out"
+            className="relative isolate w-full sm:w-auto h-20 px-14 rounded-none
+                     text-2xl font-serif font-black uppercase italic tracking-tighter
+                     bg-[#111111] text-[#F9F9F7] border border-[#111111]
+                     hover:bg-[#F9F9F7] hover:text-[#111111] transition-all duration-300"
             onClick={(event) => {
               event.preventDefault();
               router.push("/editor");
             }}
           >
-            {/* Day gradient shimmer */}
-            <span
-              aria-hidden
-              className="pointer-events-none absolute -inset-1 opacity-30 blur-2xl transition-opacity duration-500
-                         bg-gradient-to-r from-sky-200 via-blue-300 to-sky-400 dark:opacity-0"
-            />
-            {/* Night nebula glow */}
-            <span
-              aria-hidden
-              className="pointer-events-none absolute -inset-1 opacity-0 blur-2xl transition-opacity duration-500
-                         dark:opacity-25 dark:bg-gradient-to-br dark:from-indigo-800 dark:via-fuchsia-700/50 dark:to-blue-900"
-            />
-
-            {/* Day clouds */}
-            <span
-              aria-hidden
-              className={`absolute -left-12 top-1/3 w-48 h-24 rounded-full bg-white/60 blur-2xl dark:hidden ${styles.driftSlow}`}
-            />
-            <span
-              aria-hidden
-              className={`absolute left-1/3 -bottom-8 w-64 h-28 rounded-full bg-white/40 blur-3xl dark:hidden ${styles.driftFast}`}
-            />
-
-            {/* Night stars */}
-            <span aria-hidden className="hidden dark:block">
-              <span
-                className={`absolute left-6 top-3 w-1 h-1 rounded-full bg-white/90 ${styles.twinkle}`}
-              />
-              <span
-                className={`absolute left-1/3 top-2 w-1 h-1 rounded-full bg-white/80 ${styles.twinkleDelay1}`}
-              />
-              <span
-                className={`absolute left-2/3 top-5 w-1 h-1 rounded-full bg-white/70 ${styles.twinkleDelay2}`}
-              />
-              <span
-                className={`absolute right-8 top-4 w-1 h-1 rounded-full bg-white/90 ${styles.twinkleDelay3}`}
-              />
-              <span
-                className={`absolute right-1/4 bottom-3 w-1 h-1 rounded-full bg-white/80 ${styles.twinkle}`}
-              />
-            </span>
-
-            <span className="relative z-10 flex items-center gap-3 text-white">
-              <Sparkles className="h-6 w-6 opacity-95" />
-              <span className={styles.textGlow}>我要投稿</span>
+            <span className="relative z-10 flex items-center gap-4">
+              <Sparkles className="h-6 w-6" />
+              <span>Submit Contribution</span>
             </span>
           </Button>
         </DialogTrigger>
@@ -225,9 +181,9 @@ export function Contribute() {
           rel="noopener noreferrer"
           aria-label="查看投稿指南"
           title="查看投稿指南"
-          className="absolute top-0 right-0 flex h-11 w-11 translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-full border border-white/80 bg-white text-sky-600 shadow-lg ring-1 ring-sky-400/60 transition-transform hover:-translate-y-1/2 hover:translate-x-1/2 hover:scale-105 hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring dark:border-slate-700 dark:bg-slate-900 dark:text-sky-300"
+          className="absolute top-0 right-0 flex h-10 w-10 translate-x-1/2 -translate-y-1/2 items-center justify-center border border-[#111111] bg-[#F9F9F7] text-[#111111] font-mono hover:bg-[#CC0000] hover:text-white transition-colors z-20"
         >
-          <span className="text-lg font-semibold">?</span>
+          <span className="text-sm font-bold">?</span>
           <span className="sr-only">查看投稿指南</span>
         </a>
       </div>
diff --git a/app/components/Features.tsx b/app/components/Features.tsx
index d8009fd5..98ea844d 100644
--- a/app/components/Features.tsx
+++ b/app/components/Features.tsx
@@ -1,5 +1,4 @@
-import { Card, CardContent } from "@/components/ui/card";
-import { Badge } from "@/components/ui/badge";
+import React from "react";
 import { Users, Zap, Heart } from "lucide-react";
 import { Github as GithubIcon } from "./icons/Github";
 
@@ -40,47 +39,58 @@ export function Features() {
   ];
 
   return (
-    <section id="features" className="py-12">
+    <section id="features" className="py-24 border-t border-[#111111]">
       <div className="container mx-auto px-6">
-        <div className="text-center mb-16">
-          <h3 className="text-3xl md:text-4xl font-bold mb-6">
-            <span className="bg-gradient-primary bg-clip-text text-transparent">
-              内卷地狱
-            </span>
-            想做什么{" "}
-          </h3>
-
-          <p className="text-xl text-muted-foreground max-w-3xl mx-auto">
-            我们致力于创造一个真正属于开发者的学习环境，让每个人都能在这里获得成长。
+        <div className="flex flex-col lg:flex-row gap-12 items-end mb-16 pb-8 border-b-4 border-[#111111]">
+          <h2 className="text-6xl md:text-8xl font-serif font-black italic uppercase leading-none tracking-tighter">
+            Mission <br /> Statement
+          </h2>
+          <p className="text-xl font-body text-neutral-600 max-w-2xl text-justify mb-2">
+            我们致力于创造一个真正属于开发者的学习环境，让每个人都能在这里获得成长。在这里，知识是流动的，门槛是不存在的，而内卷是被鄙视的。
           </p>
         </div>
 
-        <div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-6xl mx-auto">
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-l border-t border-[#111111]">
           {features.map((feature, index) => (
-            <Card
+            <div
               key={index}
-              className="relative overflow-hidden border-border bg-transparent shadow-none hover:shadow-elegant transition-all duration-500 hover:-translate-y-2 group"
+              className="group relative border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors"
             >
-              <CardContent className="p-8">
-                <div className="flex items-start space-x-4">
-                  <div className="p-0">{feature.icon}</div>
-                  <div className="flex-1">
-                    <div className="flex items-center gap-3 mb-3">
-                      <h3 className="text-xl font-semibold">{feature.title}</h3>
-                      <Badge variant="outline" className="text-xs">
-                        {feature.highlight}
-                      </Badge>
+              <div className="flex flex-col h-full">
+                <div className="flex items-center justify-between mb-8">
+                  <div className="w-16 h-16 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all duration-300">
+                    {/* Simplified icon styling */}
+                    <div className="p-0 text-[#111111] group-hover:text-white">
+                      {React.cloneElement(feature.icon as React.ReactElement, {
+                        className: "h-8 w-8",
+                      })}
                     </div>
-                    <p className="text-muted-foreground leading-relaxed">
-                      {feature.description}
-                    </p>
                   </div>
+                  <div className="font-mono text-xs uppercase tracking-widest text-neutral-400">
+                    SEC. 0{index + 1}
+                  </div>
+                </div>
+
+                <div className="flex items-baseline gap-4 mb-4">
+                  <h3 className="text-3xl font-serif font-bold italic">
+                    {feature.title}
+                  </h3>
+                  <span className="text-[10px] font-mono uppercase tracking-widest text-[#CC0000] font-bold">
+                    {feature.highlight}
+                  </span>
                 </div>
 
-                {/* Hover effect decoration */}
-                <div className="absolute inset-0 bg-gradient-primary opacity-0 group-hover:opacity-5 transition-opacity duration-500"></div>
-              </CardContent>
-            </Card>
+                <p className="font-body text-neutral-600 leading-relaxed text-justify">
+                  {feature.description}
+                </p>
+
+                <div className="mt-8 pt-6 border-t border-dashed border-neutral-300 opacity-0 group-hover:opacity-100 transition-opacity">
+                  <span className="font-sans text-[10px] font-bold uppercase tracking-widest text-[#111111]">
+                    Learn More &rarr;
+                  </span>
+                </div>
+              </div>
+            </div>
           ))}
         </div>
       </div>
diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx
index db7016c7..9aede3de 100644
--- a/app/components/Footer.tsx
+++ b/app/components/Footer.tsx
@@ -5,121 +5,140 @@ import { LicenseNotice } from "./LicenseNotice";
 
 export function Footer() {
   return (
-    <footer id="contact" className="border-t border-border">
-      <div className="container mx-auto px-6 py-16">
-        <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
+    <footer
+      id="contact"
+      className="border-t-4 border-[#111111] bg-[#F9F9F7] newsprint-texture"
+    >
+      <div className="container mx-auto px-6 py-24">
+        <div className="grid grid-cols-1 md:grid-cols-12 gap-12">
           {/* Brand */}
-          <div className="md:col-span-2">
+          <div className="md:col-span-5 border-r border-[#111111] pr-12">
             <BrandMark
-              className="mb-4 gap-3"
-              textClassName="font-bold text-xl"
+              className="mb-6 gap-3"
+              textClassName="font-serif font-black text-2xl uppercase italic"
             />
-            <p className="text-muted-foreground mb-6 max-w-md">
-              一个由开发者自发组织的、完全免费且开放的学习社区。让每个人都能在轻松氛围下成长。
+            <p className="font-body text-neutral-600 mb-8 max-w-md text-justify leading-relaxed">
+              一个由开发者自发组织的、完全免费且开放的学习社区。我们相信通过集体协作与开放共享，可以打破技术垄断，创造一个更公平的学习环境。
             </p>
-            <div className="flex space-x-4">
+            <div className="flex space-x-2">
               <a
                 href="https://github.com/involutionhell"
                 target="_blank"
                 rel="noopener noreferrer"
-                aria-label="访问 Involution Hell 的 GitHub"
-                title="访问 GitHub"
-                className="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-card border border-border hover:bg-accent hover:scale-110 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                className="w-12 h-12 flex items-center justify-center border border-[#111111] hover:bg-[#111111] hover:text-white transition-all"
               >
-                <Github className="h-5 w-5" aria-hidden="true" />
-                <span className="sr-only">访问 GitHub</span>
+                <Github className="h-5 w-5" />
               </a>
               <a
                 href="https://discord.com/invite/6CGP73ZWbD"
                 target="_blank"
                 rel="noopener noreferrer"
-                aria-label="加入 Discord 社区"
-                title="加入 Discord"
-                className="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-card border border-border hover:bg-accent hover:scale-110 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                className="w-12 h-12 flex items-center justify-center border border-[#111111] hover:bg-[#111111] hover:text-white transition-all"
               >
-                <MessageCircle className="h-5 w-5" aria-hidden="true" />
-                <span className="sr-only">加入 Discord 社区</span>
+                <MessageCircle className="h-5 w-5" />
               </a>
             </div>
           </div>
 
-          {/* Quick Links */}
-          <div>
-            <h3 className="font-semibold mb-4">快速链接</h3>
-            <ul className="space-y-2">
-              <li>
-                <Link
-                  href="/docs/ai"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center"
-                >
-                  知识库
-                  <ExternalLink className="ml-1 h-3 w-3" aria-hidden="true" />
-                </Link>
-              </li>
-              <li>
-                <a
-                  href="#features"
-                  className="text-muted-foreground hover:text-foreground transition-colors"
-                >
-                  特点
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://www.zotero.org/groups/6053219/unsw_ai/library"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center"
-                >
-                  文献资料库
-                  <ExternalLink className="ml-1 h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a
-                  href="#community"
-                  className="text-muted-foreground hover:text-foreground transition-colors"
-                >
-                  社区
-                </a>
-              </li>
-            </ul>
-          </div>
+          {/* Navigation */}
+          <div className="md:col-span-7 grid grid-cols-2 md:grid-cols-3 gap-8">
+            <div>
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+                Archives
+              </h3>
+              <ul className="space-y-3 font-body text-sm">
+                <li>
+                  <Link
+                    href="/docs/ai"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    AI & Mathematics
+                  </Link>
+                </li>
+                <li>
+                  <Link
+                    href="/docs/computer-science"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Computer Science
+                  </Link>
+                </li>
+                <li>
+                  <Link
+                    href="/docs/CommunityShare"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Community Sharing
+                  </Link>
+                </li>
+                <li>
+                  <Link
+                    href="/docs/jobs"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Career Prep
+                  </Link>
+                </li>
+              </ul>
+            </div>
 
-          {/* Contact */}
-          <div>
-            <h3 className="font-semibold mb-4">联系我们</h3>
-            <ul className="space-y-2">
-              <li>
-                <a
-                  href="https://github.com/involutionhell/involutionhell/issues"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center"
-                >
-                  提交 Issue
-                  <ExternalLink className="ml-1 h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a
-                  href="https://discord.com/invite/6CGP73ZWbD"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-muted-foreground hover:text-foreground transition-colors flex items-center"
-                >
-                  Discord 社区
-                  <ExternalLink className="ml-1 h-3 w-3" />
-                </a>
-              </li>
-            </ul>
+            <div>
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+                Resources
+              </h3>
+              <ul className="space-y-3 font-body text-sm">
+                <li>
+                  <a
+                    href="https://www.zotero.org/groups/6053219/unsw_ai/library"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Zotero Library
+                  </a>
+                </li>
+                <li>
+                  <a
+                    href="#features"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Mission Brief
+                  </a>
+                </li>
+                <li>
+                  <a
+                    href="#community"
+                    className="hover:text-[#CC0000] transition-colors"
+                  >
+                    Network Status
+                  </a>
+                </li>
+              </ul>
+            </div>
+
+            <div className="col-span-2 md:col-span-1">
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+                Legal
+              </h3>
+              <div className="font-body text-xs text-neutral-500 leading-relaxed">
+                <p className="mb-4">Edition: Vol 1.0.0</p>
+                <p className="mb-4">Printed in the Cloud</p>
+                <LicenseNotice />
+              </div>
+            </div>
           </div>
         </div>
 
-        {/* Copyright */}
-        <div className="border-t border-border mt-12 pt-8 text-center text-muted-foreground">
-          <p>完全开源，永远免费</p>
-          <LicenseNotice className="mt-2" />
+        {/* Bottom Bar */}
+        <div className="mt-24 pt-8 border-t border-[#111111] flex flex-col md:flex-row justify-between items-center gap-4 font-mono text-[10px] uppercase tracking-widest text-neutral-400">
+          <div>
+            &copy; {new Date().getFullYear()} Involution Hell Organization
+          </div>
+          <div className="flex gap-8">
+            <span>Open Source</span>
+            <span>Free Forever</span>
+            <span>All Rights Reserved</span>
+          </div>
         </div>
       </div>
     </footer>
diff --git a/app/components/Header.tsx b/app/components/Header.tsx
index fc6f3bd4..a14dfd1a 100644
--- a/app/components/Header.tsx
+++ b/app/components/Header.tsx
@@ -16,59 +16,81 @@ export async function Header() {
       : undefined;
   console.log("session", session);
   return (
-    <header className="fixed top-0 w-full z-50 bg-background/80 backdrop-blur-lg border-b border-border">
-      <div className="container mx-auto px-6 h-16 flex items-center justify-between">
-        <BrandMark priority />
-
-        <nav className="hidden md:flex items-center gap-8">
-          <a
-            href="#features"
-            className="text-muted-foreground hover:text-foreground transition-colors"
-          >
-            特点
-          </a>
-          <a
-            href="#community"
-            className="text-muted-foreground hover:text-foreground transition-colors"
-          >
-            社区
-          </a>
-          <a
-            href="#contact"
-            className="text-muted-foreground hover:text-foreground transition-colors"
-          >
-            联系我们
-          </a>
-        </nav>
+    <header className="fixed top-0 w-full z-50 bg-[#F9F9F7] border-b border-[#111111] py-2">
+      <div className="container mx-auto px-6">
+        <div className="flex items-center justify-between border-b border-[#111111] pb-2 mb-2">
+          <div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
+            Vol. 1 | No. 128 | Beijing Edition
+          </div>
+          <BrandMark priority />
+          <div className="font-mono text-[10px] uppercase tracking-widest text-neutral-500">
+            {new Date().toLocaleDateString("en-US", {
+              month: "long",
+              day: "numeric",
+              year: "numeric",
+            })}
+          </div>
+        </div>
 
-        <div className="flex items-center gap-2">
-          {/* 扁平图标按钮：移除圆角与缩放动画 */}
-          <Button variant="ghost" size="icon" asChild className="rounded-none">
+        <div className="flex items-center justify-between h-10">
+          <nav className="hidden md:flex items-center gap-8 font-sans text-xs font-bold uppercase tracking-widest">
+            <a
+              href="#features"
+              className="hover:text-[#CC0000] transition-colors"
+            >
+              特点
+            </a>
             <a
-              href="https://github.com/involutionhell"
-              target="_blank"
-              rel="noopener noreferrer"
-              aria-label="GitHub"
+              href="#community"
+              className="hover:text-[#CC0000] transition-colors"
             >
-              <GithubIcon className="h-5 w-5" />
+              社区
             </a>
-          </Button>
-          <Button variant="ghost" size="icon" asChild className="rounded-none">
             <a
-              href="https://discord.com/invite/6CGP73ZWbD"
-              target="_blank"
-              rel="noopener noreferrer"
-              aria-label="Discord"
+              href="#contact"
+              className="hover:text-[#CC0000] transition-colors"
             >
-              <MessageCircle className="h-5 w-5" />
+              联系我们
             </a>
-          </Button>
-          <ThemeToggle />
-          {user ? (
-            <UserMenu user={user} provider={provider} />
-          ) : (
-            <SignInButton />
-          )}
+          </nav>
+
+          <div className="flex items-center gap-2">
+            <Button
+              variant="ghost"
+              size="icon"
+              asChild
+              className="rounded-none border border-transparent hover:border-[#111111] hover:bg-white"
+            >
+              <a
+                href="https://github.com/involutionhell"
+                target="_blank"
+                rel="noopener noreferrer"
+                aria-label="GitHub"
+              >
+                <GithubIcon className="h-4 w-4" />
+              </a>
+            </Button>
+            <Button
+              variant="ghost"
+              size="icon"
+              asChild
+              className="rounded-none border border-transparent hover:border-[#111111] hover:bg-white"
+            >
+              <a
+                href="https://discord.com/invite/6CGP73ZWbD"
+                target="_blank"
+                rel="noopener noreferrer"
+                aria-label="Discord"
+              >
+                <MessageCircle className="h-4 w-4" />
+              </a>
+            </Button>
+            {user ? (
+              <UserMenu user={user} provider={provider} />
+            ) : (
+              <SignInButton />
+            )}
+          </div>
         </div>
       </div>
     </header>
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
index 88588755..6a5f96fb 100644
--- a/app/components/Hero.tsx
+++ b/app/components/Hero.tsx
@@ -3,6 +3,7 @@ import ZoteroFeedLazy from "@/app/components/ZoteroFeedLazy";
 import { Contribute } from "@/app/components/Contribute";
 import Image from "next/image";
 import { ActivityTicker } from "@/app/components/ActivityTicker";
+import { cn } from "@/lib/utils";
 
 export function Hero() {
   const categories: { title: string; desc: string; href: string }[] = [
@@ -29,61 +30,103 @@ export function Hero() {
   ];
 
   return (
-    <section className="relative">
-      <div className="container relative mx-auto px-6 pt-12 pb-0 text-center">
-        {/* 首页活动轮播浮窗：桌面端右上角，移动端底部居中 */}
-        <div className="absolute right-4 top-24 z-20 hidden sm:block w-72 lg:w-80">
-          <ActivityTicker />
-        </div>
-        <div className="absolute left-1/2 bottom-6 z-20 w-[min(90vw,320px)] -translate-x-1/2 sm:hidden">
-          <ActivityTicker />
-        </div>
-        <div className="relative mx-auto max-w-5xl mt-12">
-          <Image
-            src="/mascot.webp"
-            alt="Mascot"
-            width={420}
-            height={400}
-            priority
-            loading="eager"
-            fetchPriority="high"
-            sizes="216px"
-            className="mx-auto w-auto max-h-[25vh] object-contain"
-            style={{ maxWidth: "216px", height: "auto" }}
-          />
-          <h1 className="pointer-events-none select-none text-4xl md:text-6xl font-semibold leading-tight bg-gradient-primary bg-clip-text text-transparent">
-            内卷地狱
-          </h1>
+    <section className="relative pt-32 pb-16 newsprint-texture">
+      <div className="container relative mx-auto px-6">
+        {/* Ticker - mimicking stock ticker */}
+        <div className="border-y border-[#111111] py-2 mb-12 overflow-hidden bg-neutral-100 flex items-center">
+          <div className="font-mono text-xs uppercase tracking-widest px-4 border-r border-[#111111] whitespace-nowrap">
+            Breaking News
+          </div>
+          <div className="flex-1">
+            <ActivityTicker />
+          </div>
         </div>
 
-        <div className="mx-auto max-w-4xl mt-8">
-          <p className="text-base md:text-lg text-muted-foreground">
-            一个由开发者自发组织、免费开放的学习社区。降低门槛，避免无意义内卷，专注真实进步与乐趣。
-          </p>
+        <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
+          <div className="lg:col-span-8 border-r border-[#111111] pr-8 min-h-[400px]">
+            <h1 className="text-6xl md:text-8xl lg:text-[10rem] font-serif font-black leading-[0.85] tracking-tighter mb-8 uppercase italic">
+              Involution <br /> Hell
+            </h1>
+
+            <div className="max-w-2xl">
+              <p className="text-xl md:text-2xl font-body leading-relaxed text-justify drop-cap">
+                一个由开发者自发组织、免费开放的学习社区。降低门槛，避免无意义内卷，专注真实进步与乐趣。我们相信知识不应成为枷锁，而应是通往自由的阶梯。
+              </p>
+
+              <div className="mt-12">
+                <Contribute />
+              </div>
+            </div>
+          </div>
+
+          <div className="lg:col-span-4 flex flex-col gap-8">
+            <div className="border border-[#111111] p-1 grayscale hover:grayscale-0 transition-all duration-500">
+              <Image
+                src="/mascot.webp"
+                alt="Mascot"
+                width={420}
+                height={400}
+                priority
+                className="w-full h-auto object-contain bg-neutral-200"
+              />
+              <div className="font-mono text-[10px] uppercase p-2 border-t border-[#111111] text-neutral-500">
+                Fig. 1.1 — The Spirit of Resilience
+              </div>
+            </div>
+
+            <div className="border border-[#111111] p-6 bg-[#111111] text-[#F9F9F7]">
+              <h3 className="font-serif text-2xl mb-4">Join the Resistance</h3>
+              <p className="font-body text-sm mb-6 opacity-80">
+                Connect with thousands of developers who are reclaiming their
+                passion for technology.
+              </p>
+              <button className="w-full py-3 border border-[#F9F9F7] font-sans text-xs uppercase tracking-widest hover:bg-[#F9F9F7] hover:text-[#111111] transition-all">
+                Access Archives
+              </button>
+            </div>
+          </div>
         </div>
-        {/* 投稿按钮 */}
-        <Contribute />
-        {/* Top-level directories */}
-        <div className="mt-14">
-          <div className="mb-4 text-sm text-muted-foreground">目录</div>
-          <ul className="grid gap-4 md:grid-cols-3">
-            {categories.map((c) => (
-              <li key={c.title} className="h-full">
+
+        {/* Top-level directories - Grid with shared borders */}
+        <div className="mt-16 border-t-4 border-[#111111]">
+          <div className="py-4 font-mono text-xs uppercase tracking-widest border-b border-[#111111]">
+            Classified Archives / 归档分类
+          </div>
+          <ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
+            {categories.map((c, idx) => (
+              <li
+                key={c.title}
+                className={cn(
+                  "group border-b border-[#111111] md:border-r last:border-r-0 h-full",
+                  idx % 2 === 1 && "md:border-r-0 lg:border-r",
+                  idx === 3 && "lg:border-r-0",
+                )}
+              >
                 <Link
                   href={c.href}
-                  className="flex border border-border p-5 hover:bg-accent transition-colors h-full flex-col"
+                  className="p-8 hover:bg-neutral-100 transition-colors h-full flex flex-col hard-shadow-hover"
                 >
-                  <div className="text-lg font-semibold">{c.title}</div>
-                  <p className="mt-1 text-sm text-muted-foreground flex-1">
+                  <div className="font-mono text-[10px] text-neutral-400 mb-4">
+                    00{idx + 1}
+                  </div>
+                  <div className="text-2xl font-serif font-bold mb-2 uppercase">
+                    {c.title}
+                  </div>
+                  <p className="text-sm font-body text-neutral-600 flex-1 leading-relaxed">
                     {c.desc}
                   </p>
+                  <div className="mt-6 font-sans text-[10px] uppercase tracking-widest font-bold group-hover:text-[#CC0000]">
+                    Read More &rarr;
+                  </div>
                 </Link>
               </li>
             ))}
           </ul>
         </div>
-        {/* 最新文献（Zotero，避免被 iframe 拒绝） */}
-        <ZoteroFeedLazy groupId={6053219} limit={8} />
+
+        <div className="mt-16">
+          <ZoteroFeedLazy groupId={6053219} limit={8} />
+        </div>
       </div>
     </section>
   );
diff --git a/app/components/LicenseNotice.tsx b/app/components/LicenseNotice.tsx
index 54979750..4c5fe8aa 100644
--- a/app/components/LicenseNotice.tsx
+++ b/app/components/LicenseNotice.tsx
@@ -9,49 +9,60 @@ export function LicenseNotice({ className }: LicenseNoticeProps) {
   return (
     <p
       className={cn(
-        "license-notice flex flex-wrap items-center justify-center gap-1 text-xs text-muted-foreground",
+        "license-notice flex flex-wrap items-center gap-x-1 gap-y-2 text-[10px] uppercase tracking-wider font-mono text-neutral-400",
         className,
       )}
     >
-      <a href="https://involutionhell.com">Involution Hell</a>
-      <span>© 2025 by</span>
-      <a href="https://github.com/InvolutionHell">Involution Hell Community</a>
-      <span>is licensed under</span>
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
+      <a
+        href="https://involutionhell.com"
+        className="text-neutral-500 hover:text-[#CC0000]"
+      >
+        Involution Hell
+      </a>
+      <span>&copy; 2026 by</span>
+      <a
+        href="https://github.com/InvolutionHell"
+        className="text-neutral-500 hover:text-[#CC0000]"
+      >
+        Community
+      </a>
+      <span>under</span>
+      <a
+        href="https://creativecommons.org/licenses/by-nc-sa/4.0/"
+        className="underline decoration-1 underline-offset-2"
+      >
         CC BY-NC-SA 4.0
       </a>
-      <Image
-        src="https://mirrors.creativecommons.org/presskit/icons/cc.svg"
-        alt="Creative Commons"
-        width={16}
-        height={16}
-        className="ml-[0.2em] inline-block h-4 w-4"
-        loading="lazy"
-      />
-      <Image
-        src="https://mirrors.creativecommons.org/presskit/icons/by.svg"
-        alt="Creative Commons BY"
-        width={16}
-        height={16}
-        className="ml-[0.2em] inline-block h-4 w-4"
-        loading="lazy"
-      />
-      <Image
-        src="https://mirrors.creativecommons.org/presskit/icons/nc.svg"
-        alt="Creative Commons Non-Commercial"
-        width={16}
-        height={16}
-        className="ml-[0.2em] inline-block h-4 w-4"
-        loading="lazy"
-      />
-      <Image
-        src="https://mirrors.creativecommons.org/presskit/icons/sa.svg"
-        alt="Creative Commons Share Alike"
-        width={16}
-        height={16}
-        className="ml-[0.2em] inline-block h-4 w-4"
-        loading="lazy"
-      />
+      <span className="flex items-center gap-0.5 grayscale opacity-50">
+        <Image
+          src="https://mirrors.creativecommons.org/presskit/icons/cc.svg"
+          alt="CC"
+          width={10}
+          height={10}
+          loading="lazy"
+        />
+        <Image
+          src="https://mirrors.creativecommons.org/presskit/icons/by.svg"
+          alt="BY"
+          width={10}
+          height={10}
+          loading="lazy"
+        />
+        <Image
+          src="https://mirrors.creativecommons.org/presskit/icons/nc.svg"
+          alt="NC"
+          width={10}
+          height={10}
+          loading="lazy"
+        />
+        <Image
+          src="https://mirrors.creativecommons.org/presskit/icons/sa.svg"
+          alt="SA"
+          width={10}
+          height={10}
+          loading="lazy"
+        />
+      </span>
     </p>
   );
 }
diff --git a/app/components/ZoteroFeed.tsx b/app/components/ZoteroFeed.tsx
index f36aa158..859e3ed0 100644
--- a/app/components/ZoteroFeed.tsx
+++ b/app/components/ZoteroFeed.tsx
@@ -59,52 +59,51 @@ export function ZoteroFeed({
 
   return (
     <section className="mt-16 mb-10" aria-labelledby="zotero-heading">
-      <div className="border border-border bg-background/20 backdrop-blur-sm rounded-lg p-6">
-        <div className="mb-3 flex items-baseline justify-between">
+      <div className="border border-[#111111] bg-[#F9F9F7] p-8 newsprint-texture">
+        <div className="mb-6 flex items-baseline justify-between border-b border-[#111111] pb-4">
           <h2
             id="zotero-heading"
-            className="text-xs font-semibold tracking-wide uppercase text-muted-foreground"
+            className="font-mono text-xs font-bold tracking-widest uppercase text-[#111111]"
           >
-            我们在读什么:
+            Reading List / 我们在读什么
           </h2>
           <a
             href={openUrl}
             target="_blank"
             rel="noopener noreferrer"
-            className="text-xs text-sky-600 dark:text-sky-400 hover:underline"
+            className="font-sans text-[10px] uppercase tracking-widest font-bold text-[#CC0000] hover:underline underline-offset-4"
           >
-            在 Zotero 中打开 →
+            Full Library →
           </a>
         </div>
 
         {error && (
-          <div className="border border-border p-4 text-sm text-red-600 dark:text-red-400">
-            加载失败：{error}
+          <div className="border border-[#CC0000] p-4 font-mono text-xs text-[#CC0000]">
+            ERROR LOAD_FAILED: {error}
           </div>
         )}
 
         {!items && !error && (
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[#111111]">
             {Array.from({ length: limit }).map((_, i) => (
               <div
                 key={i}
-                className="h-20 border border-border bg-transparent animate-pulse"
+                className="h-24 border-r border-b border-[#111111] bg-neutral-100 animate-pulse"
               />
             ))}
           </div>
         )}
 
         {items && (
-          <ul className="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <ul className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[#111111]">
             {items
-              // Guard against attachments/notes even if server-side filter changes
               .filter(
                 (it) =>
                   it.data?.itemType !== "attachment" &&
                   it.data?.itemType !== "note",
               )
               .filter((it) => it.data?.title && it.data.title.trim() !== "")
-              .map((it) => {
+              .map((it, idx) => {
                 const d = it.data ?? {};
                 const title = d.title!;
                 const link = d.url || it.links?.alternate?.href || openUrl;
@@ -121,54 +120,37 @@ export function ZoteroFeed({
                 const date = d.date;
                 const key = it.key;
                 const isExpanded = !!expandedAuthors[key];
-                const needsToggle =
-                  creators.length > 3 || (authors && authors.length > 80);
 
                 return (
                   <li
                     key={key}
-                    className="border border-border px-3 py-2 bg-transparent hover:bg-accent/10 transition"
+                    className="border-r border-b border-[#111111] p-6 hover:bg-neutral-100 transition group"
                   >
+                    <div className="font-mono text-[10px] text-neutral-400 mb-2">
+                      REF. {idx + 1}
+                    </div>
                     <a
                       href={link}
                       target="_blank"
                       rel="noopener noreferrer"
-                      className="font-medium text-foreground hover:underline text-sm leading-tight block"
+                      className="font-serif font-bold text-lg leading-tight block mb-3 group-hover:text-[#CC0000] transition-colors"
                     >
                       {title}
                     </a>
-                    <div className="mt-0.5 text-xs text-muted-foreground flex items-baseline gap-1 flex-wrap">
+                    <div className="text-[11px] font-body text-neutral-600 leading-relaxed text-justify">
                       {authors && (
-                        <>
-                          <span
-                            className={
-                              isExpanded
-                                ? "whitespace-normal"
-                                : "truncate overflow-hidden text-ellipsis whitespace-nowrap max-w-[calc(100%-6rem)]"
-                            }
-                            title={!isExpanded ? authors : undefined}
-                          >
-                            {authors}
-                          </span>
-                          {needsToggle && (
-                            <button
-                              type="button"
-                              onClick={() => toggleAuthors(key)}
-                              className="ml-1 shrink-0 text-muted-foreground hover:text-foreground underline-offset-2 hover:underline focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring rounded-[2px]"
-                              aria-expanded={isExpanded}
-                              aria-controls={`authors-${key}`}
-                            >
-                              {isExpanded ? "收起" : "展开"}
-                            </button>
-                          )}
-                        </>
+                        <span className={isExpanded ? "" : "line-clamp-1"}>
+                          {authors}
+                        </span>
                       )}
-                      {authors && (venue || date) && (
-                        <span className="shrink-0">·</span>
-                      )}
-                      {venue && <span className="shrink-0">{venue}</span>}
-                      {venue && date && <span className="shrink-0">·</span>}
-                      {date && <span className="shrink-0">{date}</span>}
+                      <div className="mt-2 font-mono text-[9px] uppercase tracking-wider text-neutral-500 flex gap-2">
+                        {venue && (
+                          <span className="truncate max-w-[150px]">
+                            {venue}
+                          </span>
+                        )}
+                        {date && <span>[{date}]</span>}
+                      </div>
                     </div>
                   </li>
                 );
diff --git a/app/globals.css b/app/globals.css
index 99b3c965..9cfe7b65 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -2,575 +2,122 @@
 @import "fumadocs-ui/css/neutral.css";
 @import "fumadocs-ui/css/preset.css";
 @import "tw-animate-css";
-/*
-  ---break---
-*/
-@custom-variant dark (&:is(.dark *));
 
+/* Newsprint Design System Tokens */
 @theme {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
+  --color-background: #f9f9f7;
+  --color-foreground: #111111;
+  --color-muted: #e5e5e0;
+  --color-accent: #cc0000;
+  --color-border: #111111;
+
+  --color-neutral-100: #f5f5f5;
+  --color-neutral-200: #e5e5e5;
+  --color-neutral-400: #a3a3a3;
+  --color-neutral-500: #737373;
+  --color-neutral-600: #525252;
+  --color-neutral-700: #404040;
+
+  --font-serif: "Playfair Display", "Times New Roman", serif;
+  --font-body: "Lora", Georgia, serif;
+  --font-sans: "Inter", "Helvetica Neue", sans-serif;
+  --font-mono: "JetBrains Mono", "Courier New", monospace;
+
+  --radius-none: 0px;
+  --radius-sm: 0px;
+  --radius-md: 0px;
+  --radius-lg: 0px;
+  --radius-xl: 0px;
+  --radius-2xl: 0px;
 }
 
-/*
-  The default border color has changed to `currentcolor` in Tailwind CSS v4,
-  so we've added these compatibility styles to make sure everything still
-  looks the same as it did with Tailwind CSS v3.
-
-  If we ever want to remove these styles, we need to add an explicit border
-  color utility to any element that depends on these defaults.
-*/
 @layer base {
-  *,
-  ::after,
-  ::before,
-  ::backdrop,
-  ::file-selector-button {
-    border-color: var(--color-gray-200, currentcolor);
-  }
-  body {
-    letter-spacing: var(--tracking-normal);
-  }
-  /* Center the collapse toggle within the docs sidebar */
-  #nd-sidebar [aria-label="Collapse Sidebar"] {
-    margin-top: auto;
-  }
-  .license-notice a {
-    color: var(--color-foreground);
-    text-decoration: underline;
-    text-decoration-color: currentColor;
-    text-underline-offset: 0.2em;
-  }
-  .license-notice a:visited {
-    color: var(--color-foreground);
-  }
-}
-
-@utility text-balance {
-  text-wrap: balance;
-}
-
-@layer utilities {
-  /* Subtle research-style gradients */
-  .bg-gradient-primary {
-    background-image: linear-gradient(90deg, #60a5fa 0%, #93c5fd 100%);
-  }
-  .bg-gradient-accent {
-    background-image: linear-gradient(90deg, #fca5a5 0%, #fecaca 100%);
-  }
-  .bg-gradient-secondary {
-    background-image: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
-  }
-  .shadow-glow {
-    box-shadow:
-      0 0 0 1px rgba(0, 0, 0, 0.06),
-      0 10px 20px rgba(0, 0, 0, 0.04);
-  }
-  :root {
-    --background: #ffffff;
-    --foreground: #171717;
-  }
-
-  @media (prefers-color-scheme: dark) {
-    :root {
-      --background: #0a0a0a;
-      --foreground: #ededed;
-    }
+  * {
+    border-radius: 0px !important;
+    border-color: #111111;
   }
 
   body {
-    color: var(--foreground);
-    background: var(--background);
-    font-family: Arial, Helvetica, sans-serif;
+    background-color: #f9f9f7;
+    color: #111111;
+    font-family: var(--font-body);
+    -webkit-font-smoothing: antialiased;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23111111' fill-opacity='0.04' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
   }
-}
-
-/*
-  ---break---
-*/
-
-@theme inline {
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-  --font-sans: Inter, ui-sans-serif, sans-serif, system-ui;
-  --font-mono: JetBrains Mono, monospace;
-  --font-serif: Merriweather, serif;
-  --radius: 1.25rem;
-  --tracking-tighter: calc(var(--tracking-normal) - 0.05em);
-  --tracking-tight: calc(var(--tracking-normal) - 0.025em);
-  --tracking-wide: calc(var(--tracking-normal) + 0.025em);
-  --tracking-wider: calc(var(--tracking-normal) + 0.05em);
-  --tracking-widest: calc(var(--tracking-normal) + 0.1em);
-  --tracking-normal: var(--tracking-normal);
-  --shadow-2xl: var(--shadow-2xl);
-  --shadow-xl: var(--shadow-xl);
-  --shadow-lg: var(--shadow-lg);
-  --shadow-md: var(--shadow-md);
-  --shadow: var(--shadow);
-  --shadow-sm: var(--shadow-sm);
-  --shadow-xs: var(--shadow-xs);
-  --shadow-2xs: var(--shadow-2xs);
-  --spacing: var(--spacing);
-  --letter-spacing: var(--letter-spacing);
-  --shadow-offset-y: var(--shadow-offset-y);
-  --shadow-offset-x: var(--shadow-offset-x);
-  --shadow-spread: var(--shadow-spread);
-  --shadow-blur: var(--shadow-blur);
-  --shadow-opacity: var(--shadow-opacity);
-  --color-shadow-color: var(--shadow-color);
-  --color-destructive-foreground: var(--destructive-foreground);
-}
-
-/*
-  ---break---
-*/
-
-:root {
-  --radius: 0rem;
-  /* Neutral grayscale palette for research style */
-  --background: oklch(0.98 0 0);
-  --foreground: oklch(0.25 0 0);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.25 0 0);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.25 0 0);
-  --primary: oklch(0.35 0 0);
-  --primary-foreground: oklch(0.98 0 0);
-  --secondary: oklch(0.95 0 0);
-  --secondary-foreground: oklch(0.28 0 0);
-  --muted: oklch(0.96 0 0);
-  --muted-foreground: oklch(0.5 0 0);
-  --accent: oklch(0.94 0 0);
-  --accent-foreground: oklch(0.28 0 0);
-  --destructive: oklch(0.4 0.03 25);
-  --destructive-foreground: oklch(0.98 0 0);
-  --border: oklch(0.9 0 0);
-  --input: oklch(0.9 0 0);
-  --ring: oklch(0.35 0 0);
-  /* Charts in subtle greys */
-  --chart-1: oklch(0.35 0 0);
-  --chart-2: oklch(0.5 0 0);
-  --chart-3: oklch(0.65 0 0);
-  --chart-4: oklch(0.8 0 0);
-  --chart-5: oklch(0.9 0 0);
-  --sidebar: oklch(0.98 0 0);
-  --sidebar-foreground: oklch(0.25 0 0);
-  --sidebar-primary: oklch(0.35 0 0);
-  --sidebar-primary-foreground: oklch(0.98 0 0);
-  --sidebar-accent: oklch(0.94 0 0);
-  --sidebar-accent-foreground: oklch(0.28 0 0);
-  --sidebar-border: oklch(0.9 0 0);
-  --sidebar-ring: oklch(0.35 0 0);
-  --font-sans: Inter, ui-sans-serif, sans-serif, system-ui;
-  --font-serif: Merriweather, serif;
-  --font-mono: JetBrains Mono, monospace;
-  --shadow-color: #000000;
-  --shadow-opacity: 0.06;
-  --shadow-blur: 10px;
-  --shadow-spread: -1px;
-  --shadow-offset-x: 0px;
-  --shadow-offset-y: 0px;
-  --letter-spacing: 0em;
-  --spacing: 0.25rem;
-  --shadow-2xs: 0 0 0 0 transparent;
-  --shadow-xs: 0 0 0 0 transparent;
-  --shadow-sm: 0 0 0 0 transparent;
-  --shadow: 0 0 0 0 transparent;
-  --shadow-md: 0 0 0 0 transparent;
-  --shadow-lg: 0 0 0 0 transparent;
-  --shadow-xl: 0 0 0 0 transparent;
-  --shadow-2xl: 0 0 0 0 transparent;
-  --tracking-normal: 0em;
-}
-
-.dark {
-  --background: oklch(0.2077 0.0398 265.7549);
-  --foreground: oklch(0.9288 0.0126 255.5078);
-  --card: oklch(0.2795 0.0368 260.031);
-  --card-foreground: oklch(0.9288 0.0126 255.5078);
-  --popover: oklch(0.2795 0.0368 260.031);
-  --popover-foreground: oklch(0.9288 0.0126 255.5078);
-  --primary: oklch(0.6801 0.1583 276.9349);
-  --primary-foreground: oklch(0.2077 0.0398 265.7549);
-  --secondary: oklch(0.3351 0.0331 260.912);
-  --secondary-foreground: oklch(0.8717 0.0093 258.3382);
-  --muted: oklch(0.2795 0.0368 260.031);
-  --muted-foreground: oklch(0.7137 0.0192 261.3246);
-  --accent: oklch(0.3729 0.0306 259.7328);
-  --accent-foreground: oklch(0.8717 0.0093 258.3382);
-  --destructive: oklch(0.6368 0.2078 25.3313);
-  --border: oklch(0.4461 0.0263 256.8018);
-  --input: oklch(0.4461 0.0263 256.8018);
-  --ring: oklch(0.6801 0.1583 276.9349);
-  --chart-1: oklch(0.6801 0.1583 276.9349);
-  --chart-2: oklch(0.5854 0.2041 277.1173);
-  --chart-3: oklch(0.5106 0.2301 276.9656);
-  --chart-4: oklch(0.4568 0.2146 277.0229);
-  --chart-5: oklch(0.3984 0.1773 277.3662);
-  --sidebar: oklch(0.2795 0.0368 260.031);
-  --sidebar-foreground: oklch(0.9288 0.0126 255.5078);
-  --sidebar-primary: oklch(0.6801 0.1583 276.9349);
-  --sidebar-primary-foreground: oklch(0.2077 0.0398 265.7549);
-  --sidebar-accent: oklch(0.3729 0.0306 259.7328);
-  --sidebar-accent-foreground: oklch(0.8717 0.0093 258.3382);
-  --sidebar-border: oklch(0.4461 0.0263 256.8018);
-  --sidebar-ring: oklch(0.6801 0.1583 276.9349);
-  --destructive-foreground: oklch(0.2077 0.0398 265.7549);
-  --radius: 1.25rem;
-  --font-sans: Inter, ui-sans-serif, sans-serif, system-ui;
-  --font-serif: Merriweather, serif;
-  --font-mono: JetBrains Mono, monospace;
-  --shadow-color: #1a1a1a;
-  --shadow-opacity: 0.1;
-  --shadow-blur: 15px;
-  --shadow-spread: -1px;
-  --shadow-offset-x: 0px;
-  --shadow-offset-y: 0px;
-  --letter-spacing: 0em;
-  --spacing: 0.25rem;
-  --shadow-2xs: 0px 0px 15px -1px hsl(0 0% 10.1961% / 0.05);
-  --shadow-xs: 0px 0px 15px -1px hsl(0 0% 10.1961% / 0.05);
-  --shadow-sm:
-    0px 0px 15px -1px hsl(0 0% 10.1961% / 0.1),
-    0px 1px 2px -2px hsl(0 0% 10.1961% / 0.1);
-  --shadow:
-    0px 0px 15px -1px hsl(0 0% 10.1961% / 0.1),
-    0px 1px 2px -2px hsl(0 0% 10.1961% / 0.1);
-  --shadow-md:
-    0px 0px 15px -1px hsl(0 0% 10.1961% / 0.1),
-    0px 2px 4px -2px hsl(0 0% 10.1961% / 0.1);
-  --shadow-lg:
-    0px 0px 15px -1px hsl(0 0% 10.1961% / 0.1),
-    0px 4px 6px -2px hsl(0 0% 10.1961% / 0.1);
-  --shadow-xl:
-    0px 0px 15px -1px hsl(0 0% 10.1961% / 0.1),
-    0px 8px 10px -2px hsl(0 0% 10.1961% / 0.1);
-  --shadow-2xl: 0px 0px 15px -1px hsl(0 0% 10.1961% / 0.25);
-}
 
-/*
-  ---break---
-*/
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-family: var(--font-serif);
+    font-weight: 900;
+    line-height: 0.9;
+    letter-spacing: -0.05em;
   }
 }
 
-/* Global animated site backgrounds (sky for light, stars for dark) */
 @layer utilities {
-  .site-bg {
-    position: fixed;
-    inset: 0;
-    z-index: 0;
-    pointer-events: none;
-    overflow: hidden;
-  }
-
-  /* Light mode sky */
-  .site-bg--sky {
-    display: block;
-    /* Stronger blue sky */
-    background: linear-gradient(
-      180deg,
-      #cfe8ff 0%,
-      #bfe1ff 40%,
-      #eaf6ff 70%,
-      #ffffff 100%
-    );
+  .newsprint-texture {
+    position: relative;
   }
-  /* Cloud layers using images, subtle parallax */
-  .site-bg--sky::before,
-  .site-bg--sky::after {
-    content: "";
-    position: absolute;
-    left: -20vw;
-    right: -20vw;
-    pointer-events: none;
-    background-repeat: repeat-x;
-    background-position: 0 center;
-  }
-  .site-bg--sky::before {
-    top: 8vh;
-    height: 26vh;
-    opacity: 0.25;
-    background-image: url("/cloud_2.png");
-    background-size: 900px auto;
-    animation: clouds-drift 60s linear infinite;
-  }
-  .site-bg--sky::after {
-    top: 38vh;
-    height: 22vh;
-    opacity: 0.18;
-    background-image: url("/cloud_2.png");
-    background-size:
-      700px auto,
-      1100px auto;
-    background-position:
-      0 center,
-      200px center;
-    animation: clouds-drift-slow 180s linear infinite;
-  }
-
-  @keyframes clouds-drift {
-    0% {
-      transform: translateX(0);
-    }
-    100% {
-      transform: translateX(-50%);
-    }
-  }
-  @keyframes clouds-drift-slow {
-    0% {
-      transform: translateX(0);
-    }
-    100% {
-      transform: translateX(-35%);
-    }
-  }
-
-  /* Dark mode stars */
-  .site-bg--stars {
-    display: none;
-    background-color: #000000;
-  }
-  .site-bg--stars::before,
-  .site-bg--stars::after {
+  .newsprint-texture::before {
     content: "";
     position: absolute;
     inset: 0;
-    background-repeat: repeat;
-  }
-  .site-bg--stars::before {
-    opacity: 0.7;
     background-image:
-      radial-gradient(
-        1px 1px at 10px 20px,
-        rgba(255, 255, 255, 0.9) 50%,
-        transparent 51%
-      ),
-      radial-gradient(
-        1px 1px at 130px 80px,
-        rgba(186, 214, 255, 0.9) 50%,
-        transparent 51%
-      ),
-      radial-gradient(
-        1px 1px at 60px 140px,
-        rgba(255, 210, 210, 0.9) 50%,
-        transparent 51%
-      );
-    background-size: 220px 220px;
-    animation: stars-drift 120s linear infinite;
-  }
-  .site-bg--stars::after {
+      linear-gradient(0deg, transparent 98%, rgba(0, 0, 0, 0.02) 100%),
+      linear-gradient(90deg, transparent 98%, rgba(0, 0, 0, 0.02) 100%);
+    background-size: 3px 3px;
+    pointer-events: none;
     opacity: 0.5;
-    background-image:
-      radial-gradient(
-        1.5px 1.5px at 50px 30px,
-        rgba(255, 255, 255, 0.8) 50%,
-        transparent 51%
-      ),
-      radial-gradient(
-        2px 2px at 120px 160px,
-        rgba(200, 220, 255, 0.8) 50%,
-        transparent 51%
-      ),
-      radial-gradient(
-        1.5px 1.5px at 180px 100px,
-        rgba(255, 220, 220, 0.8) 50%,
-        transparent 51%
-      );
-    background-size: 320px 320px;
-    animation: stars-drift 180s linear infinite reverse;
   }
 
-  @keyframes stars-drift {
-    0% {
-      transform: translate3d(0, 0, 0);
-    }
-    100% {
-      transform: translate3d(-50%, 0, 0);
-    }
+  .hard-shadow-hover:hover {
+    box-shadow: 4px 4px 0px 0px #111111;
+    transform: translate(-2px, -2px);
+    transition: all 0.2s ease-out;
   }
 
-  /* Toggle by theme */
-  .dark .site-bg--stars {
-    display: block;
-  }
-  .dark .site-bg--sky {
-    display: none;
+  .halftone {
+    background-image: radial-gradient(#000 1px, transparent 1px);
+    background-size: 16px 16px;
+    opacity: 0.1;
   }
 
-  /* Docs: prefer solid background in light mode (hide sky) */
-  html.docs-route .site-bg.site-bg--sky {
-    display: none;
+  .text-justify {
+    text-align: justify;
   }
-}
-
-/* ========================================
-   Milkdown 编辑器样式优化
-   ======================================== */
-
-/* 编辑器容器样式 */
-.milkdown {
-  @apply w-full;
-}
-
-/* 编辑器主体 */
-.milkdown .editor {
-  @apply min-h-[500px] p-4 outline-none;
-  font-family: var(--font-geist-sans), sans-serif;
-}
-
-/* 编辑器焦点状态 */
-.milkdown .editor:focus,
-.milkdown .editor:focus-visible {
-  @apply outline-none ring-0;
-}
-
-/* Markdown 元素样式 */
-.milkdown .paragraph {
-  @apply my-3 leading-7;
-}
-
-.milkdown h1,
-.milkdown h2,
-.milkdown h3,
-.milkdown h4,
-.milkdown h5,
-.milkdown h6 {
-  @apply font-bold mt-6 mb-4;
-  font-family: var(--font-geist-sans), sans-serif;
-}
-
-.milkdown h1 {
-  @apply text-3xl;
-}
-.milkdown h2 {
-  @apply text-2xl;
-}
-.milkdown h3 {
-  @apply text-xl;
-}
-.milkdown h4 {
-  @apply text-lg;
-}
-
-.milkdown ul,
-.milkdown ol {
-  @apply my-4 pl-6;
-}
-
-.milkdown li {
-  @apply my-2;
-}
-
-.milkdown code {
-  @apply px-1.5 py-0.5 rounded bg-muted text-sm font-mono;
-}
 
-.milkdown pre {
-  @apply my-4 p-4 rounded-lg bg-muted overflow-x-auto;
-}
-
-.milkdown pre code {
-  @apply p-0 bg-transparent;
-}
-
-.milkdown blockquote {
-  @apply my-4 pl-4 border-l-4 border-primary/30 italic text-muted-foreground;
-}
-
-.milkdown a {
-  @apply text-primary underline underline-offset-2 hover:text-primary/80;
-}
-
-.milkdown img {
-  @apply my-4 rounded-lg max-w-full h-auto;
-}
-
-.milkdown hr {
-  @apply my-6 border-border;
-}
-
-.milkdown table {
-  @apply my-4 w-full border-collapse;
+  .drop-cap::first-letter {
+    float: left;
+    font-size: 5rem;
+    line-height: 1;
+    font-family: var(--font-serif);
+    margin-right: 0.5rem;
+    color: #cc0000;
+  }
 }
 
-.milkdown th,
-.milkdown td {
-  @apply border border-border px-4 py-2;
+/* Force Light Mode */
+:root {
+  --background: #f9f9f7;
+  --foreground: #111111;
 }
 
-.milkdown th {
-  @apply bg-muted font-semibold;
+.dark {
+  --background: #f9f9f7;
+  --foreground: #111111;
 }
 
-/* Dark mode 优化 */
-@media (prefers-color-scheme: dark) {
-  .dark .milkdown .editor {
-    @apply text-foreground;
-  }
-
-  .dark .milkdown code {
-    @apply bg-muted/50;
-  }
-
-  .dark .milkdown pre {
-    @apply bg-muted/30;
-  }
+/* Override Fumadocs defaults to match Newsprint */
+.nd-sidebar {
+  border-radius: 0px !important;
+  border-right: 1px solid #111111 !important;
 }
 
-/* 响应式优化 */
-@media (max-width: 768px) {
-  .milkdown .editor {
-    @apply p-3 text-sm;
-  }
-
-  .milkdown h1 {
-    @apply text-2xl;
-  }
-  .milkdown h2 {
-    @apply text-xl;
-  }
-  .milkdown h3 {
-    @apply text-lg;
-  }
+.nd-nav {
+  border-bottom: 1px solid #111111 !important;
+  background-color: #f9f9f7 !important;
 }
diff --git a/app/layout.tsx b/app/layout.tsx
index 8090c61b..c2984654 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -125,6 +125,13 @@ export default function RootLayout({
   return (
     <html lang="zh-CN" suppressHydrationWarning>
       <head>
+        <style
+          dangerouslySetInnerHTML={{
+            __html: `
+          @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400&family=Lora:ital,wght@0,400;0,600;1,400&display=block');
+        `,
+          }}
+        />
         {/* 预连接：缩短关键请求链 */}
         <link rel="preconnect" href="https://www.google-analytics.com" />
         {/* Preload the decorative sky texture so the LCP background image is discovered immediately */}
@@ -160,10 +167,6 @@ export default function RootLayout({
         suppressHydrationWarning
         className={`${geistSans.variable} ${geistMono.variable} antialiased`}
       >
-        {/* 全局装饰背景（不参与可访问性） */}
-        <div className="site-bg site-bg--sky" aria-hidden />
-        <div className="site-bg site-bg--stars" aria-hidden />
-
         <RootProvider
           search={{
             // 使用静态索引，兼容 next export 与本地开发
diff --git a/tsconfig.json b/tsconfig.json
index 9ff3dec6..714258fb 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -11,7 +11,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
     "plugins": [
       {
@@ -24,6 +24,12 @@
     },
     "target": "ES2017"
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
   "exclude": ["node_modules"]
 }

From c56a9151303c67f9c3909fa7a54969cb3dba432f Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 02:38:06 +0800
Subject: [PATCH 02/13] =?UTF-8?q?chore:=20=E5=8A=A0=E5=85=A5=E9=BB=91?=
 =?UTF-8?q?=E5=A4=9C=E6=A8=A1=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ActivityTicker.tsx |   7 +-
 app/components/Community.tsx      |  59 +++++++------
 app/components/Contribute.tsx     |   6 +-
 app/components/Features.tsx       |  27 +++---
 app/components/Footer.tsx         |  24 ++---
 app/components/Header.tsx         |  11 +--
 app/components/Hero.tsx           |  36 ++++----
 app/components/ZoteroFeed.tsx     |  18 ++--
 app/globals.css                   | 142 ++++++++++++++++++++++++------
 app/layout.tsx                    |   1 +
 10 files changed, 216 insertions(+), 115 deletions(-)

diff --git a/app/components/ActivityTicker.tsx b/app/components/ActivityTicker.tsx
index 84a97909..c2651e16 100644
--- a/app/components/ActivityTicker.tsx
+++ b/app/components/ActivityTicker.tsx
@@ -105,16 +105,17 @@ export function ActivityTicker({ className }: ActivityTickerProps) {
         </span>
       </div>
 
-      <div className="ml-auto flex border-l border-[#111111] h-full">
+      <div className="ml-auto flex border-l border-[var(--foreground)] h-full">
         <button
           onClick={handlePrev}
-          className="px-3 hover:bg-[#111111] hover:text-white transition-colors border-r border-[#111111]"
+          className="px-3 hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)] transition-colors border-r border-[var(--foreground)]"
         >
           <ChevronLeft className="h-3 w-3" />
         </button>
+
         <button
           onClick={handleNext}
-          className="px-3 hover:bg-[#111111] hover:text-white transition-colors"
+          className="px-3 hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)] transition-colors"
         >
           <ChevronRight className="h-3 w-3" />
         </button>
diff --git a/app/components/Community.tsx b/app/components/Community.tsx
index cbd43dbf..916c43de 100644
--- a/app/components/Community.tsx
+++ b/app/components/Community.tsx
@@ -12,11 +12,11 @@ export function Community() {
   return (
     <section
       id="community"
-      className="py-24 border-t border-[#111111] newsprint-texture"
+      className="py-24 border-t border-[var(--foreground)] newsprint-texture transition-colors duration-300"
     >
       <div className="container mx-auto px-6">
-        <div className="flex flex-col lg:flex-row justify-between items-baseline mb-16 pb-4 border-b border-[#111111]">
-          <h2 className="text-6xl md:text-8xl font-serif font-black uppercase italic tracking-tighter">
+        <div className="flex flex-col lg:flex-row justify-between items-baseline mb-16 pb-4 border-b border-[var(--foreground)] transition-colors duration-300">
+          <h2 className="text-6xl md:text-8xl font-serif font-black uppercase italic tracking-tighter text-[var(--foreground)]">
             Community <br /> Archives
           </h2>
           <div className="font-mono text-xs uppercase tracking-widest text-neutral-500 max-w-sm text-right">
@@ -25,11 +25,16 @@ export function Community() {
           </div>
         </div>
 
-        {/* Main CTA Section - Inverted */}
-        <div className="mb-16 border-4 border-[#111111] bg-[#111111] text-[#F9F9F7] p-12 lg:p-24 relative overflow-hidden">
+        {/* Main CTA Section - Inverted (Light Mode) / Normal (Dark Mode) 
+                Design Decision: Keep high contrast.
+                Light Mode: Black Box, White Text.
+                Dark Mode: White Box, Black Text? Or Keep Black Box with White Border?
+                Let's go with Inverted relative to theme.
+            */}
+        <div className="mb-16 border-4 border-[var(--foreground)] bg-[var(--foreground)] text-[var(--background)] p-12 lg:p-24 relative overflow-hidden transition-colors duration-300">
           <div className="relative z-10 max-w-3xl mx-auto text-center">
-            <div className="inline-block border border-[#F9F9F7] p-4 mb-8">
-              <BookOpen className="h-12 w-12 text-[#F9F9F7]" />
+            <div className="inline-block border border-[var(--background)] p-4 mb-8">
+              <BookOpen className="h-12 w-12 text-[var(--background)]" />
             </div>
             <h3 className="text-4xl md:text-6xl font-serif font-bold italic mb-6">
               内卷知识库
@@ -40,7 +45,7 @@ export function Community() {
             <Button
               variant="outline"
               asChild
-              className="bg-transparent border-[#F9F9F7] text-[#F9F9F7] hover:bg-[#F9F9F7] hover:text-[#111111] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
+              className="bg-transparent border-[var(--background)] text-[var(--background)] hover:bg-[var(--background)] hover:text-[var(--foreground)] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
             >
               <a href="docs/ai" target="_blank" rel="noopener noreferrer">
                 Access Archives <ExternalLink className="ml-4 h-5 w-5" />
@@ -52,22 +57,22 @@ export function Community() {
         </div>
 
         {/* Action Cards Grid */}
-        <div className="grid grid-cols-1 md:grid-cols-3 border-t border-l border-[#111111]">
-          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
-            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
-              <Github className="h-6 w-6" />
+        <div className="grid grid-cols-1 md:grid-cols-3 border-t border-l border-[var(--foreground)] transition-colors duration-300">
+          <div className="border-r border-b border-[var(--foreground)] p-12 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[var(--foreground)] flex items-center justify-center group-hover:bg-[var(--foreground)] group-hover:text-[var(--background)] transition-all">
+              <Github className="h-6 w-6 text-[var(--foreground)] group-hover:text-[var(--background)]" />
             </div>
-            <h3 className="text-2xl font-serif font-bold italic mb-4">
+            <h3 className="text-2xl font-serif font-bold italic mb-4 text-[var(--foreground)]">
               GitHub 仓库
             </h3>
-            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+            <p className="font-body text-neutral-600 dark:text-neutral-400 mb-8 leading-relaxed">
               查看源代码，提交 Issue，参与项目讨论。每一个 Commit
               都是对社区的贡献。
             </p>
             <Button
               variant="outline"
               asChild
-              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+              className="w-full border-[var(--foreground)] text-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] font-sans text-[10px] uppercase tracking-widest font-bold"
             >
               <a
                 href="https://github.com/involutionhell"
@@ -79,20 +84,20 @@ export function Community() {
             </Button>
           </div>
 
-          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
-            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
-              <MessageCircle className="h-6 w-6" />
+          <div className="border-r border-b border-[var(--foreground)] p-12 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[var(--foreground)] flex items-center justify-center group-hover:bg-[var(--foreground)] group-hover:text-[var(--background)] transition-all">
+              <MessageCircle className="h-6 w-6 text-[var(--foreground)] group-hover:text-[var(--background)]" />
             </div>
-            <h3 className="text-2xl font-serif font-bold italic mb-4">
+            <h3 className="text-2xl font-serif font-bold italic mb-4 text-[var(--foreground)]">
               Discord 社区
             </h3>
-            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+            <p className="font-body text-neutral-600 dark:text-neutral-400 mb-8 leading-relaxed">
               实时交流，分享经验，结识志同道合的朋友。打破孤岛，共同成长。
             </p>
             <Button
               variant="outline"
               asChild
-              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+              className="w-full border-[var(--foreground)] text-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] font-sans text-[10px] uppercase tracking-widest font-bold"
             >
               <a
                 href="https://discord.com/invite/6CGP73ZWbD"
@@ -104,20 +109,20 @@ export function Community() {
             </Button>
           </div>
 
-          <div className="border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors group">
-            <div className="mb-8 w-12 h-12 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all">
-              <GraduationCap className="h-6 w-6" />
+          <div className="border-r border-b border-[var(--foreground)] p-12 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition-colors group">
+            <div className="mb-8 w-12 h-12 border border-[var(--foreground)] flex items-center justify-center group-hover:bg-[var(--foreground)] group-hover:text-[var(--background)] transition-all">
+              <GraduationCap className="h-6 w-6 text-[var(--foreground)] group-hover:text-[var(--background)]" />
             </div>
-            <h3 className="text-2xl font-serif font-bold italic mb-4">
+            <h3 className="text-2xl font-serif font-bold italic mb-4 text-[var(--foreground)]">
               文献资料
             </h3>
-            <p className="font-body text-neutral-600 mb-8 leading-relaxed">
+            <p className="font-body text-neutral-600 dark:text-neutral-400 mb-8 leading-relaxed">
               访问我们在 Zotero 的文献库，获取精选学术资源。连接前沿科技。
             </p>
             <Button
               variant="outline"
               asChild
-              className="w-full border-[#111111] hover:bg-[#111111] hover:text-white font-sans text-[10px] uppercase tracking-widest font-bold"
+              className="w-full border-[var(--foreground)] text-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] font-sans text-[10px] uppercase tracking-widest font-bold"
             >
               <a
                 href="https://www.zotero.org/groups/6053219/unsw_ai/library"
diff --git a/app/components/Contribute.tsx b/app/components/Contribute.tsx
index 5cca77cd..9653cdb1 100644
--- a/app/components/Contribute.tsx
+++ b/app/components/Contribute.tsx
@@ -161,8 +161,8 @@ export function Contribute() {
             size="lg"
             className="relative isolate w-full sm:w-auto h-20 px-14 rounded-none
                      text-2xl font-serif font-black uppercase italic tracking-tighter
-                     bg-[#111111] text-[#F9F9F7] border border-[#111111]
-                     hover:bg-[#F9F9F7] hover:text-[#111111] transition-all duration-300"
+                     bg-[var(--foreground)] text-[var(--background)] border border-[var(--foreground)]
+                     hover:bg-[var(--background)] hover:text-[var(--foreground)] transition-all duration-300"
             onClick={(event) => {
               event.preventDefault();
               router.push("/editor");
@@ -181,7 +181,7 @@ export function Contribute() {
           rel="noopener noreferrer"
           aria-label="查看投稿指南"
           title="查看投稿指南"
-          className="absolute top-0 right-0 flex h-10 w-10 translate-x-1/2 -translate-y-1/2 items-center justify-center border border-[#111111] bg-[#F9F9F7] text-[#111111] font-mono hover:bg-[#CC0000] hover:text-white transition-colors z-20"
+          className="absolute top-0 right-0 flex h-10 w-10 translate-x-1/2 -translate-y-1/2 items-center justify-center border border-[var(--foreground)] bg-[var(--background)] text-[var(--foreground)] font-mono hover:bg-[#CC0000] hover:text-white transition-colors z-20"
         >
           <span className="text-sm font-bold">?</span>
           <span className="sr-only">查看投稿指南</span>
diff --git a/app/components/Features.tsx b/app/components/Features.tsx
index 98ea844d..26b1e7f6 100644
--- a/app/components/Features.tsx
+++ b/app/components/Features.tsx
@@ -39,28 +39,31 @@ export function Features() {
   ];
 
   return (
-    <section id="features" className="py-24 border-t border-[#111111]">
+    <section
+      id="features"
+      className="py-24 border-t border-[var(--foreground)] transition-colors duration-300"
+    >
       <div className="container mx-auto px-6">
-        <div className="flex flex-col lg:flex-row gap-12 items-end mb-16 pb-8 border-b-4 border-[#111111]">
-          <h2 className="text-6xl md:text-8xl font-serif font-black italic uppercase leading-none tracking-tighter">
+        <div className="flex flex-col lg:flex-row gap-12 items-end mb-16 pb-8 border-b-4 border-[var(--foreground)] transition-colors duration-300">
+          <h2 className="text-6xl md:text-8xl font-serif font-black italic uppercase leading-none tracking-tighter text-[var(--foreground)]">
             Mission <br /> Statement
           </h2>
-          <p className="text-xl font-body text-neutral-600 max-w-2xl text-justify mb-2">
+          <p className="text-xl font-body text-neutral-600 dark:text-neutral-400 max-w-2xl text-justify mb-2">
             我们致力于创造一个真正属于开发者的学习环境，让每个人都能在这里获得成长。在这里，知识是流动的，门槛是不存在的，而内卷是被鄙视的。
           </p>
         </div>
 
-        <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-l border-t border-[#111111]">
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-l border-t border-[var(--foreground)] transition-colors duration-300">
           {features.map((feature, index) => (
             <div
               key={index}
-              className="group relative border-r border-b border-[#111111] p-12 hover:bg-neutral-100 transition-colors"
+              className="group relative border-r border-b border-[var(--foreground)] p-12 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition-colors"
             >
               <div className="flex flex-col h-full">
                 <div className="flex items-center justify-between mb-8">
-                  <div className="w-16 h-16 border border-[#111111] flex items-center justify-center group-hover:bg-[#111111] group-hover:text-white transition-all duration-300">
+                  <div className="w-16 h-16 border border-[var(--foreground)] flex items-center justify-center group-hover:bg-[var(--foreground)] group-hover:text-[var(--background)] transition-all duration-300">
                     {/* Simplified icon styling */}
-                    <div className="p-0 text-[#111111] group-hover:text-white">
+                    <div className="p-0 text-[var(--foreground)] group-hover:text-[var(--background)]">
                       {React.cloneElement(feature.icon as React.ReactElement, {
                         className: "h-8 w-8",
                       })}
@@ -72,7 +75,7 @@ export function Features() {
                 </div>
 
                 <div className="flex items-baseline gap-4 mb-4">
-                  <h3 className="text-3xl font-serif font-bold italic">
+                  <h3 className="text-3xl font-serif font-bold italic text-[var(--foreground)]">
                     {feature.title}
                   </h3>
                   <span className="text-[10px] font-mono uppercase tracking-widest text-[#CC0000] font-bold">
@@ -80,12 +83,12 @@ export function Features() {
                   </span>
                 </div>
 
-                <p className="font-body text-neutral-600 leading-relaxed text-justify">
+                <p className="font-body text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
                   {feature.description}
                 </p>
 
-                <div className="mt-8 pt-6 border-t border-dashed border-neutral-300 opacity-0 group-hover:opacity-100 transition-opacity">
-                  <span className="font-sans text-[10px] font-bold uppercase tracking-widest text-[#111111]">
+                <div className="mt-8 pt-6 border-t border-dashed border-neutral-300 dark:border-neutral-700 opacity-0 group-hover:opacity-100 transition-opacity">
+                  <span className="font-sans text-[10px] font-bold uppercase tracking-widest text-[var(--foreground)]">
                     Learn More &rarr;
                   </span>
                 </div>
diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx
index 9aede3de..c3193b48 100644
--- a/app/components/Footer.tsx
+++ b/app/components/Footer.tsx
@@ -7,17 +7,17 @@ export function Footer() {
   return (
     <footer
       id="contact"
-      className="border-t-4 border-[#111111] bg-[#F9F9F7] newsprint-texture"
+      className="border-t-4 border-[var(--foreground)] bg-[var(--background)] newsprint-texture transition-colors duration-300"
     >
       <div className="container mx-auto px-6 py-24">
         <div className="grid grid-cols-1 md:grid-cols-12 gap-12">
           {/* Brand */}
-          <div className="md:col-span-5 border-r border-[#111111] pr-12">
+          <div className="md:col-span-5 border-r border-[var(--foreground)] pr-12 transition-colors duration-300">
             <BrandMark
               className="mb-6 gap-3"
-              textClassName="font-serif font-black text-2xl uppercase italic"
+              textClassName="font-serif font-black text-2xl uppercase italic text-[var(--foreground)]"
             />
-            <p className="font-body text-neutral-600 mb-8 max-w-md text-justify leading-relaxed">
+            <p className="font-body text-neutral-600 dark:text-neutral-400 mb-8 max-w-md text-justify leading-relaxed">
               一个由开发者自发组织的、完全免费且开放的学习社区。我们相信通过集体协作与开放共享，可以打破技术垄断，创造一个更公平的学习环境。
             </p>
             <div className="flex space-x-2">
@@ -25,7 +25,7 @@ export function Footer() {
                 href="https://github.com/involutionhell"
                 target="_blank"
                 rel="noopener noreferrer"
-                className="w-12 h-12 flex items-center justify-center border border-[#111111] hover:bg-[#111111] hover:text-white transition-all"
+                className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
               >
                 <Github className="h-5 w-5" />
               </a>
@@ -33,7 +33,7 @@ export function Footer() {
                 href="https://discord.com/invite/6CGP73ZWbD"
                 target="_blank"
                 rel="noopener noreferrer"
-                className="w-12 h-12 flex items-center justify-center border border-[#111111] hover:bg-[#111111] hover:text-white transition-all"
+                className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
               >
                 <MessageCircle className="h-5 w-5" />
               </a>
@@ -43,10 +43,10 @@ export function Footer() {
           {/* Navigation */}
           <div className="md:col-span-7 grid grid-cols-2 md:grid-cols-3 gap-8">
             <div>
-              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[var(--foreground)] pb-2 text-[var(--foreground)]">
                 Archives
               </h3>
-              <ul className="space-y-3 font-body text-sm">
+              <ul className="space-y-3 font-body text-sm text-[var(--foreground)]">
                 <li>
                   <Link
                     href="/docs/ai"
@@ -83,10 +83,10 @@ export function Footer() {
             </div>
 
             <div>
-              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[var(--foreground)] pb-2 text-[var(--foreground)]">
                 Resources
               </h3>
-              <ul className="space-y-3 font-body text-sm">
+              <ul className="space-y-3 font-body text-sm text-[var(--foreground)]">
                 <li>
                   <a
                     href="https://www.zotero.org/groups/6053219/unsw_ai/library"
@@ -117,7 +117,7 @@ export function Footer() {
             </div>
 
             <div className="col-span-2 md:col-span-1">
-              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[#111111] pb-2">
+              <h3 className="font-sans text-xs font-bold uppercase tracking-widest mb-6 border-b border-[var(--foreground)] pb-2 text-[var(--foreground)]">
                 Legal
               </h3>
               <div className="font-body text-xs text-neutral-500 leading-relaxed">
@@ -130,7 +130,7 @@ export function Footer() {
         </div>
 
         {/* Bottom Bar */}
-        <div className="mt-24 pt-8 border-t border-[#111111] flex flex-col md:flex-row justify-between items-center gap-4 font-mono text-[10px] uppercase tracking-widest text-neutral-400">
+        <div className="mt-24 pt-8 border-t border-[var(--foreground)] flex flex-col md:flex-row justify-between items-center gap-4 font-mono text-[10px] uppercase tracking-widest text-neutral-400">
           <div>
             &copy; {new Date().getFullYear()} Involution Hell Organization
           </div>
diff --git a/app/components/Header.tsx b/app/components/Header.tsx
index a14dfd1a..6e95d162 100644
--- a/app/components/Header.tsx
+++ b/app/components/Header.tsx
@@ -16,9 +16,9 @@ export async function Header() {
       : undefined;
   console.log("session", session);
   return (
-    <header className="fixed top-0 w-full z-50 bg-[#F9F9F7] border-b border-[#111111] py-2">
+    <header className="fixed top-0 w-full z-50 bg-[var(--background)] border-b border-[var(--foreground)] py-2 transition-colors duration-300">
       <div className="container mx-auto px-6">
-        <div className="flex items-center justify-between border-b border-[#111111] pb-2 mb-2">
+        <div className="flex items-center justify-between border-b border-[var(--foreground)] pb-2 mb-2 transition-colors duration-300">
           <div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
             Vol. 1 | No. 128 | Beijing Edition
           </div>
@@ -33,7 +33,7 @@ export async function Header() {
         </div>
 
         <div className="flex items-center justify-between h-10">
-          <nav className="hidden md:flex items-center gap-8 font-sans text-xs font-bold uppercase tracking-widest">
+          <nav className="hidden md:flex items-center gap-8 font-sans text-xs font-bold uppercase tracking-widest text-[var(--foreground)]">
             <a
               href="#features"
               className="hover:text-[#CC0000] transition-colors"
@@ -59,7 +59,7 @@ export async function Header() {
               variant="ghost"
               size="icon"
               asChild
-              className="rounded-none border border-transparent hover:border-[#111111] hover:bg-white"
+              className="rounded-none border border-transparent hover:border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)]"
             >
               <a
                 href="https://github.com/involutionhell"
@@ -74,7 +74,7 @@ export async function Header() {
               variant="ghost"
               size="icon"
               asChild
-              className="rounded-none border border-transparent hover:border-[#111111] hover:bg-white"
+              className="rounded-none border border-transparent hover:border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)]"
             >
               <a
                 href="https://discord.com/invite/6CGP73ZWbD"
@@ -85,6 +85,7 @@ export async function Header() {
                 <MessageCircle className="h-4 w-4" />
               </a>
             </Button>
+            <ThemeToggle />
             {user ? (
               <UserMenu user={user} provider={provider} />
             ) : (
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
index 6a5f96fb..1f3ef3df 100644
--- a/app/components/Hero.tsx
+++ b/app/components/Hero.tsx
@@ -30,11 +30,11 @@ export function Hero() {
   ];
 
   return (
-    <section className="relative pt-32 pb-16 newsprint-texture">
+    <section className="relative pt-32 pb-16 newsprint-texture transition-colors duration-300">
       <div className="container relative mx-auto px-6">
         {/* Ticker - mimicking stock ticker */}
-        <div className="border-y border-[#111111] py-2 mb-12 overflow-hidden bg-neutral-100 flex items-center">
-          <div className="font-mono text-xs uppercase tracking-widest px-4 border-r border-[#111111] whitespace-nowrap">
+        <div className="border-y border-[var(--foreground)] py-2 mb-12 overflow-hidden bg-neutral-100 dark:bg-neutral-900 flex items-center transition-colors duration-300">
+          <div className="font-mono text-xs uppercase tracking-widest px-4 border-r border-[var(--foreground)] whitespace-nowrap text-[var(--foreground)]">
             Breaking News
           </div>
           <div className="flex-1">
@@ -43,13 +43,13 @@ export function Hero() {
         </div>
 
         <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
-          <div className="lg:col-span-8 border-r border-[#111111] pr-8 min-h-[400px]">
-            <h1 className="text-6xl md:text-8xl lg:text-[10rem] font-serif font-black leading-[0.85] tracking-tighter mb-8 uppercase italic">
+          <div className="lg:col-span-8 border-r border-[var(--foreground)] pr-8 min-h-[400px] transition-colors duration-300">
+            <h1 className="text-6xl md:text-8xl lg:text-[10rem] font-serif font-black leading-[0.85] tracking-tighter mb-8 uppercase italic text-[var(--foreground)]">
               Involution <br /> Hell
             </h1>
 
             <div className="max-w-2xl">
-              <p className="text-xl md:text-2xl font-body leading-relaxed text-justify drop-cap">
+              <p className="text-xl md:text-2xl font-body leading-relaxed text-justify drop-cap text-[var(--foreground)]">
                 一个由开发者自发组织、免费开放的学习社区。降低门槛，避免无意义内卷，专注真实进步与乐趣。我们相信知识不应成为枷锁，而应是通往自由的阶梯。
               </p>
 
@@ -60,27 +60,27 @@ export function Hero() {
           </div>
 
           <div className="lg:col-span-4 flex flex-col gap-8">
-            <div className="border border-[#111111] p-1 grayscale hover:grayscale-0 transition-all duration-500">
+            <div className="border border-[var(--foreground)] p-1 grayscale hover:grayscale-0 transition-all duration-500 bg-[var(--background)]">
               <Image
                 src="/mascot.webp"
                 alt="Mascot"
                 width={420}
                 height={400}
                 priority
-                className="w-full h-auto object-contain bg-neutral-200"
+                className="w-full h-auto object-contain bg-neutral-200 dark:bg-neutral-800"
               />
-              <div className="font-mono text-[10px] uppercase p-2 border-t border-[#111111] text-neutral-500">
+              <div className="font-mono text-[10px] uppercase p-2 border-t border-[var(--foreground)] text-neutral-500">
                 Fig. 1.1 — The Spirit of Resilience
               </div>
             </div>
 
-            <div className="border border-[#111111] p-6 bg-[#111111] text-[#F9F9F7]">
+            <div className="border border-[var(--foreground)] p-6 bg-[var(--foreground)] text-[var(--background)]">
               <h3 className="font-serif text-2xl mb-4">Join the Resistance</h3>
               <p className="font-body text-sm mb-6 opacity-80">
                 Connect with thousands of developers who are reclaiming their
                 passion for technology.
               </p>
-              <button className="w-full py-3 border border-[#F9F9F7] font-sans text-xs uppercase tracking-widest hover:bg-[#F9F9F7] hover:text-[#111111] transition-all">
+              <button className="w-full py-3 border border-[var(--background)] font-sans text-xs uppercase tracking-widest hover:bg-[var(--background)] hover:text-[var(--foreground)] transition-all">
                 Access Archives
               </button>
             </div>
@@ -88,8 +88,8 @@ export function Hero() {
         </div>
 
         {/* Top-level directories - Grid with shared borders */}
-        <div className="mt-16 border-t-4 border-[#111111]">
-          <div className="py-4 font-mono text-xs uppercase tracking-widest border-b border-[#111111]">
+        <div className="mt-16 border-t-4 border-[var(--foreground)] transition-colors duration-300">
+          <div className="py-4 font-mono text-xs uppercase tracking-widest border-b border-[var(--foreground)] text-[var(--foreground)]">
             Classified Archives / 归档分类
           </div>
           <ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
@@ -97,25 +97,25 @@ export function Hero() {
               <li
                 key={c.title}
                 className={cn(
-                  "group border-b border-[#111111] md:border-r last:border-r-0 h-full",
+                  "group border-b border-[var(--foreground)] md:border-r last:border-r-0 h-full",
                   idx % 2 === 1 && "md:border-r-0 lg:border-r",
                   idx === 3 && "lg:border-r-0",
                 )}
               >
                 <Link
                   href={c.href}
-                  className="p-8 hover:bg-neutral-100 transition-colors h-full flex flex-col hard-shadow-hover"
+                  className="p-8 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition-colors h-full flex flex-col hard-shadow-hover"
                 >
                   <div className="font-mono text-[10px] text-neutral-400 mb-4">
                     00{idx + 1}
                   </div>
-                  <div className="text-2xl font-serif font-bold mb-2 uppercase">
+                  <div className="text-2xl font-serif font-bold mb-2 uppercase text-[var(--foreground)]">
                     {c.title}
                   </div>
-                  <p className="text-sm font-body text-neutral-600 flex-1 leading-relaxed">
+                  <p className="text-sm font-body text-neutral-600 dark:text-neutral-400 flex-1 leading-relaxed">
                     {c.desc}
                   </p>
-                  <div className="mt-6 font-sans text-[10px] uppercase tracking-widest font-bold group-hover:text-[#CC0000]">
+                  <div className="mt-6 font-sans text-[10px] uppercase tracking-widest font-bold text-[var(--foreground)] group-hover:text-[#CC0000]">
                     Read More &rarr;
                   </div>
                 </Link>
diff --git a/app/components/ZoteroFeed.tsx b/app/components/ZoteroFeed.tsx
index 859e3ed0..85a55451 100644
--- a/app/components/ZoteroFeed.tsx
+++ b/app/components/ZoteroFeed.tsx
@@ -59,11 +59,11 @@ export function ZoteroFeed({
 
   return (
     <section className="mt-16 mb-10" aria-labelledby="zotero-heading">
-      <div className="border border-[#111111] bg-[#F9F9F7] p-8 newsprint-texture">
-        <div className="mb-6 flex items-baseline justify-between border-b border-[#111111] pb-4">
+      <div className="border border-[var(--foreground)] bg-[var(--background)] p-8 newsprint-texture transition-colors duration-300">
+        <div className="mb-6 flex items-baseline justify-between border-b border-[var(--foreground)] pb-4 transition-colors duration-300">
           <h2
             id="zotero-heading"
-            className="font-mono text-xs font-bold tracking-widest uppercase text-[#111111]"
+            className="font-mono text-xs font-bold tracking-widest uppercase text-[var(--foreground)]"
           >
             Reading List / 我们在读什么
           </h2>
@@ -84,18 +84,18 @@ export function ZoteroFeed({
         )}
 
         {!items && !error && (
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[#111111]">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[var(--foreground)] transition-colors duration-300">
             {Array.from({ length: limit }).map((_, i) => (
               <div
                 key={i}
-                className="h-24 border-r border-b border-[#111111] bg-neutral-100 animate-pulse"
+                className="h-24 border-r border-b border-[var(--foreground)] bg-neutral-100 dark:bg-neutral-900 animate-pulse transition-colors duration-300"
               />
             ))}
           </div>
         )}
 
         {items && (
-          <ul className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[#111111]">
+          <ul className="grid grid-cols-1 md:grid-cols-2 gap-0 border-t border-l border-[var(--foreground)] transition-colors duration-300">
             {items
               .filter(
                 (it) =>
@@ -124,7 +124,7 @@ export function ZoteroFeed({
                 return (
                   <li
                     key={key}
-                    className="border-r border-b border-[#111111] p-6 hover:bg-neutral-100 transition group"
+                    className="border-r border-b border-[var(--foreground)] p-6 hover:bg-neutral-100 dark:hover:bg-neutral-900 transition group"
                   >
                     <div className="font-mono text-[10px] text-neutral-400 mb-2">
                       REF. {idx + 1}
@@ -133,11 +133,11 @@ export function ZoteroFeed({
                       href={link}
                       target="_blank"
                       rel="noopener noreferrer"
-                      className="font-serif font-bold text-lg leading-tight block mb-3 group-hover:text-[#CC0000] transition-colors"
+                      className="font-serif font-bold text-lg leading-tight block mb-3 text-[var(--foreground)] group-hover:text-[#CC0000] transition-colors"
                     >
                       {title}
                     </a>
-                    <div className="text-[11px] font-body text-neutral-600 leading-relaxed text-justify">
+                    <div className="text-[11px] font-body text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
                       {authors && (
                         <span className={isExpanded ? "" : "line-clamp-1"}>
                           {authors}
diff --git a/app/globals.css b/app/globals.css
index 9cfe7b65..0db9dade 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -5,18 +5,11 @@
 
 /* Newsprint Design System Tokens */
 @theme {
-  --color-background: #f9f9f7;
-  --color-foreground: #111111;
-  --color-muted: #e5e5e0;
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-muted: var(--muted);
   --color-accent: #cc0000;
-  --color-border: #111111;
-
-  --color-neutral-100: #f5f5f5;
-  --color-neutral-200: #e5e5e5;
-  --color-neutral-400: #a3a3a3;
-  --color-neutral-500: #737373;
-  --color-neutral-600: #525252;
-  --color-neutral-700: #404040;
+  --color-border: var(--foreground);
 
   --font-serif: "Playfair Display", "Times New Roman", serif;
   --font-body: "Lora", Georgia, serif;
@@ -34,15 +27,14 @@
 @layer base {
   * {
     border-radius: 0px !important;
-    border-color: #111111;
+    border-color: var(--foreground);
   }
 
   body {
-    background-color: #f9f9f7;
-    color: #111111;
+    background-color: var(--background);
+    color: var(--foreground);
     font-family: var(--font-body);
     -webkit-font-smoothing: antialiased;
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23111111' fill-opacity='0.04' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
   }
 
   h1,
@@ -67,21 +59,21 @@
     position: absolute;
     inset: 0;
     background-image:
-      linear-gradient(0deg, transparent 98%, rgba(0, 0, 0, 0.02) 100%),
-      linear-gradient(90deg, transparent 98%, rgba(0, 0, 0, 0.02) 100%);
+      linear-gradient(0deg, transparent 98%, var(--grid-line) 100%),
+      linear-gradient(90deg, transparent 98%, var(--grid-line) 100%);
     background-size: 3px 3px;
     pointer-events: none;
     opacity: 0.5;
   }
 
   .hard-shadow-hover:hover {
-    box-shadow: 4px 4px 0px 0px #111111;
+    box-shadow: 4px 4px 0px 0px var(--foreground);
     transform: translate(-2px, -2px);
     transition: all 0.2s ease-out;
   }
 
   .halftone {
-    background-image: radial-gradient(#000 1px, transparent 1px);
+    background-image: radial-gradient(var(--foreground) 1px, transparent 1px);
     background-size: 16px 16px;
     opacity: 0.1;
   }
@@ -100,24 +92,122 @@
   }
 }
 
-/* Force Light Mode */
+/* Theme Variables */
 :root {
   --background: #f9f9f7;
   --foreground: #111111;
+  --muted: #e5e5e0;
+  --grid-line: rgba(0, 0, 0, 0.02);
+
+  /* Light mode paper texture */
+  --paper-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23111111' fill-opacity='0.04' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
 }
 
 .dark {
-  --background: #f9f9f7;
-  --foreground: #111111;
+  --background: #050505; /* Deep black to blend with stars */
+  --foreground: #ededed; /* Off-white for text */
+  --muted: #1a1a1a;
+  --grid-line: rgba(255, 255, 255, 0.05);
+
+  /* Remove paper texture in dark mode, or make it very subtle white */
+  --paper-texture: none;
+}
+
+body {
+  background-image: var(--paper-texture);
+}
+
+/* ========================================
+   Starry Background Animation (Restored)
+   ======================================== */
+
+.site-bg {
+  position: fixed;
+  inset: 0;
+  z-index: -1;
+  pointer-events: none;
+  overflow: hidden;
+}
+
+/* Dark mode stars */
+.site-bg--stars {
+  display: none;
+  background-color: #050505;
+}
+
+.dark .site-bg--stars {
+  display: block;
+}
+
+.site-bg--stars::before,
+.site-bg--stars::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background-repeat: repeat;
+}
+
+.site-bg--stars::before {
+  opacity: 0.7;
+  background-image:
+    radial-gradient(
+      1px 1px at 10px 20px,
+      rgba(255, 255, 255, 0.9) 50%,
+      transparent 51%
+    ),
+    radial-gradient(
+      1px 1px at 130px 80px,
+      rgba(186, 214, 255, 0.9) 50%,
+      transparent 51%
+    ),
+    radial-gradient(
+      1px 1px at 60px 140px,
+      rgba(255, 210, 210, 0.9) 50%,
+      transparent 51%
+    );
+  background-size: 220px 220px;
+  animation: stars-drift 120s linear infinite;
+}
+
+.site-bg--stars::after {
+  opacity: 0.5;
+  background-image:
+    radial-gradient(
+      1.5px 1.5px at 50px 30px,
+      rgba(255, 255, 255, 0.8) 50%,
+      transparent 51%
+    ),
+    radial-gradient(
+      2px 2px at 120px 160px,
+      rgba(200, 220, 255, 0.8) 50%,
+      transparent 51%
+    ),
+    radial-gradient(
+      1.5px 1.5px at 180px 100px,
+      rgba(255, 220, 220, 0.8) 50%,
+      transparent 51%
+    );
+  background-size: 320px 320px;
+  animation: stars-drift 180s linear infinite reverse;
+}
+
+@keyframes stars-drift {
+  0% {
+    transform: translate3d(0, 0, 0);
+  }
+  100% {
+    transform: translate3d(-50%, 0, 0);
+  }
 }
 
-/* Override Fumadocs defaults to match Newsprint */
+/* Fumadocs Overrides for Dark Mode */
 .nd-sidebar {
   border-radius: 0px !important;
-  border-right: 1px solid #111111 !important;
+  border-right: 1px solid var(--foreground) !important;
+  background-color: var(--background) !important;
 }
 
 .nd-nav {
-  border-bottom: 1px solid #111111 !important;
-  background-color: #f9f9f7 !important;
+  border-bottom: 1px solid var(--foreground) !important;
+  background-color: var(--background) !important;
 }
diff --git a/app/layout.tsx b/app/layout.tsx
index c2984654..261a7318 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -167,6 +167,7 @@ export default function RootLayout({
         suppressHydrationWarning
         className={`${geistSans.variable} ${geistMono.variable} antialiased`}
       >
+        <div className="site-bg site-bg--stars" aria-hidden />
         <RootProvider
           search={{
             // 使用静态索引，兼容 next export 与本地开发

From 574437c9408151336844b4ce2d8aefca63b96a45 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 03:12:49 +0800
Subject: [PATCH 03/13] =?UTF-8?q?chore:=20=E5=8A=A0=E5=85=A5=E9=BB=91?=
 =?UTF-8?q?=E5=A4=9C=E6=A8=A1=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ActivityTicker.tsx | 145 +++++++++++-------------------
 app/components/Contribute.tsx     |   2 +-
 app/components/Features.tsx       |   6 --
 app/components/Hero.tsx           |  10 ++-
 app/globals.css                   |  31 +++++++
 5 files changed, 91 insertions(+), 103 deletions(-)

diff --git a/app/components/ActivityTicker.tsx b/app/components/ActivityTicker.tsx
index c2651e16..b70a584b 100644
--- a/app/components/ActivityTicker.tsx
+++ b/app/components/ActivityTicker.tsx
@@ -1,14 +1,4 @@
-"use client";
-
-import Image from "next/image";
-import Link from "next/link";
-import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { ChevronLeft, ChevronRight, X } from "lucide-react";
-import {
-  activityEventsConfig,
-  type ActivityEvent,
-  type ActivityTickerSettings,
-} from "@/app/types/event";
+import { activityEventsConfig } from "@/app/types/event";
 import { cn } from "@/lib/utils";
 
 const { events: rawEvents, settings } = activityEventsConfig;
@@ -16,11 +6,10 @@ const { events: rawEvents, settings } = activityEventsConfig;
 const {
   maxItems: configuredMaxItems = 3,
   rotationIntervalMs: configuredRotationIntervalMs = 8000,
-}: ActivityTickerSettings = settings;
+} = settings;
 
 // 默认配置，从data/event.json中读取配置
 const MAX_ITEMS = configuredMaxItems;
-const ROTATION_INTERVAL_MS = configuredRotationIntervalMs;
 
 /** ActivityTicker 外部传入的样式配置 */
 type ActivityTickerProps = {
@@ -31,94 +20,66 @@ type ActivityTickerProps = {
 /**
  * 首页活动轮播组件：
  * - 读取 event.json 配置的活动数量
- * - 自动轮播封面图，顶部指示器支持手动切换
- * - 底部两个毛玻璃按钮：Discord 永远可见，Playback 仅在 deprecated=true 时显示
+ * - 横向跑马灯自动滚动，悬停暂停
+ * - 每条活动可点击跳转到 Discord
  */
 export function ActivityTicker({ className }: ActivityTickerProps) {
-  // 预处理活动列表，保持初次渲染后的引用稳定
-  const events = useMemo<ActivityEvent[]>(() => {
-    return rawEvents.slice(0, MAX_ITEMS);
-  }, []);
-
-  // 当前展示的活动索引
-  const [activeIndex, setActiveIndex] = useState(0);
-  const totalEvents = events.length;
-
-  // 控制浮窗显隐
-  const [isClosed, setIsClosed] = useState(false);
-
-  useEffect(() => {
-    if (isClosed || totalEvents <= 1) {
-      return;
-    }
-
-    // 定时轮播，间隔 ROTATION_INTERVAL_MS
-    const timer = window.setInterval(() => {
-      setActiveIndex((prev) => (prev + 1) % totalEvents);
-    }, ROTATION_INTERVAL_MS);
-
-    return () => window.clearInterval(timer);
-  }, [totalEvents, activeIndex, isClosed]);
-
-  const handlePrev = useCallback(() => {
-    if (totalEvents <= 1) {
-      return;
-    }
-    setActiveIndex((prev) => (prev - 1 + totalEvents) % totalEvents);
-  }, [totalEvents]);
-
-  const handleNext = useCallback(() => {
-    if (totalEvents <= 1) {
-      return;
-    }
-    setActiveIndex((prev) => (prev + 1) % totalEvents);
-  }, [totalEvents]);
-
-  if (totalEvents === 0) {
-    return null;
-  }
+  const events = rawEvents.slice(0, MAX_ITEMS);
+  const animationDurationMs =
+    configuredRotationIntervalMs * Math.max(events.length, 1);
 
-  if (isClosed) {
+  if (events.length === 0) {
     return null;
   }
 
-  const activeEvent = events[activeIndex];
-  const coverSrc = activeEvent.coverUrl;
-  const showPlayback = activeEvent.deprecated && Boolean(activeEvent.playback);
+  const renderEvent = (
+    event: (typeof events)[number],
+    keyPrefix: string,
+    idx: number,
+  ) => (
+    <div
+      key={`${keyPrefix}-${event.name}-${idx}`}
+      className="flex items-center gap-4 whitespace-nowrap"
+    >
+      <span className="bg-[#CC0000] text-white px-2 py-0.5 font-mono text-[10px] uppercase tracking-tighter shrink-0">
+        Update
+      </span>
+      <a
+        href={event.discord}
+        target="_blank"
+        rel="noopener noreferrer"
+        className="font-sans text-xs font-bold uppercase tracking-widest hover:text-[#CC0000]"
+      >
+        {event.name} —{" "}
+        {event.deprecated ? "Archives Available" : "Event Active"}
+      </a>
+      <span className="text-neutral-400 font-mono text-[10px]">&bull;</span>
+      <span className="font-mono text-[10px] text-neutral-500 uppercase">
+        Edition 1.0.0
+      </span>
+    </div>
+  );
 
   return (
-    <div className="flex items-center w-full h-8 overflow-hidden group">
-      <div className="flex items-center gap-4 animate-in slide-in-from-right duration-500">
-        <span className="bg-[#CC0000] text-white px-2 py-0.5 font-mono text-[10px] uppercase tracking-tighter shrink-0">
-          Update
-        </span>
-        <Link
-          href={activeEvent.discord}
-          className="font-sans text-xs font-bold uppercase tracking-widest hover:text-[#CC0000] truncate"
-        >
-          {activeEvent.name} —{" "}
-          {activeEvent.deprecated ? "Archives Available" : "Event Active"}
-        </Link>
-        <span className="text-neutral-400 font-mono text-[10px]">&bull;</span>
-        <span className="font-mono text-[10px] text-neutral-500 uppercase">
-          Edition 1.0.0
-        </span>
-      </div>
-
-      <div className="ml-auto flex border-l border-[var(--foreground)] h-full">
-        <button
-          onClick={handlePrev}
-          className="px-3 hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)] transition-colors border-r border-[var(--foreground)]"
-        >
-          <ChevronLeft className="h-3 w-3" />
-        </button>
-
-        <button
-          onClick={handleNext}
-          className="px-3 hover:bg-[var(--foreground)] hover:text-[var(--background)] text-[var(--foreground)] transition-colors"
+    <div
+      className={cn(
+        "ticker flex items-center w-full h-8 overflow-hidden",
+        className,
+      )}
+    >
+      <div
+        className="ticker-track items-center"
+        style={{ animationDuration: `${animationDurationMs}ms` }}
+      >
+        <div className="flex items-center gap-6 pr-6 shrink-0">
+          {events.map((event, idx) => renderEvent(event, "primary", idx))}
+        </div>
+        <div
+          className="flex items-center gap-6 pr-6 shrink-0"
+          aria-hidden="true"
         >
-          <ChevronRight className="h-3 w-3" />
-        </button>
+          {events.map((event, idx) => renderEvent(event, "secondary", idx))}
+        </div>
       </div>
     </div>
   );
diff --git a/app/components/Contribute.tsx b/app/components/Contribute.tsx
index 9653cdb1..00af5c4b 100644
--- a/app/components/Contribute.tsx
+++ b/app/components/Contribute.tsx
@@ -170,7 +170,7 @@ export function Contribute() {
           >
             <span className="relative z-10 flex items-center gap-4">
               <Sparkles className="h-6 w-6" />
-              <span>Submit Contribution</span>
+              <span>Submit Contribution / 投稿 </span>
             </span>
           </Button>
         </DialogTrigger>
diff --git a/app/components/Features.tsx b/app/components/Features.tsx
index 26b1e7f6..b651356f 100644
--- a/app/components/Features.tsx
+++ b/app/components/Features.tsx
@@ -86,12 +86,6 @@ export function Features() {
                 <p className="font-body text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
                   {feature.description}
                 </p>
-
-                <div className="mt-8 pt-6 border-t border-dashed border-neutral-300 dark:border-neutral-700 opacity-0 group-hover:opacity-100 transition-opacity">
-                  <span className="font-sans text-[10px] font-bold uppercase tracking-widest text-[var(--foreground)]">
-                    Learn More &rarr;
-                  </span>
-                </div>
               </div>
             </div>
           ))}
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
index 1f3ef3df..11d38573 100644
--- a/app/components/Hero.tsx
+++ b/app/components/Hero.tsx
@@ -60,7 +60,7 @@ export function Hero() {
           </div>
 
           <div className="lg:col-span-4 flex flex-col gap-8">
-            <div className="border border-[var(--foreground)] p-1 grayscale hover:grayscale-0 transition-all duration-500 bg-[var(--background)]">
+            <div className="border border-[var(--foreground)] p-1 grayscale hover:grayscale-0 dark:grayscale-0 dark:hover:grayscale transition-all duration-500 bg-[var(--background)]">
               <Image
                 src="/mascot.webp"
                 alt="Mascot"
@@ -80,9 +80,11 @@ export function Hero() {
                 Connect with thousands of developers who are reclaiming their
                 passion for technology.
               </p>
-              <button className="w-full py-3 border border-[var(--background)] font-sans text-xs uppercase tracking-widest hover:bg-[var(--background)] hover:text-[var(--foreground)] transition-all">
-                Access Archives
-              </button>
+              <Link href="/docs/ai" className="block w-full">
+                <button className="w-full py-3 border border-[var(--background)] font-sans text-xs uppercase tracking-widest hover:bg-[var(--background)] hover:text-[var(--foreground)] transition-all cursor-pointer">
+                  Access Archives
+                </button>
+              </Link>
             </div>
           </div>
         </div>
diff --git a/app/globals.css b/app/globals.css
index 0db9dade..58dff309 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -90,6 +90,37 @@
     margin-right: 0.5rem;
     color: #cc0000;
   }
+
+  .ticker {
+    overflow: hidden;
+  }
+
+  .ticker-track {
+    display: flex;
+    width: max-content;
+    animation: ticker-scroll 30s linear infinite;
+    will-change: transform;
+  }
+
+  .ticker:hover .ticker-track {
+    animation-play-state: paused;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .ticker-track {
+      animation: none;
+      transform: translate3d(0, 0, 0);
+    }
+  }
+}
+
+@keyframes ticker-scroll {
+  0% {
+    transform: translate3d(0, 0, 0);
+  }
+  100% {
+    transform: translate3d(-50%, 0, 0);
+  }
 }
 
 /* Theme Variables */

From 194ec0b9bb4e447dd4a86d439cf133eae034cf4d Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 03:39:39 +0800
Subject: [PATCH 04/13] =?UTF-8?q?chore:=20=E5=8A=A0=E5=85=A5=E9=BB=91?=
 =?UTF-8?q?=E5=A4=9C=E6=A8=A1=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ActivityTicker.tsx |  9 ++++++---
 app/components/Community.tsx      |  5 +++--
 app/components/Hero.tsx           |  4 ++--
 app/layout.tsx                    | 18 +++++++++---------
 4 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/app/components/ActivityTicker.tsx b/app/components/ActivityTicker.tsx
index b70a584b..8de66dd0 100644
--- a/app/components/ActivityTicker.tsx
+++ b/app/components/ActivityTicker.tsx
@@ -27,6 +27,7 @@ export function ActivityTicker({ className }: ActivityTickerProps) {
   const events = rawEvents.slice(0, MAX_ITEMS);
   const animationDurationMs =
     configuredRotationIntervalMs * Math.max(events.length, 1);
+  const lastEventIndex = events.length - 1;
 
   if (events.length === 0) {
     return null;
@@ -41,9 +42,11 @@ export function ActivityTicker({ className }: ActivityTickerProps) {
       key={`${keyPrefix}-${event.name}-${idx}`}
       className="flex items-center gap-4 whitespace-nowrap"
     >
-      <span className="bg-[#CC0000] text-white px-2 py-0.5 font-mono text-[10px] uppercase tracking-tighter shrink-0">
-        Update
-      </span>
+      {idx === lastEventIndex ? (
+        <span className="bg-[#CC0000] text-white px-2 py-0.5 font-mono text-[10px] uppercase tracking-tighter shrink-0">
+          Update
+        </span>
+      ) : null}
       <a
         href={event.discord}
         target="_blank"
diff --git a/app/components/Community.tsx b/app/components/Community.tsx
index 916c43de..54c945ae 100644
--- a/app/components/Community.tsx
+++ b/app/components/Community.tsx
@@ -25,7 +25,7 @@ export function Community() {
           </div>
         </div>
 
-        {/* Main CTA Section - Inverted (Light Mode) / Normal (Dark Mode) 
+        {/* Main CTA Section - Inverted (Light Mode) / Normal (Dark Mode)
                 Design Decision: Keep high contrast.
                 Light Mode: Black Box, White Text.
                 Dark Mode: White Box, Black Text? Or Keep Black Box with White Border?
@@ -48,7 +48,8 @@ export function Community() {
               className="bg-transparent border-[var(--background)] text-[var(--background)] hover:bg-[var(--background)] hover:text-[var(--foreground)] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
             >
               <a href="docs/ai" target="_blank" rel="noopener noreferrer">
-                Access Archives <ExternalLink className="ml-4 h-5 w-5" />
+                Access Articles / 访问文章{" "}
+                <ExternalLink className="ml-4 h-5 w-5" />
               </a>
             </Button>
           </div>
diff --git a/app/components/Hero.tsx b/app/components/Hero.tsx
index 11d38573..de780689 100644
--- a/app/components/Hero.tsx
+++ b/app/components/Hero.tsx
@@ -44,7 +44,7 @@ export function Hero() {
 
         <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
           <div className="lg:col-span-8 border-r border-[var(--foreground)] pr-8 min-h-[400px] transition-colors duration-300">
-            <h1 className="text-6xl md:text-8xl lg:text-[10rem] font-serif font-black leading-[0.85] tracking-tighter mb-8 uppercase italic text-[var(--foreground)]">
+            <h1 className="text-6xl md:text-8xl lg:text-[8rem] font-serif font-black leading-[0.85] tracking-tighter mb-8 uppercase italic text-[var(--foreground)]">
               Involution <br /> Hell
             </h1>
 
@@ -82,7 +82,7 @@ export function Hero() {
               </p>
               <Link href="/docs/ai" className="block w-full">
                 <button className="w-full py-3 border border-[var(--background)] font-sans text-xs uppercase tracking-widest hover:bg-[var(--background)] hover:text-[var(--foreground)] transition-all cursor-pointer">
-                  Access Archives
+                  Access Articles / 访问文章
                 </button>
               </Link>
             </div>
diff --git a/app/layout.tsx b/app/layout.tsx
index 261a7318..b35b18a2 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -168,18 +168,18 @@ export default function RootLayout({
         className={`${geistSans.variable} ${geistMono.variable} antialiased`}
       >
         <div className="site-bg site-bg--stars" aria-hidden />
-        <RootProvider
-          search={{
-            // 使用静态索引，兼容 next export 与本地开发
-            options: { type: "static", api: "/search.json" },
-          }}
-        >
-          <ThemeProvider defaultTheme="dark" storageKey="ih-theme">
+        <ThemeProvider defaultTheme="dark" storageKey="ih-theme">
+          <RootProvider
+            search={{
+              // 使用静态索引，兼容 next export 与本地开发
+              options: { type: "static", api: "/search.json" },
+            }}
+          >
             <main id="main-content" className="relative z-10">
               {children}
             </main>
-          </ThemeProvider>
-        </RootProvider>
+          </RootProvider>
+        </ThemeProvider>
         {/* 谷歌分析 */}
         <Script
           src="https://www.googletagmanager.com/gtag/js?id=G-ED4GVN8YVW"

From 4d41c2b399e5e655a7d4b7164a1f5e207e25269f Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 03:45:26 +0800
Subject: [PATCH 05/13] =?UTF-8?q?fix:=20=E9=81=BF=E5=85=8D=E9=97=AA?=
 =?UTF-8?q?=E7=83=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/layout.tsx | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/app/layout.tsx b/app/layout.tsx
index b35b18a2..3d390e02 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -132,6 +132,34 @@ export default function RootLayout({
         `,
           }}
         />
+        {/* 主题脚本：避免首屏闪烁 */}
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `
+              (() => {
+                try {
+                  const storageKey = "ih-theme";
+                  const root = document.documentElement;
+                  const stored = localStorage.getItem(storageKey);
+                  const theme = stored || "dark";
+                  root.classList.remove("light", "dark");
+
+                  if (theme === "system") {
+                    const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches
+                      ? "dark"
+                      : "light";
+                    root.classList.add(systemTheme);
+                    return;
+                  }
+
+                  root.classList.add(theme);
+                } catch {
+                  // Ignore storage access errors to avoid blocking render.
+                }
+              })();
+            `,
+          }}
+        />
         {/* 预连接：缩短关键请求链 */}
         <link rel="preconnect" href="https://www.google-analytics.com" />
         {/* Preload the decorative sky texture so the LCP background image is discovered immediately */}

From 01a0e96d78a80f32a57a308106af9668beaf25e0 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 03:47:33 +0800
Subject: [PATCH 06/13] =?UTF-8?q?fix:=20eslint=E6=8A=A5=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/Community.tsx |  3 +--
 app/components/Features.tsx  | 13 ++++++++++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/app/components/Community.tsx b/app/components/Community.tsx
index 54c945ae..ab5bd674 100644
--- a/app/components/Community.tsx
+++ b/app/components/Community.tsx
@@ -1,5 +1,4 @@
-import { Button } from "../../components/ui/button";
-import { Card, CardContent } from "../../components/ui/card";
+import { Button } from "@/components/ui/button";
 import {
   ExternalLink,
   MessageCircle,
diff --git a/app/components/Features.tsx b/app/components/Features.tsx
index b651356f..44e1c67b 100644
--- a/app/components/Features.tsx
+++ b/app/components/Features.tsx
@@ -1,9 +1,16 @@
 import React from "react";
 import { Users, Zap, Heart } from "lucide-react";
 import { Github as GithubIcon } from "./icons/Github";
+import { cn } from "@/lib/utils";
 
 export function Features() {
-  const features = [
+  const features: {
+    icon: React.ReactElement<{ className?: string }>;
+    title: string;
+    description: string;
+    highlight: string;
+    color: string;
+  }[] = [
     {
       icon: <GithubIcon className="h-8 w-8 text-sky-500" />,
       title: "完全开源",
@@ -64,8 +71,8 @@ export function Features() {
                   <div className="w-16 h-16 border border-[var(--foreground)] flex items-center justify-center group-hover:bg-[var(--foreground)] group-hover:text-[var(--background)] transition-all duration-300">
                     {/* Simplified icon styling */}
                     <div className="p-0 text-[var(--foreground)] group-hover:text-[var(--background)]">
-                      {React.cloneElement(feature.icon as React.ReactElement, {
-                        className: "h-8 w-8",
+                      {React.cloneElement(feature.icon, {
+                        className: cn("h-8 w-8", feature.icon.props.className),
                       })}
                     </div>
                   </div>

From da2de80c6a18d578d208c25cb8274ec39db60560 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 22:51:31 +0800
Subject: [PATCH 07/13] =?UTF-8?q?fix:=20=E4=B8=8D=E8=A6=81=EF=BC=81importa?=
 =?UTF-8?q?nt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/api/chat/route.ts                  |  1 -
 app/components/DocsAssistant.tsx       | 63 ++++++++++++++++++--------
 app/components/assistant-ui/thread.tsx | 23 ++++++----
 app/globals.css                        | 24 ++++++----
 4 files changed, 71 insertions(+), 40 deletions(-)

diff --git a/app/api/chat/route.ts b/app/api/chat/route.ts
index 5e872c6e..ed2ba00d 100644
--- a/app/api/chat/route.ts
+++ b/app/api/chat/route.ts
@@ -8,7 +8,6 @@ export const maxDuration = 30;
 interface ChatRequest {
   messages: UIMessage[];
   system?: string;
-  tools?: unknown;
   pageContext?: {
     title?: string;
     description?: string;
diff --git a/app/components/DocsAssistant.tsx b/app/components/DocsAssistant.tsx
index 576bb723..e877ed8e 100644
--- a/app/components/DocsAssistant.tsx
+++ b/app/components/DocsAssistant.tsx
@@ -93,9 +93,29 @@ interface AssistantErrorState {
   showSettingsCTA: boolean;
 }
 
+type AssistantProvider = "openai" | "gemini" | "intern";
+
+type AssistantErrorData = {
+  error?: string;
+};
+
+type AssistantErrorPayload = {
+  message?: string;
+  statusCode?: number;
+  responseBody?: string;
+  data?: AssistantErrorData;
+};
+
+type AssistantErrorInput =
+  | AssistantErrorPayload
+  | Error
+  | string
+  | null
+  | undefined;
+
 function deriveAssistantError(
-  err: unknown,
-  provider: "openai" | "gemini" | "intern",
+  err: AssistantErrorInput,
+  provider: AssistantProvider,
 ): AssistantErrorState {
   const providerLabel =
     provider === "gemini"
@@ -113,12 +133,7 @@ function deriveAssistantError(
     return fallback;
   }
 
-  const maybeError = err as Partial<{
-    message?: string;
-    statusCode?: number;
-    responseBody?: string;
-    data?: unknown;
-  }>;
+  const maybeError = coerceAssistantErrorPayload(err);
 
   let message = "";
 
@@ -139,15 +154,8 @@ function deriveAssistantError(
     }
   }
 
-  if (!message && err instanceof Error && typeof err.message === "string") {
-    message = err.message.trim();
-  }
-
-  if (!message && maybeError.data && typeof maybeError.data === "object") {
-    const dataError = (maybeError.data as { error?: unknown }).error;
-    if (typeof dataError === "string" && dataError.trim().length > 0) {
-      message = dataError.trim();
-    }
+  if (!message && maybeError.data?.error) {
+    message = maybeError.data.error.trim();
   }
 
   const statusCode =
@@ -193,6 +201,21 @@ function deriveAssistantError(
   };
 }
 
+function coerceAssistantErrorPayload(
+  err: AssistantErrorInput,
+): AssistantErrorPayload {
+  if (!err) {
+    return {};
+  }
+  if (typeof err === "string") {
+    return { message: err };
+  }
+  if (err instanceof Error) {
+    return { message: err.message };
+  }
+  return err;
+}
+
 function extractErrorFromResponseBody(body: string): string | undefined {
   const trimmed = body.trim();
   if (!trimmed) {
@@ -200,16 +223,16 @@ function extractErrorFromResponseBody(body: string): string | undefined {
   }
 
   try {
-    const parsed = JSON.parse(trimmed);
+    const parsed = JSON.parse(trimmed) as string | AssistantErrorData;
     if (typeof parsed === "string") {
       return parsed.trim();
     }
     if (
       parsed &&
       typeof parsed === "object" &&
-      typeof (parsed as { error?: unknown }).error === "string"
+      typeof parsed.error === "string"
     ) {
-      return (parsed as { error: string }).error.trim();
+      return parsed.error.trim();
     }
   } catch {
     // Ignore JSON parsing issues and fall back to the raw body text.
diff --git a/app/components/assistant-ui/thread.tsx b/app/components/assistant-ui/thread.tsx
index 4a0394f3..a164a273 100644
--- a/app/components/assistant-ui/thread.tsx
+++ b/app/components/assistant-ui/thread.tsx
@@ -68,12 +68,12 @@ export const Thread: FC<ThreadProps> = ({
     <LazyMotion features={domAnimation}>
       <MotionConfig reducedMotion="user">
         <ThreadPrimitive.Root
-          className="aui-root aui-thread-root @container flex h-full flex-col bg-background"
+          className="aui-root aui-thread-root @container flex h-full flex-col bg-[var(--background)]"
           style={{
             ["--thread-max-width" as string]: "44rem",
           }}
         >
-          <ThreadPrimitive.Viewport className="aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll px-4">
+          <ThreadPrimitive.Viewport className="aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll px-4 scrollbar-thin scrollbar-thumb-[var(--foreground)] scrollbar-track-transparent">
             <ThreadWelcome />
 
             <ThreadPrimitive.Messages
@@ -178,7 +178,7 @@ const ThreadWelcome: FC = () => {
               initial={{ opacity: 0, y: 10 }}
               animate={{ opacity: 1, y: 0 }}
               exit={{ opacity: 0, y: 10 }}
-              className="aui-thread-welcome-message-motion-1 text-2xl font-semibold"
+              className="aui-thread-welcome-message-motion-1 text-2xl font-serif font-bold text-[var(--foreground)]"
             >
               Hello there!
             </m.div>
@@ -187,7 +187,7 @@ const ThreadWelcome: FC = () => {
               animate={{ opacity: 1, y: 0 }}
               exit={{ opacity: 0, y: 10 }}
               transition={{ delay: 0.1 }}
-              className="aui-thread-welcome-message-motion-2 text-2xl text-muted-foreground/65"
+              className="aui-thread-welcome-message-motion-2 text-2xl text-neutral-500 font-serif italic"
             >
               How can I help you today?
             </m.div>
@@ -288,22 +288,27 @@ const Composer: FC<ComposerProps> = ({
   }, [onClearError, onOpenChange]);
 
   return (
-    <div className="aui-composer-wrapper sticky bottom-0 mx-auto flex w-full max-w-[var(--thread-max-width)] flex-col gap-4 overflow-visible rounded-t-3xl bg-white pb-4 md:pb-6">
+    <div className="aui-composer-wrapper sticky bottom-0 mx-auto flex w-full max-w-[var(--thread-max-width)] flex-col gap-4 overflow-visible bg-[var(--background)] pb-4 md:pb-6 pt-2 border-t border-[var(--foreground)]">
       <ThreadScrollToBottom />
       <ThreadPrimitive.Empty>
         <ThreadWelcomeSuggestions />
       </ThreadPrimitive.Empty>
       <ComposerPrimitive.Root
-        className="aui-composer-root relative flex w-full flex-col rounded-3xl border border-border bg-muted px-1 pt-2 shadow-[0_9px_9px_0px_rgba(0,0,0,0.01),0_2px_5px_0px_rgba(0,0,0,0.06)] dark:border-muted-foreground/15"
+        className="aui-composer-root relative flex w-full flex-col rounded-none border border-[var(--foreground)] bg-[var(--background)] px-1 pt-2 shadow-none"
         aria-disabled={!hasActiveKey}
         data-key-required={!hasActiveKey}
       >
         {!hasActiveKey && (
-          <div className="absolute inset-0 z-10 flex flex-col items-center justify-center gap-3 rounded-3xl bg-background/90 px-6 text-center backdrop-blur-sm">
+          <div className="absolute inset-0 z-10 flex flex-col items-center justify-center gap-3 bg-[var(--background)]/90 px-6 text-center backdrop-blur-sm">
             <p className="text-sm text-muted-foreground">
               Add your {providerLabel} API key in Settings to start chatting.
             </p>
-            <Button type="button" size="sm" onClick={handleOpenSettings}>
+            <Button
+              type="button"
+              size="sm"
+              onClick={handleOpenSettings}
+              className="rounded-none border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)]"
+            >
               Open settings
             </Button>
           </div>
@@ -473,7 +478,7 @@ const UserMessage: FC = () => {
         <UserMessageAttachments />
 
         <div className="aui-user-message-content-wrapper relative col-start-2 min-w-0">
-          <div className="aui-user-message-content rounded-3xl bg-muted px-5 py-2.5 break-words text-foreground">
+          <div className="aui-user-message-content rounded-none bg-[var(--foreground)] px-5 py-3 break-words text-[var(--background)] border border-[var(--foreground)]">
             <MessagePrimitive.Parts />
           </div>
           <div className="aui-user-action-bar-wrapper absolute top-1/2 left-0 -translate-x-full -translate-y-1/2 pr-2">
diff --git a/app/globals.css b/app/globals.css
index 58dff309..be2286cc 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -231,14 +231,18 @@ body {
   }
 }
 
-/* Fumadocs Overrides for Dark Mode */
-.nd-sidebar {
-  border-radius: 0px !important;
-  border-right: 1px solid var(--foreground) !important;
-  background-color: var(--background) !important;
-}
-
-.nd-nav {
-  border-bottom: 1px solid var(--foreground) !important;
-  background-color: var(--background) !important;
+/* Fumadocs 表面样式调整，避免使用 !important */
+#nd-sidebar {
+  border-radius: 0;
+  --color-fd-card: var(--background);
+  --color-fd-border: var(--foreground);
+  background-color: var(--color-fd-card);
+  border-inline-end: 1px solid var(--color-fd-border);
+}
+
+#nd-nav {
+  --color-fd-background: var(--background);
+  --color-fd-border: var(--foreground);
+  background-color: var(--color-fd-background);
+  border-bottom: 1px solid var(--color-fd-border);
 }

From 82cc45627f1ad74e11804722ec415b6a0a05fb81 Mon Sep 17 00:00:00 2001
From: Siz Long <longsizhuo@gmail.com>
Date: Wed, 7 Jan 2026 23:39:18 +0800
Subject: [PATCH 08/13] Update app/layout.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 app/layout.tsx | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/layout.tsx b/app/layout.tsx
index 3d390e02..bfa4f0cc 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -125,12 +125,15 @@ export default function RootLayout({
   return (
     <html lang="zh-CN" suppressHydrationWarning>
       <head>
-        <style
-          dangerouslySetInnerHTML={{
-            __html: `
-          @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400&family=Lora:ital,wght@0,400;0,600;1,400&display=block');
-        `,
-          }}
+        <link rel="preconnect" href="https://fonts.googleapis.com" />
+        <link
+          rel="preconnect"
+          href="https://fonts.gstatic.com"
+          crossOrigin="anonymous"
+        />
+        <link
+          rel="stylesheet"
+          href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400&family=Lora:ital,wght@0,400;0,600;1,400&display=swap"
         />
         {/* 主题脚本：避免首屏闪烁 */}
         <script

From 34a53834c1ac7eb8706fc8b58e60e868750b5e7b Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Thu, 8 Jan 2026 01:30:56 +0800
Subject: [PATCH 09/13] =?UTF-8?q?fix:=20=E6=A8=A1=E6=8B=9F=E6=97=B6?=
 =?UTF-8?q?=E9=97=B4=E6=88=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/Header.tsx           |  20 +++--
 app/components/LiveEditionLabel.tsx | 123 ++++++++++++++++++++++++++++
 2 files changed, 134 insertions(+), 9 deletions(-)
 create mode 100644 app/components/LiveEditionLabel.tsx

diff --git a/app/components/Header.tsx b/app/components/Header.tsx
index 6e95d162..df8576ab 100644
--- a/app/components/Header.tsx
+++ b/app/components/Header.tsx
@@ -1,11 +1,12 @@
 import { ThemeToggle } from "./ThemeToggle";
-import { Button } from "../../components/ui/button";
+import { Button } from "@/components/ui/button";
 import { MessageCircle } from "lucide-react";
 import { Github as GithubIcon } from "./icons/Github";
 import { SignInButton } from "./SignInButton";
 import { auth } from "@/auth";
 import { UserMenu } from "./UserMenu";
 import { BrandMark } from "./BrandMark";
+import { LiveEditionLabel } from "./LiveEditionLabel";
 
 export async function Header() {
   const session = await auth();
@@ -14,21 +15,22 @@ export async function Header() {
     session && "provider" in session
       ? (session.provider as string | undefined)
       : undefined;
+  const now = new Date();
+  const editionTimestampMs = now.getTime();
+  const formattedDate = now.toLocaleDateString("en-US", {
+    month: "long",
+    day: "numeric",
+    year: "numeric",
+  });
   console.log("session", session);
   return (
     <header className="fixed top-0 w-full z-50 bg-[var(--background)] border-b border-[var(--foreground)] py-2 transition-colors duration-300">
       <div className="container mx-auto px-6">
         <div className="flex items-center justify-between border-b border-[var(--foreground)] pb-2 mb-2 transition-colors duration-300">
-          <div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
-            Vol. 1 | No. 128 | Beijing Edition
-          </div>
+          <LiveEditionLabel initialTimestamp={editionTimestampMs} />
           <BrandMark priority />
           <div className="font-mono text-[10px] uppercase tracking-widest text-neutral-500">
-            {new Date().toLocaleDateString("en-US", {
-              month: "long",
-              day: "numeric",
-              year: "numeric",
-            })}
+            {formattedDate}
           </div>
         </div>
 
diff --git a/app/components/LiveEditionLabel.tsx b/app/components/LiveEditionLabel.tsx
new file mode 100644
index 00000000..0a9cb752
--- /dev/null
+++ b/app/components/LiveEditionLabel.tsx
@@ -0,0 +1,123 @@
+/**
+ * Header 左侧刊期展示：实时秒级时间戳 + 前端 steps 动画模拟的两位“毫秒”滚动。
+ */
+"use client";
+
+import { useEffect, useState } from "react";
+
+type LiveEditionLabelProps = {
+  // milliseconds since epoch
+  initialTimestamp: number;
+};
+
+export function LiveEditionLabel({ initialTimestamp }: LiveEditionLabelProps) {
+  const [timestamp, setTimestamp] = useState(
+    Math.floor(initialTimestamp / 1000),
+  );
+  const [currentDate, setCurrentDate] = useState(
+    () => new Date(initialTimestamp),
+  );
+  const digits = Array.from({ length: 11 }, (_, i) => i % 10); // extra 0 for smooth loop
+
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      const nowMs = Date.now();
+      setTimestamp(Math.floor(nowMs / 1000));
+      setCurrentDate(new Date(nowMs));
+    }, 1000);
+
+    return () => clearInterval(intervalId);
+  }, []);
+
+  const editionDay = currentDate.getDate();
+  const editionMonth = currentDate.toLocaleString("en-US", { month: "long" });
+
+  return (
+    <>
+      {/* 下方 CSS steps 动画模拟毫秒级的两位小数跳动效果 */}
+      <style jsx>{`
+        @keyframes digitTickerFast {
+          0% {
+            transform: translate3d(0, 0px, 0);
+          }
+          100% {
+            transform: translate3d(0, -100px, 0);
+          } /* 10px * 10 */
+        }
+        @keyframes digitTickerFaster {
+          0% {
+            transform: translate3d(0, 0px, 0);
+          }
+          100% {
+            transform: translate3d(0, -100px, 0);
+          }
+        }
+        .digit-slot {
+          position: relative;
+          display: inline-block;
+          height: 10px; /* 与 text-[10px] 对齐 */
+          width: 8px; /* 0.75em≈7.5px，改整数更稳 */
+          overflow: hidden;
+          line-height: 10px;
+          text-align: center;
+          vertical-align: baseline;
+        }
+        .digit-char {
+          height: 10px;
+          line-height: 10px;
+        }
+
+        .digit-seq {
+          display: flex;
+          flex-direction: column;
+          line-height: 10px;
+          will-change: transform;
+          transform: translate3d(0, 0, 0);
+        }
+        .digit-seq.fast {
+          animation: digitTickerFast 0.5s steps(10, end) infinite;
+        }
+        .digit-seq.faster {
+          animation: digitTickerFaster 0.2s steps(10, end) infinite;
+        }
+        .ms-digits {
+          display: inline-flex;
+          align-items: baseline; /* 关键：跟前面的数字同一基线 */
+          gap: 0; /* 融入感更强，必要时用 0.5px */
+          font: inherit; /* 继承 font-family/size/weight */
+          line-height: inherit; /* 继承行高 */
+          letter-spacing: inherit; /* 继承 tracking-widest */
+          color: inherit; /* 继承颜色 */
+          vertical-align: baseline;
+        }
+      `}</style>
+      <div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
+        Vol. {editionDay} | No.{" "}
+        <span className="inline-flex items-center align-middle">
+          <span>{timestamp}</span>
+          <span className="inline-flex items-center gap-[1px] align-middle ms-digits">
+            <span className="digit-slot">
+              <span className="digit-seq fast">
+                {digits.map((d) => (
+                  <span className="digit-char" key={`fast-${d}`}>
+                    {d}
+                  </span>
+                ))}
+              </span>
+            </span>
+            <span className="digit-slot">
+              <span className="digit-seq faster">
+                {digits.map((d) => (
+                  <span className="digit-char" key={`faster-${d}`}>
+                    {d}
+                  </span>
+                ))}
+              </span>
+            </span>
+          </span>
+        </span>{" "}
+        | {editionMonth} Edition
+      </div>
+    </>
+  );
+}

From 38ead2850f00345f5634bff3873c7f0ac048b2f1 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Sat, 10 Jan 2026 16:41:54 +0800
Subject: [PATCH 10/13] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=A1=AC?=
 =?UTF-8?q?=E7=BC=96=E7=A0=81=E9=A2=9C=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/globals.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/globals.css b/app/globals.css
index be2286cc..cb660474 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -88,7 +88,7 @@
     line-height: 1;
     font-family: var(--font-serif);
     margin-right: 0.5rem;
-    color: #cc0000;
+    color: var(--color-accent);
   }
 
   .ticker {

From 0029bb6fd2f311a599ee713465bc464f622c58a9 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Sat, 10 Jan 2026 17:13:12 +0800
Subject: [PATCH 11/13] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=9A=97?=
 =?UTF-8?q?=E9=BB=91=E6=A8=A1=E5=BC=8F=E4=B8=8D=E7=BB=9F=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/Footer.tsx         |  6 ++++++
 app/components/GiscusComments.tsx | 27 ++++++++++++++++++++++++++-
 app/globals.css                   |  1 +
 3 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx
index c3193b48..314be1f9 100644
--- a/app/components/Footer.tsx
+++ b/app/components/Footer.tsx
@@ -25,17 +25,23 @@ export function Footer() {
                 href="https://github.com/involutionhell"
                 target="_blank"
                 rel="noopener noreferrer"
+                aria-label="访问 GitHub"
+                title="访问 GitHub"
                 className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
               >
                 <Github className="h-5 w-5" />
+                <span className="sr-only">访问 GitHub</span>
               </a>
               <a
                 href="https://discord.com/invite/6CGP73ZWbD"
                 target="_blank"
                 rel="noopener noreferrer"
+                aria-label="加入 Discord 社区"
+                title="加入 Discord 社区"
                 className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
               >
                 <MessageCircle className="h-5 w-5" />
+                <span className="sr-only">加入 Discord 社区</span>
               </a>
             </div>
           </div>
diff --git a/app/components/GiscusComments.tsx b/app/components/GiscusComments.tsx
index c9c182cd..7b148efa 100644
--- a/app/components/GiscusComments.tsx
+++ b/app/components/GiscusComments.tsx
@@ -1,6 +1,8 @@
 "use client";
 
+import { useEffect, useState } from "react";
 import Giscus from "@giscus/react";
+import { useTheme } from "./ThemeProvider";
 
 interface GiscusCommentsProps {
   className?: string;
@@ -8,12 +10,35 @@ interface GiscusCommentsProps {
 }
 
 export function GiscusComments({ className, docId }: GiscusCommentsProps) {
+  const { theme } = useTheme();
   const normalizedDocId = typeof docId === "string" ? docId.trim() : "";
   const useSpecificMapping = normalizedDocId.length > 0;
+  const [resolvedTheme, setResolvedTheme] = useState<"light" | "dark">("light");
+
+  useEffect(() => {
+    const media = window.matchMedia("(prefers-color-scheme: dark)");
+    const calcResolved = (): "light" | "dark" => {
+      if (theme === "system") {
+        return media.matches ? "dark" : "light";
+      }
+      return theme === "dark" ? "dark" : "light";
+    };
+
+    setResolvedTheme(calcResolved());
+
+    if (theme === "system") {
+      const handler = () => setResolvedTheme(calcResolved());
+      media.addEventListener("change", handler);
+      return () => media.removeEventListener("change", handler);
+    }
+
+    return undefined;
+  }, [theme]);
 
   return (
     <div className={className}>
       <Giscus
+        key={resolvedTheme} // force re-render when theme changes
         repo="InvolutionHell/involutionhell"
         repoId="R_kgDOPuD_8A"
         category="Comments"
@@ -24,7 +49,7 @@ export function GiscusComments({ className, docId }: GiscusCommentsProps) {
         reactionsEnabled="1"
         emitMetadata="0"
         inputPosition="top"
-        theme="preferred_color_scheme"
+        theme={resolvedTheme}
         lang="zh-CN"
         loading="lazy"
       />
diff --git a/app/globals.css b/app/globals.css
index cb660474..1e193b11 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -26,6 +26,7 @@
 
 @layer base {
   * {
+    /* 统一方角风格：强制清零圆角；注意会影响第三方组件的默认圆角，如果需要圆角请在组件里覆盖或调整此规则 */
     border-radius: 0px !important;
     border-color: var(--foreground);
   }

From 7205af0c355779b403acbda590384ad08e705a3b Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Sat, 10 Jan 2026 17:31:08 +0800
Subject: [PATCH 12/13] fix: lint

---
 app/components/Contribute.tsx                 |  1 -
 app/components/Footer.tsx                     |  2 +-
 app/components/GiscusComments.tsx             | 31 +++++++++----------
 app/components/ZoteroFeed.tsx                 |  8 -----
 ...226\345\255\220\344\270\262_translated.md" |  4 +--
 5 files changed, 18 insertions(+), 28 deletions(-)

diff --git a/app/components/Contribute.tsx b/app/components/Contribute.tsx
index 00af5c4b..dff5ce03 100644
--- a/app/components/Contribute.tsx
+++ b/app/components/Contribute.tsx
@@ -13,7 +13,6 @@ import {
 } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { ExternalLink, Sparkles } from "lucide-react";
-import styles from "./Contribute.module.css";
 import { useRouter } from "next/navigation";
 
 // --- antd
diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx
index 314be1f9..e19f569a 100644
--- a/app/components/Footer.tsx
+++ b/app/components/Footer.tsx
@@ -1,5 +1,5 @@
 import Link from "next/link";
-import { Github, MessageCircle, ExternalLink } from "lucide-react";
+import { Github, MessageCircle } from "lucide-react";
 import { BrandMark } from "./BrandMark";
 import { LicenseNotice } from "./LicenseNotice";
 
diff --git a/app/components/GiscusComments.tsx b/app/components/GiscusComments.tsx
index 7b148efa..f32d27ae 100644
--- a/app/components/GiscusComments.tsx
+++ b/app/components/GiscusComments.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import Giscus from "@giscus/react";
 import { useTheme } from "./ThemeProvider";
 
@@ -13,27 +13,26 @@ export function GiscusComments({ className, docId }: GiscusCommentsProps) {
   const { theme } = useTheme();
   const normalizedDocId = typeof docId === "string" ? docId.trim() : "";
   const useSpecificMapping = normalizedDocId.length > 0;
-  const [resolvedTheme, setResolvedTheme] = useState<"light" | "dark">("light");
+  const [isSystemDark, setIsSystemDark] = useState(() => {
+    if (typeof window === "undefined") return false;
+    return window.matchMedia("(prefers-color-scheme: dark)").matches;
+  });
 
   useEffect(() => {
+    if (theme !== "system" || typeof window === "undefined") return;
     const media = window.matchMedia("(prefers-color-scheme: dark)");
-    const calcResolved = (): "light" | "dark" => {
-      if (theme === "system") {
-        return media.matches ? "dark" : "light";
-      }
-      return theme === "dark" ? "dark" : "light";
-    };
-
-    setResolvedTheme(calcResolved());
+    const handler = (event: MediaQueryListEvent) =>
+      setIsSystemDark(event.matches);
+    media.addEventListener("change", handler);
+    return () => media.removeEventListener("change", handler);
+  }, [theme]);
 
+  const resolvedTheme = useMemo<"light" | "dark">(() => {
     if (theme === "system") {
-      const handler = () => setResolvedTheme(calcResolved());
-      media.addEventListener("change", handler);
-      return () => media.removeEventListener("change", handler);
+      return isSystemDark ? "dark" : "light";
     }
-
-    return undefined;
-  }, [theme]);
+    return theme === "dark" ? "dark" : "light";
+  }, [isSystemDark, theme]);
 
   return (
     <div className={className}>
diff --git a/app/components/ZoteroFeed.tsx b/app/components/ZoteroFeed.tsx
index 85a55451..679c3e06 100644
--- a/app/components/ZoteroFeed.tsx
+++ b/app/components/ZoteroFeed.tsx
@@ -26,14 +26,6 @@ export function ZoteroFeed({
 }) {
   const [items, setItems] = React.useState<ZoteroItem[] | null>(null);
   const [error, setError] = React.useState<string | null>(null);
-  // Track which items' author lists are expanded
-  const [expandedAuthors, setExpandedAuthors] = React.useState<
-    Record<string, boolean>
-  >({});
-
-  const toggleAuthors = React.useCallback((key: string) => {
-    setExpandedAuthors((prev) => ({ ...prev, [key]: !prev[key] }));
-  }, []);
 
   React.useEffect(() => {
     const controller = new AbortController();
diff --git "a/app/docs/CommunityShare/Leetcode/76\346\234\200\345\260\217\350\246\206\347\233\226\345\255\220\344\270\262_translated.md" "b/app/docs/CommunityShare/Leetcode/76\346\234\200\345\260\217\350\246\206\347\233\226\345\255\220\344\270\262_translated.md"
index ce9cb663..7a733677 100644
--- "a/app/docs/CommunityShare/Leetcode/76\346\234\200\345\260\217\350\246\206\347\233\226\345\255\220\344\270\262_translated.md"
+++ "b/app/docs/CommunityShare/Leetcode/76\346\234\200\345\260\217\350\246\206\347\233\226\345\255\220\344\270\262_translated.md"
@@ -25,8 +25,8 @@ If you findt，Jump back
 > To improve the code, consider the following:
 > Use a dict dict_keys instead of the isAll function to track the count of each character in the current window, and update the count directly instead of using Counter function repeatedly.
 > Remove unused variables ans, hash_1, and dict_t.
-> Initialize right outside the loop, and use while right < len(s) and not isAll(dict_keys, dict_t) as the loop condition to terminate when all characters in t are present in the current window.
-> Keep track of the minimum window length and the start and end indices of the window, and return s[start:end + 1] at the end.
+> Initialize right outside the loop, and use while right &lt; len(s) and not isAll(dict_keys, dict_t) as the loop condition to terminate when all characters in t are present in the current window.
+> &gt; Keep track of the minimum window length and the start and end indices of the window, and return s[start:end + 1] at the end.
 > get()Method grammar：
 
 `dict.get(key[, value]) `

From 815049d113161135ed1f51abade7afe0597a8e64 Mon Sep 17 00:00:00 2001
From: longsizhuo <longsizhuo@gmail.com>
Date: Sat, 10 Jan 2026 18:39:28 +0800
Subject: [PATCH 13/13] =?UTF-8?q?fix:=20=E9=BB=91=E5=A4=9C=E3=80=81?=
 =?UTF-8?q?=E7=99=BD=E5=A4=A9=E6=A8=A1=E5=BC=8F=E5=8D=A1=E7=89=87=E7=BF=BB?=
 =?UTF-8?q?=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/Community.tsx  | 15 +++++----------
 app/components/ZoteroFeed.tsx |  7 +------
 2 files changed, 6 insertions(+), 16 deletions(-)

diff --git a/app/components/Community.tsx b/app/components/Community.tsx
index ab5bd674..65ffcefb 100644
--- a/app/components/Community.tsx
+++ b/app/components/Community.tsx
@@ -24,16 +24,11 @@ export function Community() {
           </div>
         </div>
 
-        {/* Main CTA Section - Inverted (Light Mode) / Normal (Dark Mode)
-                Design Decision: Keep high contrast.
-                Light Mode: Black Box, White Text.
-                Dark Mode: White Box, Black Text? Or Keep Black Box with White Border?
-                Let's go with Inverted relative to theme.
-            */}
-        <div className="mb-16 border-4 border-[var(--foreground)] bg-[var(--foreground)] text-[var(--background)] p-12 lg:p-24 relative overflow-hidden transition-colors duration-300">
+        {/* Main CTA Section */}
+        <div className="mb-16 border-4 border-[var(--foreground)] bg-[var(--background)] text-[var(--foreground)] p-12 lg:p-24 relative overflow-hidden transition-colors duration-300">
           <div className="relative z-10 max-w-3xl mx-auto text-center">
-            <div className="inline-block border border-[var(--background)] p-4 mb-8">
-              <BookOpen className="h-12 w-12 text-[var(--background)]" />
+            <div className="inline-block border border-[var(--foreground)] p-4 mb-8">
+              <BookOpen className="h-12 w-12 text-[var(--foreground)]" />
             </div>
             <h3 className="text-4xl md:text-6xl font-serif font-bold italic mb-6">
               内卷知识库
@@ -44,7 +39,7 @@ export function Community() {
             <Button
               variant="outline"
               asChild
-              className="bg-transparent border-[var(--background)] text-[var(--background)] hover:bg-[var(--background)] hover:text-[var(--foreground)] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
+              className="bg-transparent border-[var(--foreground)] text-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] px-12 py-8 h-auto font-sans text-sm uppercase tracking-widest font-bold"
             >
               <a href="docs/ai" target="_blank" rel="noopener noreferrer">
                 Access Articles / 访问文章{" "}
diff --git a/app/components/ZoteroFeed.tsx b/app/components/ZoteroFeed.tsx
index 679c3e06..a6bb8412 100644
--- a/app/components/ZoteroFeed.tsx
+++ b/app/components/ZoteroFeed.tsx
@@ -111,7 +111,6 @@ export function ZoteroFeed({
                 const venue = d.publicationTitle;
                 const date = d.date;
                 const key = it.key;
-                const isExpanded = !!expandedAuthors[key];
 
                 return (
                   <li
@@ -130,11 +129,7 @@ export function ZoteroFeed({
                       {title}
                     </a>
                     <div className="text-[11px] font-body text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
-                      {authors && (
-                        <span className={isExpanded ? "" : "line-clamp-1"}>
-                          {authors}
-                        </span>
-                      )}
+                      {authors && <span>{authors}</span>}
                       <div className="mt-2 font-mono text-[9px] uppercase tracking-wider text-neutral-500 flex gap-2">
                         {venue && (
                           <span className="truncate max-w-[150px]">