Bamboo Shade
留白不是空着，
是给光留的位置
竹影使用淡金 #D7CA9E，透明度 35–50%，只出现在页面留白侧，永不压住文字与产品摄影。
Design System · 05 Motif & Motion
Motif & Motion · 母题与动效
一道褶弧，三缕热气
主母题「饺子褶纹弧」讲现包的手艺，是体系里最独有的一笔；动效母题「热气曲线」讲刚出锅的温度。空间肌理用淡金竹影。每一屏，母题只出现一个层级。
05 · 01
主母题 · 饺子褶纹弧
从捏褶的动作抽象而来：一段基弧，上面骑着奇数个褶。它出现在分隔线、卡片切角、徽章边缘与图标气质里。
三好原则
好肉 · 好面 · 好现包
好肉 · 好面 · 好现包
分隔线章节之间的褶弧细线，金 55% 透明度，高度 12px。
SIGNATURE
虾皇饺
Imperial Shrimp Dumplings
卡片切角卡片上缘的褶弧啮合边，用于产品卡与价签。
徽章 · 印褶弧边缘的绛红印章，12 褶。它本身即是当屏唯一的红实体。
05 · 02
动效母题 · 热气曲线
整套动效只有一种性格：像蒸汽上升。慢起—轻浮—缓收，全局唯一缓动，绝不弹跳、不闪烁、无廉价 swoosh。
Motion Spec
- 缓动 · 全局唯一cubic-bezier(0.4, 0, 0.2, 1)
- 悬停 / 微交互240ms
- 元素入场（位移 ≤24px + 淡入）800ms
- 页面 / 场景转场600ms
- 节奏慢起 0–22% · 轻浮 22–62% · 缓收 62–100%
- 禁弹跳 · 闪烁 · swoosh · 视差滥用
- 无障碍prefers-reduced-motion 时静止
入场动效一律「从下 24px 淡入到位」，如蒸汽升起后停驻；列表项依次延迟 90ms。装饰性循环动画只允许热气曲线本体，且仅出现于品牌表达场景。
05 · 03
空间肌理 · 竹影
淡金竹影只落在留白处，对比度压在低位（不与文字争夺），像下午的光透过门店格栅。
留白不是空着，
05 · 04
层级规则 · 每屏一个母题
褶弧、热气、竹影是三位客人，一屏只请一位上桌。
当日现包，当日售卖
Do
一屏一个母题层级：这里只有褶弧分隔线。
当日现包，当日售卖
Don't
褶弧 + 热气 + 竹影同屏叠加——母题打架，手艺感变成装饰堆砌。