基于现有工程的设计令牌体系（uni.scss + app.scss）规划可复用商城组件，并提供 4 套成熟行业风格供选型。换肤只需修改变量值，组件写法零改动。
c-button / c-card / c-tag / c-modal / c-section-title 组件与 uni.scss 令牌体系，按商城业务扩展以下组件。所有组件只读 CSS 变量（var(--primary) 等），因此切换风格时无需改动任何组件代码。uni.scss 变量（经 styles/app.scss 桥接到 :root, page 的 CSS 变量）。落地新风格时，只改 uni.scss 的 $primary / $bg / $radius / $shadow / $font-* 等变量值，全站组件即时换肤，无需触碰任何 .vue 文件。下列四套风格均已按此变量体系定义完整 token。
uni.scss 即可完成全站换肤（配合 styles/app.scss 自动桥接）。变量命名与现有工程完全一致。| uni.scss 变量 | 轻奢金棕 A | 简约现代 B | 内容种草 C | 活力大促 D |
|---|---|---|---|---|
$primary | #D4AF37 | #1A1A1A | #FF2E4D | #FF5000 |
$primary-dark | #B88A1A | #000000 | #E01230 | #E63E00 |
$secondary | #6B3E1B | #6B7280 | #FF6B81 | #FF8A00 |
$bg | #F8F5F0 | #FAFAFA | #FFFFFF | #FFF7F0 |
$bg-subtle | #F0E9DA | #F2F2F2 | #FFF1F3 | #FFEDE0 |
$font-color-price | #D4AF37 | #1A1A1A | #FF2E4D | #FF5000 |
$radius-xl | 24rpx | 16rpx | 28rpx | 18rpx |
$shadow-md | 0 4rpx 16rpx rgba(0,0,0,.06) | 0 2rpx 10rpx rgba(0,0,0,.05) | 0 4rpx 14rpx rgba(255,46,77,.07) | 0 4rpx 14rpx rgba(255,80,0,.08) |
uni.scss 变量。