朗福是一家节能环保企业，它的官网要同时服务中文和英文两类客户，又不能沦为一套「模板套皮」的展示页——它得像公司交付的工程一样，经得起细看。
我把整站按「单一数据源」立骨：色彩、字体、文案、组件各自集中定义、统一引入，深浅主题只是一次 token 翻转；中英双语走成对路由，每一页两种语言严格对齐。首屏 Hero 不套现成库，自研了一套生成式热流，让它是「活的仪器」而不是一张静态大图。
站点上线在香港服务器，由 Caddy 自动签发并续期 HTTPS；桌面版 Lighthouse 的性能、无障碍、最佳实践、SEO 四项均为满分。更要紧的是把「好看」变成可回归的工程——一条 Playwright 视觉流水线在每次构建时自动拦截重叠、溢出、坏图、数字归零，肉眼会漏的版面事故，代码先一步拦下。
这套纪律不是一次性的。你正在看的 Kikoman，正是这套设计内核的一次 fork 与再主题化——同一副骨架，换掉品牌色与内容，几处 token 就长成了另一个站。工程纪律在这里第一次证明了它是可迁移的资产，而不只是一个项目的收尾。 fork 全记录 →
亮点
- 单一数据源架构：色彩 / 字体 / 文案 / 组件集中定义，AI 可无脑维护
- Playwright 视觉守门：重叠、溢出、坏图、数字归零自动拦截
- 深浅主题 token 翻转，一处定义、全站适配
100×4Lighthouse 四项性能、无障碍、最佳实践、SEO 桌面版满分（langfusave.com 实测）
2 语全站双语每页中英成对路由，i18n 键差集为零
1 处深浅主题信号色与底色走 token，一处定义、全站翻转
4 类视觉守门Playwright 每次构建拦截重叠、溢出、坏图、数字归零
