暖白纸感、玻璃层、
与一套安静的秩序。

主色板建立在暖白纸底（--bg #FAF8F4）+ 真墨（--ink #3A3936）+ 极少朱砂（--accent #A65D4E）之上。每个色块下方标注变量名与实际值。

演讲档案按听众场景分五类，各有一枚彩色胶囊徽章（.scene-*），也用作对应实录页的主色调。

五个字体族：西文无衬线 Inter Tight、中文无衬线 Noto Sans SC / PingFang SC、西文衬线 Source Serif 4（斜体多用于 accent 词）、中文衬线 Noto Serif SC / Songti SC（标题）、等宽 JetBrains Mono（英文小字·索引·徽标）。

演讲档案的“现场实录”页是一套独立、自包含的阅读优化排版（不走玻璃系统，走纸感底 --paper #f4f1ea）。正文无衬线 18px / 行高 1.9 / 字间 .01em / 段距 27px；行宽 700px（中文一行约 34–36 字）；标题用宋体，h2 上限 32px、分节间距 56–90px，每节前配 accent 色“中文序号 · 主题词”的 .part-tag；金句用 accent 加粗即高亮，整段金句用 accent 左边线宋体引块；引号一律中文弯引号 “”；称呼“现场实录”，标注“现场录音 · 后期精修”。下面是一段真实排版复刻：

基准 --base-size 16px；内容容器 --max 1280px、边距 --gutter 40px（窄屏降到 32 / 28 / 20px）。间距以 8 的倍数为节律。

动效应像光影、纸张和空气，而不是像组件在机械运动。安静、缓慢、克制——推荐缓慢渐变、轻微漂移、柔和光晕与局部 hover 反馈。body 背景本身以 26s 的 ambientWash 缓慢漂移。

设计要“安静”，但不能把可用性一并安静掉。焦点态、动效偏好、对比度、移动断点，是这套系统对每一位读者的基本尊重。

所有链接、按钮在键盘 Tab 聚焦时给出 2px accent 描边、3px 外偏移的可见焦点环（:focus-visible，鼠标点击不触发）。绝不用 outline:none 抹掉焦点而不给替代；个别原生控件（文本框、滑块）的 outline:none 由全局 :focus-visible 焦点环补偿。

尊重系统“减弱动态效果”偏好：命中 prefers-reduced-motion: reduce 时，全站关闭平滑滚动，过渡与动画时长压到 .001ms（背景漂移、卡片上浮、翻书全部静止）。这是兜底规则，与既有的逐组件 animation:none 叠加。

朱砂 accent（亮 #A65D4E / 暗 #D28A7E）作为**强调色**，在纸底上对正文小字的对比度接近 AA 临界（亮色约 4.0–4.6:1，随背景层加深而下降），**并非稳过**。因此约定：accent 仅用于强调、大字、图形与徽章；正文小字一律用 --ink（对比度充裕）以确保 WCAG AA。不因对比而改动 accent 色值——accent 的定位就是“克制的强调”，不是正文色。实录页的紫 accent 同理，只做大字金句与左边线，不做小字长文。

主站在 ≤600px / ≤380px 收敛网格与字号；实录页在 ≤600px 单独精修：正文降到 16.5px、行高 1.85，分节标题 clamp(21px,6vw,26px)，容器边距收到 18px，保证窄屏一行中文字数与留白仍然舒适。

设计系统有“三层单一真源”。改样式先认准该改哪一层，别在别处复制一份，否则很快各说各话。

样式与脚本引用统一带 ?v= 版本号（如 styles.css?v=glass-20260701、site-footer.js?v=20260722）。改了文件就同步升 ?v=，强制客户端拉新，避免 CDN / 浏览器旧缓存。

改动先在本地预览，用户确认后再推（推即上线）。跨机协作走 git worktree 做隔离改动，**只快进推送，别强推**（--force 会覆盖他机未同步的提交）；遇冲突先拉取合并，把改动收敛回对应真源，再干净推送。