高度与深度
深度先来自表面色调和发丝线，其次才是阴影。停靠区域完全没有阴影：面板（bg-subtlest）、白卡片、灰画布三个色调加 1px 线，已经把它们分开了。阴影只给真正离开平面的东西。
| 令牌 | 取值 | 用于 |
|---|---|---|
shadow-100 | 0 4px 12px rgba(11,11,13,.06), 0 0 4px rgba(11,11,13,.06) | 悬浮栏、属性卡片、收起胶囊、缩略图卡片、分段选中项、开关圆钮、滑块圆钮 |
shadow-200 | 0 16px 32px rgba(11,11,13,.06), 0 2px 8px rgba(11,11,13,.06) | 下拉列表 |
shadow-300 | 0 40px 80px rgba(11,11,13,.06), 0 2px 8px rgba(11,11,13,.06) | 对话框 |
shadow-100
shadow-200
shadow-300
只有三档，没有第四档：需要第四档，通常说明有东西本该平贴在面板上，却被抬了起来。每一档都是双层——一层带位移给出方向，一层零位移让白卡片在白面板上也有边——三档共用同一个 6% 的投影色。shadow-100 同时是最小的一档：圆钮和手柄用它，系统里没有更小的东西。阴影从不做动画，hover 时没有任何东西抬起。
焦点自成一层，不参与高度体系
键盘焦点是 2px stroke-surround 外框，外扩 2px。这个外扩是承重的：它把焦点环和控件自己的底色隔开，近黑按钮上的焦点环因此和白按钮上的一样清楚。把它设成 0 正是主按钮上焦点环消失的原因。
外扩 2px外扩 0，环贴着深底几乎看不见
输入族是例外：输入框和下拉以底色变白、画出 1px stroke-active 边框表示聚焦。它们本来就是一个有底色的框，再套一圈会读成两道边界。