让每一步，都自然顺手。

按用途组织的颜色变量、亮暗色值，以及文字与页面背景的对比度。

界面使用系统字体，阅读使用 Literata，代码使用等宽字体。字号、字重与行高采用统一刻度。

Tailwind 的 4px 刻度。控件高 20 到 44：按钮 24 / 30 / 32 / 36、输入框 35、对话输入框 44。

从小控件到大面板采用统一圆角刻度，面积越大的界面使用更舒展的圆角。

四种阴影只在亮色有（暗色全透明，靠底色层级与细边）；tooltip 与悬停卡只有 0.5px 内描边；对话框与设置没有阴影。边四档。

点「播放」对比各条曲线与时长。

lucide，线宽 1.75：菜单里 14、按钮里 16、侧栏行 18；四级颜色。

键盘焦点是 2px 的 --focus 外框、外扩 1；输入框聚焦只把边加深一档，没有外圈。按 Tab 试试。

十一种变体。文字按钮一律胶囊 24 / 30 / 32 / 36；图标按钮 20–44，方形（圆角 6）或圆形。按下叠 12% 的当前字色、不缩放；加载时宽度不变。

状态徽章两种尺寸（20、24），未读用数量徽章（22、18）；带颜色的都是「浅底 + 能读的字」成对。

高 35、圆角 8、1px 边；聚焦只把边加深一档、没有外圈。在「名字」里只打一个字，可以看到出错的样子。

32 高的胶囊（大号 36），有字时出现清除键。

触发器 35（小号 28，设置里用），边同输入框；列表用菜单的外观，选中项右侧勾。

打开与选中都用强调蓝。开关 32 × 20，关闭是淡底加一圈细描边。

分段是选一个值，标签页是切内容；都是胶囊（小号 26、默认 32），当前一格淡底配一级字。

紧凑的筛选胶囊，选中状态清晰，窄屏可以横向滚动。

八种尺寸：13、16、22、24、36、44、60、96；叠放时往左压 6，外圈一圈底色。

4 高的进度条（默认强调色）、转圈，和照着形状画的骨架屏（surface-l2 底加 2.2s 流光）。

页面里的一句状态。没有边，浅底与字成对。

小区域用简短的行内提示，空页面或面板配合图标与明确的下一步动作。

elevated 浮起来（亮色 card 阴影加 1px 边，暗色只有边）；group 是设置页的分组卡片；inset 嵌在页面里。

compact（40、圆角 8）给成员与菜单式列表，card（64、圆角 16）给应用、技能、例行任务这类列表。

带返回、标题、说明与操作的页头；分节标题与分组小标题。

详情、账单、用量用。窄屏上键在上、值在下。

层级深的地方用面包屑；只有一条回去的路时用返回链接。

带圆角和细边的表格，表头使用深一档的背景；对话里的表格也使用相同外观。

橙色只表示需要你；「新」用强调蓝；品牌色是主 Agent 的蓝。

所有菜单同一套：圆角 12、内边距 6、项 30 高 13/18、图标 14、0.5px 细边，亮色 popover 阴影、暗色没有。

右键、长按或 Shift+F10 在指针处打开同一个菜单。

弹层和菜单同一种外观；tooltip 24 高、圆角 6、只有细边，出现在下方 8。

圆角 14、elevated 底、1px 边、没有阴影；遮罩黑 50% / 70%。标题 14/22 600。

侧边抽屉 surface-base 底、细边；手机上的底部抽屉顶角 24、带拉手。

跟随主题：elevated 底、细边、圆角 9、12.5 的字；亮色 popover 阴影，暗色没有。