用途：这是一套设计工程原则，用于在构建或审查 UI 代码时，让界面显得更精致。核心观点是优秀界面来自大量小细节的叠加。
主要能力：分为四类。排版：标题用 text-wrap: balance，正文用 text-wrap: pretty，动态数字用 font-variant-numeric: tabular-nums，macOS 根布局加 -webkit-font-smoothing: antialiased。表面：嵌套元素用同心圆角（外圆角=内圆角+内边距），图标做视觉对齐而非几何居中，用多层透明 box-shadow 代替硬边框，图片加 1px 低透明度描边（浅色模式纯黑 rgba(0,0,0,0.1)，深色模式纯白 rgba(255,255,255,0.1)）。动画：交互状态用可中断的 CSS transition，一次性序列用 keyframes；入场动画拆分语义块并以约 100ms 错开；退场用小幅固定 translateY；图标切换用 opacity、scale、blur 过渡（scale 0.25→1，opacity 0→1，blur 4px→0px），有 motion 库时用 spring、duration 0.3、bounce 0，无库则两个图标都留在 DOM 中用 cubic-bezier(0.2,0,0,1) 交叉淡入；按下用 scale(0.96)，不得低于 0.95；AnimatePresence 用 initial={false} 避免首屏播放。性能：禁止 transition: all，只写具体属性；will-change 仅用于 transform、opacity、filter，且仅在出现首帧卡顿时添加。交互元素命中区域至少 40×40px，可用伪元素扩展，且两个元素的命中区域不得重叠。
使用方式：在编写或审查前端代码时逐条对照检查清单应用。审查结果须以 Markdown 表格呈现，含 Before 与 After 两列，按原则分组加标题，每行只聚焦一处改动，并注明具体文件与属性；无需改动的原则省略表格。
适用场景：UI 组件开发、前端代码审查、动画实现、悬停与按压反馈等。
限制：资料未提供安装命令、依赖要求、收费或平台信息；具体框架适配需自行判断。