用途：这是一套让界面显得更精致的设计工程原则，适用于构建或评审前端 UI 代码时应用，帮助把排版、圆角、阴影、动效和性能等细节做统一。
主要能力：涵盖四类要点。排版方面，使用 text-wrap: balance 处理标题、text-wrap: pretty 处理正文以避免孤行，在 macOS 根布局应用 -webkit-font-smoothing: antialiased，动态数字使用 font-variant-numeric: tabular-nums 防止布局抖动。表面方面，嵌套元素采用同心圆角（外圆角 = 内圆角 + padding），必要时做视觉对齐而非几何居中，用多层半透明 box-shadow 替代硬边框，图片加 1px 低透明度轮廓（浅色模式纯黑 rgba(0,0,0,0.1)，深色模式纯白 rgba(255,255,255,0.1)，不可用带色偏的中性色）。动画方面，交互状态变化用 CSS transition（可被打断），关键帧仅用于一次性分段序列；入场动画拆分为语义块并以约 100ms 交错；退场用较小的固定 translateY，比入场更柔和；图标动画用 opacity、scale、blur 过渡（scale 0.25→1、opacity 0→1、blur 4px→0），装有 motion/framer-motion 时用 transition: { type: "spring", duration: 0.3, bounce: 0 }，bounce 必须为 0，无动效库则两图标同时保留在 DOM 中用 cubic-bezier(0.2, 0, 0, 1) 交叉淡入淡出；按下时使用 scale(0.96)，不可小于 0.95，并提供静态属性可关闭。性能方面，禁止 transition: all，需明确指定属性；will-change 仅用于 transform、opacity、filter，且仅在出现首帧卡顿时添加。此外，交互元素触控/移动端命中区宜为 44×44px，密集桌面界面至少 40×40px，可用伪元素扩展，两个元素的命中区不得重叠。
使用方式：资料未提供安装命令或代码调用方式，暂未提供；该技能以原则清单与评审检查表形式使用。评审输出要求：将改动按原则分组，用 Markdown 表格呈现 Before 和 After 两列，每行只聚焦一处改动，并尽量标明具体文件与属性；若某原则审查后无需改动，则省略该表格。
限制：资料未说明适用框架版本、运行环境依赖或收费情况，暂未提供。参考文件有 typography.md、surfaces.md、animations.md、performance.md。