把设备、数据与体验，收进一座梦幻空间

新拟态成立的前提是背景与卡片同色系。先把底色调到 oklch(0.15 0.03 75)，卡片用 oklch(0.21 0.045 75)，两者明度差控制在 0.06 以内。

• 避免纯白底：冷白会让暖金主色显脏，对比度反而下降。
• 大面积底色饱和度 ≤0.05，否则凹凸阴影会被吃掉。
• 先铺底色再调阴影，顺序反了会反复返工。

外凸阴影用「左上高光 + 右下暗影」成对出现：9px 9px 20px 暗影配 -9px -9px 22px 高光，模糊值约为偏移量的 2 倍。

• 高光不透明度 ≤0.06，暗影 ≤0.55，过强会像塑料。
• 按压态改用 inset，偏移量减半（6px/14px）更贴身。
• 同一屏只允许一套阴影方向，光源统一在左上。

圆润是新拟态的骨相。卡片用 28px，控件用 20px，胶囊按钮用 999px，与阴影的柔度匹配。

• 移动端点按区最小 44×44px，图标按钮补齐透明内边距。
• 圆角大于阴影模糊半径的一半，边缘才不会发虚。
• 嵌套卡片圆角递减：外层 28px → 内层 20px → 缩略图 14px。

低对比是新拟态最大的坑。正文色固定 oklch(0.94 0.02 75)，弱化文字 oklch(0.62 0.03 75)，两者与底色对比度分别做到 ≥7:1 与 ≥4.5:1。

• 关键数字用强调色 oklch(0.90 0.1 270)，仅小面积点亮。
• 正文不要压在阴影渐变区，改放卡片中央高光带。
• 焦点态用 2px 强调色描边 + 3px 偏移，键盘可见。

梦幻空间靠慢节奏维持。入场用 0.7s 淡入上浮、位移 18px，错峰步长 80ms；悬停位移不超过 4px。

• 必须提供 prefers-reduced-motion 降级，直接展示终态。
• 所有内容默认可见，禁止靠脚本加类才显示。
• 动效只作用于 transform 与 opacity，避免布局抖动。

交付前用统一口径复测，避免「看起来还行」的主观判断，也便于跨端团队对齐品牌形象。

• 首屏可交互时间 ≤1.8s，图片全部 lazy 加载。
• 首屏视觉稳定性累计位移 ≤0.1，图片容器定宽高比。
• 320px 宽度下无横向滚动，长英文词强制断行。