fix(mp): T40 UI 设计系统合规审计修复 — 60 页面全覆盖

- 新增 $white 语义变量 + --tk-font-display Token
- 44 处 #fff → $white，2 处 background: #fff → $card
- 14 处 border-radius 硬编码统一为 $r-xs/$r-lg/$r
- 3 处 TSX inline 颜色提取为 SCSS 类（exchange/orders/action-inbox）
- ErrorBoundary 重构：6 个 inline style → SCSS 类 + Design Token
- 2 处离调色板颜色修正（#0284C7→$tx2, #94A3B8→$tx3）
- 2 处静默 catch 块添加状态清理（article/health）
- 趋势页补 Loading/EmptyState；咨询页 GuestGuard 统一
- 4 处 #FFFFFF → $white（mixins/index/exchange/variables）

apps/miniprogram/src/pages/pkg-mall/exchange/index.scss

@@ -25,13 +25,25 @@
   @include flex-center;
   margin-right: 24px;
   flex-shrink: 0;
+
+  &--physical {
+    background: $acc;
+  }
+
+  &--service {
+    background: $pri;
+  }
+
+  &--privilege {
+    background: $pri-d;
+  }
 }
 
 .product-icon-char {
   font-family: 'Georgia', 'Times New Roman', serif;
   font-size: var(--tk-font-hero);
   font-weight: bold;
-  color: #FFFFFF;
+  color: $white;
 }
 
 .product-meta {

apps/miniprogram/src/pages/pkg-mall/exchange/index.tsx

@@ -23,10 +23,10 @@ const TYPE_LABEL: Record<string, string> = {
   privilege: '权益卡',
 };
 
-const TYPE_COLOR: Record<string, string> = {
-  physical: '#5B7A5E',
-  service: '#C4623A',
-  privilege: '#8B3E1F',
+const TYPE_CLASS: Record<string, string> = {
+  physical: 'product-icon-wrap--physical',
+  service: 'product-icon-wrap--service',
+  privilege: 'product-icon-wrap--privilege',
 };
 
 export default function ExchangeConfirm() {
@@ -130,16 +130,13 @@ export default function ExchangeConfirm() {
   const productType = product?.product_type || 'physical';
   const initial = TYPE_INITIAL[productType] || '礼';
   const typeLabel = TYPE_LABEL[productType] || '商品';
-  const typeColor = TYPE_COLOR[productType] || '#C4623A';
+  const iconCls = TYPE_CLASS[productType] || 'product-icon-wrap--service';
 
   return (
     <View className={`exchange-page ${modeClass}`}>
       {/* 商品预览卡片 */}
       <View className='product-card'>
-        <View
-          className='product-icon-wrap'
-          style={{ backgroundColor: typeColor }}
-        >
+        <View className={`product-icon-wrap ${iconCls}`}>
           <Text className='product-icon-char'>{initial}</Text>
         </View>
         <View className='product-meta'>

apps/miniprogram/src/pages/pkg-mall/orders/index.scss

@@ -79,11 +79,26 @@
 }
 
 .order-status-tag {
-  @include tag(transparent, $tx3);
   padding: 4px 16px;
   border-radius: $r-pill;
   margin-left: 12px;
   flex-shrink: 0;
+
+  &--pending {
+    @include tag($wrn-l, $wrn);
+  }
+
+  &--verified {
+    @include tag($acc-l, $acc);
+  }
+
+  &--cancelled {
+    @include tag($dan-l, $dan);
+  }
+
+  &--expired {
+    @include tag($bd-l, $tx3);
+  }
 }
 
 .order-status-text {

apps/miniprogram/src/pages/pkg-mall/orders/index.tsx

@@ -15,11 +15,11 @@ const STATUS_TABS = [
   { key: 'expired', label: '已过期' },
 ];
 
-const STATUS_CONFIG: Record<string, { label: string; tagBg: string; tagColor: string }> = {
-  pending: { label: '待核销', tagBg: '#FFF3E0', tagColor: '#C4873A' },
-  verified: { label: '已核销', tagBg: '#E8F0E8', tagColor: '#5B7A5E' },
-  cancelled: { label: '已取消', tagBg: '#FDEAEA', tagColor: '#B54A4A' },
-  expired: { label: '已过期', tagBg: '#F0EBE5', tagColor: '#A8A29E' },
+const STATUS_CONFIG: Record<string, { label: string; cls: string }> = {
+  pending: { label: '待核销', cls: 'order-status-tag--pending' },
+  verified: { label: '已核销', cls: 'order-status-tag--verified' },
+  cancelled: { label: '已取消', cls: 'order-status-tag--cancelled' },
+  expired: { label: '已过期', cls: 'order-status-tag--expired' },
 };
 
 export default function MallOrders() {
@@ -102,7 +102,7 @@ export default function MallOrders() {
   };
 
   const getStatusConfig = (status: string) => {
-    return STATUS_CONFIG[status] || { label: status, tagBg: '#F0EBE5', tagColor: '#A8A29E' };
+    return STATUS_CONFIG[status] || { label: status, cls: 'order-status-tag--expired' };
   };
 
   const formatDate = (dateStr: string) => {
@@ -144,8 +144,7 @@ export default function MallOrders() {
                 <View className='order-header'>
                   <Text className='order-product'>商品 {order.product_id.slice(0, 8)}</Text>
                   <View
-                    className='order-status-tag'
-                    style={{ background: statusCfg.tagBg, color: statusCfg.tagColor }}
+                    className={`order-status-tag ${statusCfg.cls}`}
                   >
                     <Text className='order-status-text'>{statusCfg.label}</Text>
                   </View>