diff --git a/site/public/icons/claude.svg b/site/public/icons/claude.svg
new file mode 100644
index 0000000..1beee86
--- /dev/null
+++ b/site/public/icons/claude.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/site/public/icons/codex.png b/site/public/icons/codex.png
new file mode 100644
index 0000000..39e34ab
Binary files /dev/null and b/site/public/icons/codex.png differ
diff --git a/site/src/i18n/strings.ts b/site/src/i18n/strings.ts
index 61402ff..f797265 100644
--- a/site/src/i18n/strings.ts
+++ b/site/src/i18n/strings.ts
@@ -34,8 +34,20 @@ export const STRINGS = {
colophon: "Colophon",
colophonBody:
"Paper: #F4EEE2 · Ink: #1A1614 · Seal: #9A3B2C. Fonts: LXGW WenKai, Cormorant Garamond, IBM Plex Mono.",
- rights: "Index",
- rightsBody: "Content is written by humans. Source in GitHub.",
+ byline: "Credits",
+ bylineWriterBy: "panqiwei",
+ bylineWriterSuffix: "'s",
+ bylineContextBefore: "Distilled from ",
+ bylineContextMiddle: "agent harness work at ",
+ bylineContextAfter: ".",
+ bylineCommunityLabel: "design",
+ bylineCommunityBy: ["pandazki", "nanxingw"],
+ bylineAiTools: [
+ { label: "Claude", slug: "claude-code", icon: "/icons/claude.svg" },
+ { label: "Codex", slug: "codex", icon: "/icons/codex.png" },
+ ],
+ tankaHost: "Tanka.ai",
+ tankaUrl: "https://www.tanka.ai/",
},
},
zh: {
@@ -68,8 +80,20 @@ export const STRINGS = {
colophon: "版式",
colophonBody:
"纸 #F4EEE2 · 墨 #1A1614 · 朱印 #9A3B2C。字：霞鹜文楷 / Cormorant Garamond / IBM Plex Mono。",
- rights: "索引",
- rightsBody: "内容由人撰写，源码在 GitHub。",
+ byline: "落款",
+ bylineWriterBy: "panqiwei",
+ bylineWriterSuffix: "",
+ bylineContextBefore: "沉淀于 ",
+ bylineContextMiddle: " 在 ",
+ bylineContextAfter: " 做 agent harness 工作时的思考。",
+ bylineCommunityLabel: "设计",
+ bylineCommunityBy: ["pandazki", "nanxingw"],
+ bylineAiTools: [
+ { label: "Claude", slug: "claude-code", icon: "/icons/claude.svg" },
+ { label: "Codex", slug: "codex", icon: "/icons/codex.png" },
+ ],
+ tankaHost: "Tanka.ai",
+ tankaUrl: "https://www.tanka.ai/",
},
},
} as const;
diff --git a/site/src/pages/en/index.astro b/site/src/pages/en/index.astro
index b100e9e..1760180 100644
--- a/site/src/pages/en/index.astro
+++ b/site/src/pages/en/index.astro
@@ -3,6 +3,7 @@ import Hall from "~/layouts/Hall.astro";
import HomeMosaic from "~/components/HomeMosaic.astro";
import HomeStory from "~/components/HomeStory.astro";
import { t } from "~/i18n/strings";
+import { url, wikiEntry } from "~/lib/urls";
const locale = "en" as const;
const s = t(locale);
@@ -44,9 +45,36 @@ const s = t(locale);
{s.footer.colophon}
{s.footer.colophonBody}
-
- {s.footer.rights}
- {s.footer.rightsBody}
+
diff --git a/site/src/pages/zh/index.astro b/site/src/pages/zh/index.astro
index 0394682..0fbf5ad 100644
--- a/site/src/pages/zh/index.astro
+++ b/site/src/pages/zh/index.astro
@@ -3,6 +3,7 @@ import Hall from "~/layouts/Hall.astro";
import HomeMosaic from "~/components/HomeMosaic.astro";
import HomeStory from "~/components/HomeStory.astro";
import { t } from "~/i18n/strings";
+import { url, wikiEntry } from "~/lib/urls";
const locale = "zh" as const;
const s = t(locale);
@@ -44,9 +45,36 @@ const s = t(locale);
{s.footer.colophon}
{s.footer.colophonBody}
-
- {s.footer.rights}
- {s.footer.rightsBody}
+
diff --git a/site/src/styles/home.css b/site/src/styles/home.css
index 2d482bc..52ca9a4 100644
--- a/site/src/styles/home.css
+++ b/site/src/styles/home.css
@@ -235,8 +235,9 @@
/* ── 脚注 / 足部章节 ──────────────────────────── */
.home__foot {
margin-top: 100px;
- display: grid; grid-template-columns: 1fr 1fr 1fr;
- gap: 40px;
+ display: grid; grid-template-columns: minmax(260px, 0.78fr) minmax(300px, 0.88fr) max-content;
+ column-gap: clamp(32px, 4vw, 64px);
+ row-gap: 40px;
padding-top: 40px;
border-top: 1px solid var(--rule);
font-size: 0.85rem; line-height: 1.85;
@@ -250,6 +251,177 @@
}
.home__foot p { margin: 0 0 8px; }
+.home__foot__byline {
+ justify-self: end;
+}
+
+/* ── Byline column ──────────────────────────────────────────────
+ Replaces the old 索引/Index column with quiet attribution: one
+ source note and one design credit. Avatars are heavily
+ muted (grayscale + low opacity) so they read as small 落款 印
+ rather than photographic accents; hover restores them. */
+.home__foot__byline .byline__line {
+ display: flex; flex-wrap: wrap; align-items: center;
+ gap: 6px 8px;
+ margin: 0 0 6px;
+}
+.home__foot__byline .byline__credits {
+ flex-wrap: nowrap;
+ gap: 8px;
+}
+.home__foot__byline .byline__role {
+ font-family: var(--font-mono);
+ font-size: 0.62rem;
+ letter-spacing: 0.18em;
+ text-transform: uppercase;
+ color: var(--ink-whisper);
+}
+.home__foot__byline .byline__sep {
+ color: var(--ink-whisper);
+ font-size: 0.7rem;
+}
+.home__foot__byline .byline__person {
+ display: inline-flex; align-items: center; gap: 6px;
+ color: var(--ink-soft);
+ border: 0;
+ font-family: var(--font-mono);
+ font-size: 0.78rem;
+ letter-spacing: 0.02em;
+ transition: color var(--dur-quick) var(--ease-out);
+}
+.home__foot__byline .byline__person:hover {
+ color: var(--vermilion);
+}
+.home__foot__byline .byline__iconGroup {
+ display: inline-flex;
+ align-items: center;
+ gap: 5px;
+}
+.home__foot__byline .byline__icon {
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ flex: 0 0 auto;
+ color: var(--ink-soft);
+ border: 1px solid var(--rule);
+ background: color-mix(in srgb, var(--paper) 6%, transparent);
+ text-decoration: none;
+ transition: color var(--dur-quick) var(--ease-out),
+ border-color var(--dur-quick) var(--ease-out),
+ opacity var(--dur-quick) var(--ease-out);
+}
+.home__foot__byline .byline__icon:hover {
+ color: var(--vermilion);
+ border-color: color-mix(in srgb, var(--vermilion) 55%, var(--rule));
+ opacity: 0.95;
+}
+.home__foot__byline .byline__personIcon {
+ border: 0;
+ background: transparent;
+}
+.home__foot__byline .byline__toolIcon {
+ opacity: 0.82;
+}
+.home__foot__byline .byline__toolIcon img {
+ width: 16px;
+ height: 16px;
+ display: block;
+ object-fit: contain;
+ transition: filter var(--dur-quick) var(--ease-out),
+ opacity var(--dur-quick) var(--ease-out);
+}
+.home__foot__byline .byline__toolIcon[data-tool="claude-code"] img {
+ filter: brightness(0) saturate(100%) invert(63%) sepia(9%) saturate(430%) hue-rotate(358deg) brightness(84%) contrast(88%);
+}
+.home__foot__byline .byline__toolIcon[data-tool="claude-code"]:hover img {
+ filter: brightness(0) saturate(100%) invert(48%) sepia(82%) saturate(701%) hue-rotate(358deg) brightness(92%) contrast(92%);
+}
+.home__foot__byline .byline__toolIcon[data-tool="codex"] img {
+ width: 18px;
+ height: 18px;
+ border-radius: 5px;
+ filter: grayscale(1) saturate(0.2) contrast(0.88) brightness(0.95);
+ opacity: 0.78;
+}
+.home__foot__byline .byline__toolIcon[data-tool="codex"]:hover img {
+ filter: none;
+ opacity: 1;
+}
+.home__foot__byline .byline__amp {
+ font-family: var(--font-latin);
+ font-style: italic;
+ font-size: 0.92rem;
+ line-height: 1;
+ color: var(--ink-whisper);
+ transform: translateY(-1px);
+}
+.home__foot__byline .byline__avatar {
+ width: 22px; height: 22px;
+ border-radius: 50%;
+ display: block;
+ object-fit: cover;
+ filter: grayscale(1) contrast(0.75) brightness(1.08);
+ opacity: 0.55;
+ border: 1px solid var(--rule);
+ transition: filter var(--dur-base) var(--ease-out),
+ opacity var(--dur-base) var(--ease-out);
+}
+.home__foot__byline .byline__person:hover .byline__avatar {
+ filter: none;
+ opacity: 0.95;
+}
+.home__foot__byline .byline__personIcon:hover .byline__avatar {
+ filter: none;
+ opacity: 0.95;
+}
+.home__foot__byline .byline__context {
+ margin: 6px 0 14px;
+ padding-bottom: 12px;
+ border-bottom: 1px dashed var(--rule);
+ font-family: var(--font-han);
+ font-size: 0.82rem;
+ color: var(--ink-faint);
+ flex-wrap: nowrap;
+ white-space: nowrap;
+}
+.home__foot__byline .byline__context a {
+ color: var(--ink-soft);
+ border-bottom: 1px dotted var(--ink-whisper);
+ transition: color var(--dur-quick), border-color var(--dur-quick);
+}
+.home__foot__byline .byline__context a:hover {
+ color: var(--vermilion);
+ border-bottom-color: var(--vermilion);
+}
+
+@media (max-width: 1280px) {
+ .home__foot {
+ grid-template-columns: 1fr 1fr;
+ }
+ .home__foot__byline {
+ grid-column: 1 / -1;
+ justify-self: start;
+ width: 100%;
+ }
+ .home__foot__byline .byline__context {
+ flex-wrap: wrap;
+ white-space: normal;
+ }
+}
+
+@media (max-width: 820px) {
+ .home__foot {
+ grid-template-columns: 1fr;
+ gap: 28px;
+ }
+ .home__foot__byline {
+ grid-column: auto;
+ }
+}
+
/* ── 入场动效 ──────────────────────────────────── */
@keyframes rise {
from { opacity: 0; transform: translateY(20px); }
+ {s.footer.bylineWriterBy}{s.footer.bylineWriterSuffix}
+
+ {s.footer.bylineContextMiddle}
+ {s.footer.tankaHost}
+ {s.footer.bylineContextAfter}
+ 
+
+ ))}
+
+
+
+ {s.footer.bylineAiTools.map((tool) => (
+
+