从十条相邻品类参考到可交付设计系统：AiSOC 落地页竞品拆解（landing-page-references.md）实战解读

• 人工智能
• AI Agent
• 网络安全
• 后端
• 前端

AiSOC 的营销首页不是"照着某个安全厂商抄一个模板"，而是从十个相邻品类（开发者工具、开源基础设施、可观测性、DevSecOps）中抽取可复用的版式与信息结构模式，并逐条标注"该学什么、别学什么"。本文以 竞品参考拆解 为主线，把十条 teardown 逐条还原为可执行的设计决策，并对齐仓库里真实存在的实现文件（apps/web/src/app/page.tsx、apps/web/src/components/landing/sections/*、设计令牌规范、动效规范），最终给出一套"参考→令牌→组件→CI 校验"的完整落地路径。

一、这份文档在整包交付物中的位置

参考文档 自身声明它是landing-page-brief.md§16 的"伴侣文件"（companion）。也就是说，它不是一份独立的品牌指南，而是产品简报第 16 章"竞争性设计参考"的压缩拆解版。整包的六份文档关系如下：

这种分层很关键：参考文档负责"取舍判断"，令牌与配方负责"实现约束"。只看参考文档会得到一堆形容词（"calm""disciplined""technical"），必须配合令牌文档才能变成cubic-bezier(0.16, 1, 0.3, 1)这样的可交付值。

二、参考集的选取原则：为什么必须是"相邻品类"

文档开头给了两条硬性约束，理解它们才能理解后面所有"avoid"：

1. 品类相邻但不竞争：developer tools、open-source infrastructure、observability、DevSecOps。十个参考站点全部属于这四类，没有一个是 SOC 产品。
2. 全仓库禁止出现 SOC 竞品名：文档明确写"PerAGENTS.md, no Security-Operations Center competitor product names appear here or anywhere else in the repo."

第 2 条不是写作风格建议，而是被 CI 强制的仓库规则。AGENTS.md 的"不可协商规则"里写道：

No competitor product namedoutside an integration surface. Where one is the benchmark for a comparison, refer to it neutrally and keep the analysis.scripts/check_competitor_names.pyenforces it;scripts/competitor_names.tomlholds the integration allow-list.

执行细节在 check_competitor_names.py 与 competitor_names.toml 中。配置采用双列表结构，避免"一刀切 grep"误伤连接器代码：

[[competitors]] name = "Prophet Security" pattern = '\bProphet\s+Security\b|\bProphet\s+AI\b' neutral = "the reference autonomous-triage platform" [[competitors]] name = "Dropzone AI" pattern = '\bDropzone\s*AI\b|Dropzone\.ai\b' neutral = "the autonomous first-line-response challenger"

• [[competitors]]：禁止出现的产品名（正则），并给出中立替代表述（neutral），保证"比较的实质内容"不丢——比较的能力项、差距方向、差距量级仍然保留。
• [[allow]]：按路径白名单豁免，例如某个连接器模块、插件 manifest、正常化配置里提到厂商名是正确的。
• [[comparison_surfaces]]：更高压的一层——已发布的对比表按起止标记锁定，表内任何厂商名（包括自己集成的厂商）都算违规，因为对比表的唯一职责就是定位。

这个门禁还刻意做成双向校验：正则如果匹配不到任何文件算"死模式"失败；豁免路径如果已不再包含它所豁免的名字，算"过期豁免"失败。脚本头部对此有明确说明——仓库里最常见的坏味道是"A 对 B 检查、从不 B 对 A"，于是漂移在真正变化的方向上溜过去。

对写作者/设计者的实际含义：本文所有参考对象都只能是 Linear、Vercel、PlanetScale 这类相邻品类站点；想表达"我们比某个闭源 AI SOC 更透明"，只能写成"the reference autonomous-triage platform"，且必须保留可比项。这条规则同时解释了参考文档里反复出现的 "anchor on the category, not a foil"。

三、十条参考逐条拆解（Steal / Avoid → AiSOC 落地）

参考文档的统一结构是：URL · what to steal · what to avoid。下面逐条还原，并补上仓库里对应的实现或反例。注意：文档中的外站地址在此不复述，仅以产品名指代。

3.1 Linear —— 有主张的排版与"一功能一图一段"

Steal：Inter Display + Inter Variable 的字体栈；拒绝轮播的单列 hero，让 H1 独自承担页面；用克制的动效截图展示产品界面，而不是油亮的 3D；最有价值的是"产品叙事段"节奏——一个功能、一张大图、一段话，循环。

Avoid：渐变堆叠的 "hero glow" 背景读起来像时装而非工程；正文里的大写全大写分类标签在小字号下伤害可读性。

落地证据：Hero 采用"左栏论述 + 右栏真实控制台截图"的非对称双栏，而不是居中四词标题：

// apps/web/src/components/landing/sections/Hero.tsx <div className="mx-auto grid max-w-7xl grid-cols-1 items-center gap-16 px-6 lg:grid-cols-[1.1fr_1fr]">

H1 是一句完整判断（An auditable AI SOC.），而非口号碎片；字号在令牌里落在display.2xl（64/56、-0.02em、700）与移动端display.md（32/30）之间切换，见 设计令牌 §3.1。字体不是新引入的——令牌文档明确 "No new fonts"，沿用已加载的var(--font-inter)与var(--font-mono)。

值得注意的反向证据：早期 Hero 确实是"居中、四词、逐词动画"的形态，源码注释记录了为什么被重写——转化目标是 clone 而不是注册，且首屏完全没有产品图像。这正是 Linear 那条"让 H1 承担页面"被误读为"只放四个词"后的修正。

3.2 Vercel —— 高密度但不拥挤，CTA 常驻，定价不藏

Steal：首页功能网格的信息密度；滚动过程中始终可见的明确主 CTA；定价在落地页就被承认，而不是全部塞进另一个营销漏斗；明暗主题对等（对 AiSOC 重要，因为已有 CSS 变量主题层）。

Avoid："我们是记录系统/平台"的框架——AiSOC 只做一件事，不要把自己包装成吞掉整个技术栈的平台。

落地证据：

1. CTA 常驻：StickyNav.tsx 是全站营销 chrome 的唯一实现，滚动 12 px 后转为不透明 + 1 px 发丝线 + backdrop blur；导航链接数组把Benchmark、Pricing指向真实独立页面：

const NAV_LINKS: ReadonlyArray<{ label: string; href: string }> = [ { label: 'Product', href: '/#product' }, { label: 'Solutions', href: '/#pillars' }, { label: 'Connectors', href: '/#connectors' }, { label: 'Benchmark', href: '/benchmark' }, { label: 'Pricing', href: '/pricing' }, { label: 'Docs', href: docs('intro') }, ];

注释里还标注了一条易踩的坑：href 必须是绝对路径（/#solution而非#solution），因为统一导航现在也渲染在子页面上。

2. 主题对等但落地页锁定暗色：globals.css 中:root, [data-theme="dark"]与[data-theme="light"]各有一套--surface-*/--fg-*；tailwind.config.ts 把它们映射为surface.*/fg.*。但根路由apps/web/src/app/page.tsx用嵌套data-theme="dark"边界把落地页暗色锁定，注释给出的理由是：所有渐变、glow、tint 都是按暗色调过的，迁移到可主题化令牌成本高而买家无感；控制台 chrome 仍尊重主题切换。这就是令牌文档 §1 中"Light-mode landing deferred to v1.1"的实现依据。

3. 拒绝平台化叙事：landing.*与velvet.*命名空间都是严格附加的，不会污染控制台调色板——命名空间隔离本身就是"一个工具做一件事"的工程表达。

3.3 PlanetScale —— 把 benchmark 当营销，但要给方法论链接

Steal：三个巨大数字 + 一行说明 + 正下方"阅读方法论"链接；这是"诚实披露性能而不把限定条件埋进小字"的黄金标准，且直接对应 AiSOC 的 substrate 与 wet-eval 双口径披露。

Avoid：厚重的产品等距插画。AiSOC 的领域更适合四 agent 拓扑与实体图的干净线稿示意图，而不是风格化等距服务器。

落地证据：

• 组件：BenchmarkBand.tsx，section id 为benchmark，标题 id 为benchmark-heading，与 brief §6.j 的 slug 约定一致。
• 数字口径：brief 要求每个大数字明确标注substrate或wet-eval。仓库的门禁与评测入口是 scripts/run_evals.py，方法论文档在 apps/docs/docs/benchmark-methodology.md。这里的关键不是"数字多大"，而是"数字来自哪条 suite"。
• 数字排版：令牌文档规定所有指标用 mono +font-feature-settings:"tnum" 1，mono.md用于"big metric mantissa"，mono.xs用于%/ms后缀——数字不错位本身就是可信度的一部分。
• 线条优于等距：设计令牌 §9 的禁令清单直接写明 banned：isometric server rooms，允许优先级为 ① 示意图线稿 SVG ② 真实产品暗色截图 ③ 实拍开发者照片。

3.4 Supabase —— "开源时刻"要独立成段

Steal：专门一节承载 repo card、star 数、许可证声明与一条命令 quickstart；"everything is in the box" 的功能矩阵适合连接器 + marketplace 部分。

Avoid："我们是 {某超大规模厂商} 的开源替代"这种对比框架——不能点名竞品，要锚定品类而非假想敌。

落地证据：

• 独立 section：OpenSourceMoment.tsx，id=open-source。
• 一条命令起步：pnpm aisoc:demo（brief §5 P4 与 §6.l 引用；脚本实体为 scripts/aisoc-demo.ts）。贡献入口指向 CONTRIBUTING.md。
• 数字纪律：市场与检测数量必须从生成产物读取，不能手打。apps/web/src/data/corpusStats.ts 顶部注明由scripts/generate_corpus_stats.py自动生成，并严格区分EXECUTABLE_DETECTION_COUNT（融合引擎真正加载的规则）与DETECTIONS_ON_DISK（索引语料，多数被隔离、从不评估）：

/** Rules the fusion engine loads and evaluates. */ export const EXECUTABLE_DETECTION_COUNT: number = data.executable; /** Detection YAML indexed in the marketplace, quarantined rules included. */ export const DETECTIONS_ON_DISK: number = data.onDisk;

同理 apps/web/src/data/connectorCount.ts 由scripts/generate_connector_count.py生成，计数源头是_CONNECTOR_CLASSES元组。Hero 与 ConnectorsMarquee 都从这里导入，源码注释甚至记下了历史事故："The landing page has published three different wrong corpus figures by hand-typing them."

3.5 Grafana Labs —— 讲"运维叙事"，而不是功能墙

Steal：在落地页上描述操作者在什么顺序下看到哪些信号；"for developers / for SREs / for security" 这类以画像为锚的子导航，可在 solution 页面复用为 L1 分析师 / SOC 经理 / CISO。

Avoid：页脚里过度膨胀的产品标记矩阵。页脚卫生很重要——文档给出的硬约束是最多五列。

落地证据：画像定义在 产品简报 §3（SOC analyst、SOC manager / detection engineer、CISO），每类都有 jobs-to-be-done、click triggers、bounce triggers、技术素养与异议。这些字段不是文案装饰，而是直接决定 section 的取舍：分析师会因为"顶部就放价格表""出现 platform 这个词""stock-photo 分析师"而跳出，于是 hero 文案加权给分析师，而价格只做 teaser。页脚五列约定在 Footer.tsx 中实现，对应 brief §6.q 的 Product / Resources / Company / Legal / Status & GitHub。

3.6 Sentry —— 首屏必须是真产品

Steal：把 live product 放到 fold 之上（他们的 hero 直接展示 issue list 与 stack trace）。对 AiSOC，等价物是让Investigation Ledger可见——不是动画，而是一张真实 case 的截图。把 demo embed 当产品，而不是装饰。

Avoid：喧闹的配色（橙、品红）。AiSOC 既有令牌——graphite、near-black、indigo、ember——更克制，不要被更响的强调色搅浑。

落地证据：

• 首屏右栏是控制台真实截图，而非手绘模拟。Hero.tsx 注释明确：合成是"论证在左、控制台真实截图在右、产生它的两条命令在下方"，并且"背景保留 SVG 网格和单角 spotlight，两者都是无 JS 的静态 filter/mask，因此 LCP 元素仍是 H1 字符串"。
• 一段"从假 demo 到真 tour"的仓库史：apps/web/src/app/page.tsx的模块注释记载，DemoEmbed曾经画了一份手工虚构的 Investigation Ledger——虚构的 incident id、虚构的置信度、对某个具名托管模型的虚构花费，而且是全站唯一"声称展示控制台"的地方；Testimonials则在已经关闭的窗口里招揽参考客户。两者被ProductTour（四张运行中栈的截图）与HonestLimits（产品尚不支持的清单）替代，且都是 server component——被替换掉的那一对此前为了给不真实的主张做动画，引入了 framer-motion、BorderBeam 和 meteor 场。
• 配色纪律：令牌 §2.3 明确severity.{critical,high,medium,low,info}只出现在产品截图内部，不属于营销调色板；§10 禁令第 7 条更直接："The wordseverityoutside product screenshots."

3.7 Tailscale —— 一张手绘图讲清一个复杂原语

Steal：用单张手绘示意图 + 三段短话解释"identity-aware mesh networking"；他们的 "How it works" 也是架构深潜页的干净范式。AiSOC solution 段里的四 agent 拓扑应当是一张清晰示意，而不是庞杂架构图。

Avoid：依赖图库开发者照片。文档直接指向apps/docs/static/img/的线稿，并声明摄影在 brief §7 属于禁止项。

落地证据：

• SolutionAgents.tsx，id=solution。四条 agent 的顺序语义（Detect → Triage → Hunt → Respond，Respond 是终点）由动效规范中的agent-beam承担：滚动时绘制一次（1500 ms，自定义曲线收束在最后一个节点），随后每 6 s 循环，把刚画好的路径淡到 30% 再重绘；静态 SVG 路径是默认渲染，因此该 section 永远不会因 JS 失败而破相。
• 四 agent 是硬约束而非文案选择：brief §5 P3 指出services/agents/tests/test_four_agent_facade.py会在引入第五个公开 agent 类时让 CI 失败。营销图不能画出代码里不存在的第五个节点——这正是"每条主张可回溯到文件路径"的具体形态。
• no stock photo 的可执行版本：令牌 §9 的 banned 列表（stock photography、shield-on-circuit、glowing brains、padlock-on-keyboard、hooded-hacker、isometric server rooms）；允许清单里"captured developer photography（无人脸、低调光）"仅限 open-source 段"if needed"。

3.8 Render —— 部署选项卡片网格要带"到达时间"

Steal：每张卡展示部署路径、time-to-live、运维模型。这正是 brief §6.kdeploy段要镜像的模式；一键部署按钮（badge、渐变、阴影）是sovereign页现有按钮的近乎完美参考。

Avoid：hero 自动播放视频——在中端笔记本上会直接掐死 LCP。坚持静态 hero 截图，动效必须挂在prefers-reduced-motion: no-preference之后。

落地证据：

• DeployOptions.tsx，id=deploy。三卡结构（Managed / Self-host / Sovereign-air-gap）对应 brief §6.k，中卡作为默认推荐带轻微品牌 glow。
• 六个部署目标均有实体：infra/helm/aisoc/（Helm）、infra/terraform/（AWS）、infra/compose/docker-compose.airgap.yml（气隙 overlay，内含固定版本 Ollama sidecar）、infra/fly/、render.yaml、以及 Compose 一键启动。气隙相关运维说明在 apps/docs/docs/operations/air-gapped.md。
• LCP 语料：根页面把 fold 之上（StickyNav、Hero、ProofStrip、Problem）改为急切导入，其余用next/dynamic代码分割，注释说明目标是"initial JS chunk 远低于 brief §12 的 180 kB gzipped 预算"——注意这与 brief §12 写的"≤ 110 KB above the fold"是两个不同口径，实现注释用的是整块初始 chunk 预算，写文案时必须区分，不能混引。

3.9 Cloudflare Workers —— FAQ 的技术具体性

Steal：干净手风琴、两句话答案、术语精确但不堆砌黑话；GitHub star 用小 chip（星形字形 + 公共 API 刷新计数）。

Avoid：hero 里罗列所有相邻产品。AiSOC 是一个产品，落地页允许聚焦。

落地证据：

• Faq.tsx，id=faq，首两项默认展开（brief §6.o），键盘可达（Enter / Space 切换），视觉克制无投影。
• 结构化的 FAQ 不是"另写一份"：apps/web/src/app/page.tsx中的faqJsonLd与可见文案同源，SoftwareApplication结构化数据里的featureList也复用了生成常量（连接器数、可执行检测数）。这保证 SEO 抓取路径与人类看到的内容一致。
• star chip 的失败态在设计阶段就写明：静态 "Star on GitHub" pill（组件配方 §1），JS 关闭时退化为静态<header>+ 锚点，汉堡菜单失败时退化为<details>。

3.10 Hashicorp —— 开源与企业版讲成一个故事

Steal：在深度技术产品页与企业级顶层落地页之间搭桥；"企业语气但不企业腔"很难做到，而他们稳定做到；把开源与商业作为一条叙事（而非两条营销线），正是 AiSOC 在 GitHub 社区与托管 waitlist 之间需要的那座桥。

Avoid：密集的巨型导航菜单。AiSOC 导航至多六项，句号。

落地证据：NAV_LINKS恰好六项；主 CTA 的落地目标是仓库而不是维护者的托管实例——StickyNav.tsx注释写得很直白："它曾经是 Open dashboard，指向维护者的托管主机。这在两个层面都是错误的目的地：这个项目想要的转化是 clone，而且一个开源自托管落地页不该把另一个部署的主机名当成产品大门。"这条与 scripts/check_hosted_hostname.py 的仓库门禁同源：托管主机名只能出现在签核过的位置（托管实例部署配置、描述托管服务的营销页、变更日志），且允许清单按路径记录精确期望出现次数，多一次少一次都算失败。

四、模式级结论：十条可执行规则与落地状态

参考文档末尾把十条 teardown 归纳为十条 pattern-level takeaways，这是整份文档最高密度的部分。下表补充了每条在仓库中的实现锚点与需要的口径注意：

有一条容易被忽略的落差需要说清：参考文档写的是"该学什么"，不等于"已经在线上"。例如第 6 条（画像子导航）在 brief §6 里仍是"once we ship the dedicated solution pages"，第 9 条在落地页上是"暗色锁定 + 令牌为 v1.1 预留"，第 4 条曾长期不成立，直到ProductTour替换掉虚构 demo。写营销文案或做验收时，必须区分"设计意图"与"当前实现"。

五、从 teardown 到数值：参考如何被令牌与动效规范"锁死"

参考文档里"calm and purposeful""micro-interactions that reward reading"这类判断无法直接交付。AiSOC 的做法是在令牌层把形容词变成数值，在动效层把数值变成降级承诺。

5.1 颜色与表面：参考的"克制"变成可 diff 的十六进制

设计令牌 §2.1 给出七级暗色表面，逐级仅提升约 3% 亮度，用"抬升"而非硬阴影表达层级；surface.base #0a0d14是带约 1.3% chroma（hue 252）的近黑。这套值与 globals.css 完全对齐：

:root, [data-theme="dark"] { --surface-base: #0a0d14; --surface-raised: #11151f; --surface-card: #141926; --surface-hover: #1a2030; --surface-subtle: #0d1119; --surface-border: rgba(148, 163, 184, 0.12); --surface-divider: rgba(148, 163, 184, 0.08); --fg-primary: #e2e8f0; --fg-secondary: #cbd5e1; --fg-muted: #9ca3af; --fg-subtle: #6b7280; }

营销专用渐变也以 CSS 变量形式存在（同时被tailwind.config.ts的backgroundImage映射为bg-landing-grad-*）：

--landing-grad-hero: linear-gradient(to bottom right, #1d4ed8 0%, #0a0d14 80%); --landing-grad-pillars: linear-gradient(to right, #3b82f6 0%, #8b5cf6 100%); --landing-grad-cta: linear-gradient(to bottom right, #3b82f6 0%, #1d4ed8 100%);

为什么要强调"变量而非字面量"？令牌 §10 的禁令清单给了答案：组件内不允许内联#hex、内联px间距、内联rgba()阴影、内联cubic-bezier()，也不允许 Tailwind 任意值（text-[14.5px]、bg-[#123456]），唯一例外是 OG 图生成器（Satori 强制要求字面 hex，仓库内当前唯一的 Satori 路由是apps/web/src/app/r/[slug]/opengraph-image.tsx）。换句话说，Supabase 那条"主题对等"只有在禁止字面量时才可能长期成立。

5.2 动效：把 "Avoid 自动播放视频" 写成 12 行表格

动效规范 的编排表是本文档最有价值的工程化产物：每行一个 PR 级单元，列包含 ID、位置、触发、进入时长/缓动、退出时长/缓动、stagger、reduced-motion 降级、目的。几个代表性条目：

• hero-h1-reveal：800 msout-expo，30 ms/词 stagger，总计约 920 ms，"落在有线笔记本 1.2 s LCP 预算内"；且明确filter={false}——在 56–64 px 下模糊会被读成渲染错误。
• connector-marquee：两行 60 s / 75 s，hover 同时暂停两行（只停一行会在光标边界抖动）；reduced-motion 降级为18 个 logo 的 5 列静态网格——静态美术仍然成立。
• number-ticker-benchmark：200 ms/瓦片间隔；第 2 个瓦片是字符串 "Sub-minute"，不做 ticker；reduced-motion 直接渲染终值。
• accordion-toggle：非对称时长，展开 250 ms、收起 150 ms——"收得快显得可控，开得慢让内容读得进去"。
• card-hover-lift：2 px translate-Y +landing.shadow.1 → .2；reduced-motion 丢掉位移，保留阴影与图标色变化。

降级策略是两层的：全局 CSS 把动画压到 0.01 ms（globals.css 第 198 行起的@media (prefers-reduced-motion: reduce)块），在此之上分区 JS 门禁用useReducedMotion()（framer-motion 已有依赖）在挂载层面跳过。规范还给了硬预算，超出即需先在表里立项：

这张表直接兑现了 Linear 的 "avoid 重着色器拖慢首绘"、Render 的 "avoid 自动播放视频"、Resend 式的 "avoid 永不停止的 hero loop"（后者出现在 brief §16 的扩展参考里）。

六、三个"好看的坑"：仓库里真实被否决的反模式

参考文档的 Avoid 栏目如果不落到代码评审里，就只是意见。以下三例是仓库中已经走完"踩坑—评估—替换"闭环的，最适合作为同类项目的反面教材。

坑 1：虚构的 demo 比没有 demo 更糟。DemoEmbed用手工数据画了一个 Investigation Ledger：虚构 incident id、虚构 confidence、对具名托管模型的虚构花费。它不是"示意图"，而是唯一自称展示产品的地方。替代方案ProductTour是四张运行中栈的截图。对应到参考文档：Sentry 的 "treat the demo embed as the product" 被严格执行了——如果拿不出真截图，就别放截图。

坑 2：占位 logo 墙等于虚构背书。ProofStrip曾经在 "Reference partners onboarding through Q2 2026" 之下放四个虚线 "Partner A–D" chip。代码注释的判断值得引用：这些 chip 虽是占位而非伪造 logo，但"四个 chip 断言了一个本仓库无法支撑的合作方数量，而日期早已过期"；"一个暗示四个伙伴的空状态，是伪造 logo 墙的弱化版，而不是中立缺席"，因此"没有设计伙伴"的诚实渲染方式是什么都不渲染，等真有可具名的伙伴再恢复。这与 Supabase 那条 "star 数 + license 声明"的 steal 并不矛盾：可以展示可验证的数字，不能展示不可验证的关系。

坑 3：把 H1 拆成四词 + 逐词动画，会同时输掉可读性与 LCP。早期 hero 是居中、四词、逐词揭示；现行实现改为左论述右截图，并把背景降级为无 JS 的静态 filter/mask，确保 LCP 元素是文本 H1 而不是动画容器。动效规范保留了文本揭示的动效词汇（hero-h1-reveal），但把它用在完整句子上，而非口号碎片。

七、验收：让"参考"变成可回归的检查项

一份设计参考要长期生效，必须有机器可查的把手。AiSOC 在这条链上至少有四道闸：

1. 竞品命名闸：scripts/check_competitor_names.py + scripts/competitor_names.toml。双向校验（死模式失败、过期豁免失败），对比表区域加压。
2. 托管主机名闸：scripts/check_hosted_hostname.py。按路径记录精确期望次数，自托管者永远不会在自己的安装里看到别人的主机名。
3. 可访问性闸：apps/web/src/test/a11y.test.tsx 用 axe-core / vitest-axe 扫首五分钟路径上的关键界面（LandingHero、OnboardingStartHero、ThemeToggle、TopBar、Sidebar、EmptyState、CopilotDock）。注意它对color-contrast的处理——jsdom 不为 CSS 变量计算样式，该规则返回 incomplete，因此显式禁用，改由人工对比度评审 + 语义令牌层保证。这解释了为什么令牌层必须是"唯一调对比度的地方"。
4. 数字一致性闸：scripts/generate_connector_count.py 与 scripts/generate_corpus_stats.py 生成的 connectorCount.ts / corpusStats.ts 是文案数字的唯一来源。落地页曾经手打出三个不同的错误语料数字——这就是"文档里写 84 或 26 都必须以生成产物为准"的原因。

新增一条参考时的自查清单（可作为 PR 模板）：

• 该参考是否属于相邻品类，且不构成 SOC 直接竞争？
• "steal" 能否映射到某个 section id（nav…footer）与某个令牌或动效行？
• "avoid" 是否写成了可检查的禁令（像素、时长、色彩、字体、素材类型）？
• 引入的动效是否落在 12 行编排表内、并有 reduced-motion 降级？
• 提到的任何外部产品名是否会触发check_competitor_names.py？
• 引用的任何仓库路径是否真实存在（禁止编造路径）？

八、结语：参考文档的真正价值是"约束"而非"灵感"

把 landing-page-references.md 读完，容易记住的是十个站点名；真正决定 AiSOC 首页形态的，是它带出的三条约束链：

1. 品类约束（只学相邻品类 + 竞品名禁入）→ 由 check_competitor_names.py 执行；
2. 数值约束（steal 必须落成令牌，avoid 必须落成禁令）→ 由 设计令牌规范 的 §10 与 动效规范 的预算表执行；
3. 真实性约束（截图必须来自运行中的栈，数字必须来自生成产物，占位不能暗示背书）→ 由ProductTour/HonestLimits的替换史与apps/web/src/data/*的生成链执行。

也正因为此，落地页上几乎每一句主张都能回到一个文件：四 agent 拓扑回到services/agents/tests/test_four_agent_facade.py，可执行检测数回到corpusStats.ts，气隙部署回到 infra/compose/docker-compose.airgap.yml，动效降级回到 globals.css。设计参考可以借别人的版式，但证据必须长在自己的仓库里——这才是这份 teardown 文档最想传达的东西。

• 人工智能
• AI Agent
• 网络安全
• 后端
• 前端