仅当用户明确选择或已确认的项目配置指定时，才使用此技能。对于未经解释的新UI请求，请使用样式选择器（如）而非在此处替用户决定品味。现有的品牌、可访问性和用户覆盖规则优先于以下所有示例。以下风格指南并非在样式选择前允许开始UI编码的许可。
风格包：拟物化（Skeuomorphism）
ID: skeuomorphism
标志： 数字控件借用物理对象、工业机械和模拟硬件的可触摸感知特性。
这是一个风格包，而非强制性默认值。仅在明确选择或确认适用项目风格后加载。项目说明可覆盖个别选择。保留可访问性、实用性和品牌约束。字体为建议，非强制依赖。带有细微渐变的扁平卡片不符合拟物化。
适用场景 / 权衡
- 适用场景： 音乐制作和合成器软件、音频设备工具、专用模拟器、触觉仪表板小部件、创意数字乐器以及有趣的触觉体验。
- 需谨慎使用： 密集的事务性数据表格或移动企业表单，其中复杂的物理硬件纹理会造成视觉混乱。
- 参考方向：
- 拉丝工业铝 / 录音室硬件： 加工银色或枪金属底盘，带有径向金属反射、滚花旋钮、凹陷指示灯井和清晰的机械拨动开关。
- 精密磨砂仪表： 深石墨 / 磨砂复合基底，带有雕刻的白色读数排版、LED宝石状态指示灯和物理跷板开关。
拟物质感逼真度门禁 — 强制
在调用拟物化页面完成之前，打开视口必须明显看起来像一个物理的、可触摸的仪器或硬件接口。 如果用户选择了此风格，那么带有标准圆角和单一渐变的扁平卡片就是失败，即使CSS类包含skeuo。
一个成功的拟物化实现应展示所有以下内容：
- 光影模型方向与镜面高光： 表面遵循单一一致的光源（通常是自上而下）：上边缘捕捉清晰的1px镜面高光（
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35)），而下边缘投射物理投影。 - 多停止点反射材质表面： 旋钮、面板和跷板开关使用多停止点线性或径向渐变，模拟拉丝铝、磨砂塑料或阳极氧化金属。纯单色填充失败。
- 雕刻或凹陷极性： 文本显示、滑块和仪表井通过深内阴影（
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.6)）视觉上沉入机箱，清晰区分移动的控件与容纳它们的容器。 - 交互时的机械行程： 按钮在点击时物理上按下进入机箱（
transform: translateY(1.5px); box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.7);），模拟真实的弹簧加载开关机制。 - 清晰的可读模拟启示： 物理旋钮和滑块包括清晰的数字读数或标有数值的刻度标记，确保键盘可访问性和精确数据输入。
首视口测试： 在桌面截图中，无需阅读页面标题即可识别物理机箱、镜面斜角高光、凹陷井和触觉硬件控件。如果它看起来纯粹是数字和扁平的，则加强渐变反射和斜角高光。
明确的拟物质感例外 — 允许硬件反射
拟物化特定的覆盖： 通用的反草率警告，关于装饰性渐变、纹理或阴影，绝不能解释为在此禁用多停止点材质渐变、金属反射、斜角边缘或物理行程。这些是材质启用属性，对于传达机械启示至关重要。
- 允许的材质处理： 多停止点金属线性/径向渐变，1px高光斜角，凹陷槽通道，滚花旋钮边框和宝石LED状态灯。
- 反草率边界： 每个机械隐喻必须对应一个真实的、可工作的操作。不要用假螺丝、不可旋转的装饰性旋钮或显示虚构测量值的静态仪表来装饰屏幕。
- 反草率解释： 通过触觉启示、功能实用性和可读性来评估拟物化细节，而不是通过计数渐变颜色停止点。为满足通用扁平经验法则而移除物理斜角是一种设计退化。
排版与字体
功利主义技术无衬线或显示等宽：IBM Plex Sans、DIN Next、Roboto Mono或系统无衬线。控件标签：11–13px大写字母，带字距（letter-spacing: 0.08em）；显示仪表：高对比度LCD/LED等宽（16–24px）。在深色面板上具有高对比度（至少4.5:1）。
颜色方向
- 暗色模式（阳极氧化枪金属暗色机箱）：
- 机箱基底： 加工板岩 / 阳极氧化枪金属渐变（
linear-gradient(180deg, #323741 0%, #262A32 100%)）。 - 表面高光： 镜面白色发丝线（
rgba(255, 255, 255, 0.40)）。 - 凹陷内嵌井： 深腔黑色（
#141619至#181A1E）。 - 控件标签： 清晰的雕刻白色/银色排版（
#F3F4F6）。
- 机箱基底： 加工板岩 / 阳极氧化枪金属渐变（
- 亮色模式（拉丝铝 / 银色机箱）：
- 机箱基底： 加工铝 / 银色渐变（
linear-gradient(180deg, #F5F7FA 0%, #E4E7EB 100%)）。 - 表面高光： 镜面白色发丝线（
rgba(255, 255, 255, 0.85)）。 - 凹陷内嵌井： 柔和凹陷板岩腔（
#D1D5DB带内阴影）。 - 控件标签： 深雕刻炭黑墨水（
#1F2937或#111827）。
- 机箱基底： 加工铝 / 银色渐变（
- 物理点缀： 信号琥珀色（
#FFAE00）、航空绿色（#10B981）或录音室钴蓝色（#2563EB）。 - LED指示灯： 清晰的宝石色，具有明显的激活发光与暗色非激活状态。
- 主题耦合与防冲突规则： 在亮色拟物化机箱模式下，雕刻标签和控件文本必须翻转为深炭黑色（
#1F2937）。在拉丝银色铝机箱上留下白色标签会产生不可见文本，严格禁止。
布局与几何
组件形状严格映射其物理隐喻：旋转拨盘、触觉按钮、跷板开关和分段仪表。面板的圆角半径为4–12px；旋钮为圆形半径。避免对通用文本段落应用硬件外观。
表面、深度、纹理
- 机箱面板： 多停止点线性渐变（
linear-gradient(180deg, #323741 0%, #262A32 100%)），带1px顶部高光和底部投影。 - 物理按钮： 斜角边缘带顶部高光，径向按钮表面和清晰的按下凹陷。
- 凹陷井 / 显示：
box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.65), 0 1px 0 rgba(255, 255, 255, 0.15);
组件结构与交互
- 触觉按钮： 加工铝表面，白色雕刻标签，释放时机械回弹。
- 跷板 / 拨动开关： 双态物理拨动，活动侧有可见铸影。
- 凹陷LCD / 数据显示： 凹陷屏幕，等宽值，细微光栅网格，高对比度。
- 旋转拨盘 / 滑块： 触觉位置指示器，具有ARIA滑块语义和键盘箭头键支持。
- LED状态灯： 小型圆形宝石镜片，活跃时发出辐射光芒（
box-shadow: 0 0 8px currentColor）。
动效
140–200 ms 机械响应。点击时直接1–2px物理按下。无弹跳卡通过冲；运动必须感觉有重量和阻尼。
可选的 Anime.js v4 配方
- 动效决策： 按下时阻尼弹簧或线性机械按下；旋钮精确旋转。
- 起始持续时间： 160ms（0 = 立即）；根据任务和用户偏好调整。
- 避免： 持续振荡、无提示的指针晃动、浮动元素。
- 依赖： 默认使用CSS/原生。仅当请求的交互证明其合理性时才使用Anime.js v4。当可用时遵循 Taste Engine
references/motion-engine.md；独立技能遵循上述减少动效和无装饰循环原则。
UI文案与微文案
技术性、精确、简洁。例如：“主输出”、“旁通”、“通道01”、“增益：+3.5 dB”。避免在仪器面板上出现闲聊式营销废话。
起始令牌（建议，非完整主题）
| 令牌 | 暗色机箱默认值 | 亮色机箱默认值 |
|---|---|---|
--taste-skeuo-chassis-bg | linear-gradient(180deg, #323741 0%, #262a32 100%) | linear-gradient(180deg, #f5f7fa 0%, #e4e7eb 100%) |
--taste-skeuo-chassis-border | 1px solid rgba(0, 0, 0, 0.8) | 1px solid rgba(0, 0, 0, 0.15) |
--taste-skeuo-chassis-highlight | inset 0 1px 0 rgba(255, 255, 255, 0.25) | inset 0 1px 0 rgba(255, 255, 255, 0.90) |
--taste-skeuo-text | #f3f4f6 | #1f2937 |
--taste-skeuo-btn-bg | linear-gradient(180deg, #3c424f 0%, #2a2e37 100%) | linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%) |
--taste-skeuo-btn-bevel | inset 0 1px 0 rgba(255, 255, 255, 0.40), inset 0 -1px 0 rgba(0, 0, 0, 0.50) | inset 0 1px 0 rgba(255, 255, 255, 0.80), inset 0 -1px 0 rgba(0, 0, 0, 0.20) |
--taste-skeuo-btn-shadow | 0 4px 8px rgba(0, 0, 0, 0.50), 0 1px 2px rgba(0, 0, 0, 0.40) | 0 4px 8px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.08) |
--taste-skeuo-well-inset | inset 0 3px 6px rgba(0, 0, 0, 0.70), 0 1px 0 rgba(255, 255, 255, 0.12) | inset 0 3px 6px rgba(0, 0, 0, 0.18), 0 1px 0 rgba(255, 255, 255, 0.80) |
--taste-skeuo-led-active | #10b981 | #059669 |
--taste-skeuo-led-glow | 0 0 10px rgba(16, 185, 129, 0.75) | 0 0 8px rgba(5, 150, 105, 0.45) |
--taste-skeuo-radius-panel | 12px | 12px |
--taste-skeuo-font-mono | IBM Plex Mono, ui-monospace, monospace | IBM Plex Mono, ui-monospace, monospace |
--taste-skeuo-motion-duration | 160ms | 160ms |
令牌代表一个方向，并非每个调色板/平台的保证复制粘贴。在项目级别定义--taste-skeuo-*，确保颜色对比度，并通过主题令牌进行适配，而不是分散字面值。
英雄区构成（完整首视口）
当面向公众的作品集/落地页/首页有英雄区时： 使用一个屏幕可见的页眉+英雄区组合。基础高度基于min-height: 100svh并回退100vh，仅在页眉处于正常流中时减去真实页眉；让英雄区为可访问性和短移动屏幕扩展。不将此应用于私人仪表板或其他任务屏幕；直接用户覆盖优先。风格特定方向： 将首视口视为一个真实的主控控制台或签名仪器面板；提供可工作的控件和一个明确的主CTA。不要用非功能性螺丝、装饰线缆或断开的模拟仪表来污染画布。当存在时，参考路由器references/hero-layout.md。独立使用时遵循相同的响应式和反草率原则。
风格特定质量门禁
- 应做： 验证所有控件的一致自上而下镜面高光；确保机械按下状态平滑按下；在拨盘/滑块旁提供数值读数；测试键盘焦点；验证暗色/亮色模式切换，使机箱、斜角高光、井和标签排版成对适配。
- 不应做： 不要将纯暗色主题视为拟物化；不要添加非功能性装饰螺丝或不连接到真实数据的假模拟指针；避免在深色面板上出现难以阅读的低对比度文本，或在银色亮色面板上出现白色标签。
- 确认桌面和移动端一致性；可见键盘焦点（
:focus-visible）；加载、空、禁用、错误和成功状态；减少动效行为（prefers-reduced-motion）。 - 不要将风格特定假设注入不相关的项目。组合风格时，明确命名主风格和借用的特征。
通用反草率门禁（独立）
每个元素都必须赢得其位置。内容先于装饰。不要装饰不确定性。 不要编造余额、指标、推荐、用户、标识、批准、已验证/在线/状态、虚假活动或成功确认；代之以诚实的空/加载/错误状态。仅当请求并明确标记时，演示数据才可接受。
不要添加装饰性的卡片内卡片层：嵌套表面必须代表一个独特的交互或信息边界。避免自动生成的3特征网格、4统计仪表板、虚假英雄声明、无目的图表、徽章/芯片/图标垃圾信息、不相关的装饰性艺术和仅用于填充视口的随机循环。首选通过排版、间距、对齐和分隔线进行分组。同等级别的区域需要有意的视觉平衡。
反草率文案： 无通用“释放你的潜力”、“体验未来”、“提升你的工作流程”、“无缝”声明或其翻译版本。标题必须传达实际内容，CTA必须命名操作，空/错误/成功文本必须描述真实状态和下一步。避免虚假紧迫感、虚构计数、模糊AI炒作、多余表情符号和不可访问的全大写墙。根据此风格和用户语言调整措辞，而不改变事实。
主题和模式对比度完整性： 当用户请求暗色模式或亮色模式（或构建主题切换器）时，背景和前景颜色必须在所有表面、文本、边框、输入和语义徽章上成对同步翻转。切勿在深色背景上留下黑色文本、在白色背景上留下白色文本或不可读的低对比度状态药丸。所有状态必须满足WCAG AA对比度（正文/普通文本至少4.5:1，大标题和交互边界至少3:1）。
响应式和动效： 有意地组成移动端布局，检查长标签，聚焦...