diff --git a/src/pages/designList/index.scss b/src/pages/designList/index.scss
index db62f6a..1f48841 100644
--- a/src/pages/designList/index.scss
+++ b/src/pages/designList/index.scss
@@ -5,7 +5,7 @@
 
 .manage-btn {
   font-size: 28px;
-  color: var(--accent-blue);
+  color: var(--accent-secondary);
   font-weight: 500;
 }
 
@@ -35,7 +35,7 @@
 }
 
 .tab-item.active .tab-label {
-  color: var(--accent-pink);
+  color: var(--accent-primary);
   font-weight: 700;
 }
 
@@ -46,7 +46,7 @@
   transform: translateX(-50%);
   width: 40px;
   height: 4px;
-  background: var(--accent-pink);
+  background: var(--accent-primary);
   border-radius: 2px;
 }
 
@@ -68,14 +68,14 @@
   width: 36px;
   height: 36px;
   border-radius: 50%;
-  border: 3px dashed var(--text-secondary);
+  border: 2rpx solid var(--border-strong);
   flex-shrink: 0;
   transition: all 0.2s;
 }
 
 .batch-checkbox.checked {
-  border-color: var(--accent-pink);
-  background: var(--accent-pink);
+  border-color: var(--accent-primary);
+  background: var(--accent-primary);
 }
 
 .batch-text {
@@ -90,7 +90,7 @@
 }
 
 .batch-delete.active {
-  color: #ff4757;
+  color: var(--danger);
   font-weight: 600;
 }
 
@@ -106,8 +106,8 @@
 }
 
 .design-card.selected {
-  border-color: var(--accent-pink);
-  background: rgba(255, 154, 158, 0.06);
+  border-color: var(--accent-primary);
+  background: var(--accent-primary-soft);
 }
 
 .design-body {
@@ -155,7 +155,7 @@
 .design-total {
   font-size: 26px;
   font-weight: 600;
-  color: var(--accent-pink);
+  color: var(--accent-primary);
 }
 
 .design-actions {
diff --git a/src/pages/designList/index.tsx b/src/pages/designList/index.tsx
index f0eafa6..21de3e7 100644
--- a/src/pages/designList/index.tsx
+++ b/src/pages/designList/index.tsx
@@ -120,7 +120,7 @@ export default function DesignListPage() {
       <ThemedPageMeta />
       <LoginGuard>
         <View className='design-page'>
-          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
+          <View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <View className='flex-between' style={{ width: '100%' }}>
               <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>
               <Text className='page-title'>我的设计清单</Text>
@@ -148,7 +148,7 @@ export default function DesignListPage() {
 
           {/* 批量管理工具栏 */}
           {managing && (
-            <View className='batch-bar dashed-card'>
+            <View className='batch-bar surface-card'>
               <View className='flex-between' style={{ width: '100%' }}>
                 <View className='batch-select-all' onTap={toggleSelectAll}>
                   <View className={`batch-checkbox ${selected.size === filtered.length && filtered.length > 0 ? 'checked' : ''}`} />
@@ -165,7 +165,7 @@ export default function DesignListPage() {
           <ScrollView className='design-list' scrollY>
             {filtered.map(item => {
               const style = STATUS_STYLE[item.status]
-              const rawIcon = item.productIcon?.startsWith('/icon/') || /^https?:/i.test(item.productIcon || '')
+              const rawIcon = (item.productIcon || '').startsWith('/icon/') || /^https?:/i.test(item.productIcon || '')
                 ? item.productIcon
                 : PRODUCT_ICON_MAP[item.productId] || '/icon/四角星.svg'
               const iconSrc = assetUrl(rawIcon)
@@ -173,7 +173,7 @@ export default function DesignListPage() {
               return (
                 <View
                   key={item.id}
-                  className={`design-card dashed-card ${isSelected ? 'selected' : ''}`}
+                  className={`design-card surface-card ${isSelected ? 'selected' : ''}`}
                   onTap={() => managing ? toggleSelect(item.id) : undefined}
                 >
                   <View className='design-body'>
@@ -193,12 +193,12 @@ export default function DesignListPage() {
                   {!managing && (
                     <View className='design-actions'>
                       {item.status !== 'ordered' && (
-                        <View className='btn-gradient design-btn' onTap={() => goDesign(item)}>
+                        <View className='btn-primary design-btn' onTap={() => goDesign(item)}>
                           <Text>{item.status === 'undesigned' ? '开始设计' : '继续设计'}</Text>
                         </View>
                       )}
                       {item.status === 'ordered' && (
-                        <View className='btn-outline design-btn' onTap={() => Taro.switchTab({ url: '/pages/orders/index' })}>
+                        <View className='btn-secondary design-btn' onTap={() => Taro.switchTab({ url: '/pages/orders/index' })}>
                           <Text>查看订单</Text>
                         </View>
                       )}
@@ -213,7 +213,7 @@ export default function DesignListPage() {
                 <Image className='empty-icon-img' src={assetUrl('/icon/调色盘.png')} mode='aspectFit' />
                 <Text className='empty-text'>还没有设计清单</Text>
                 <Text className='empty-sub'>去首页逛逛，找到喜欢的定制品</Text>
-                <View className='btn-gradient' onTap={() => Taro.switchTab({ url: '/pages/index/index' })}>
+                <View className='btn-primary' onTap={() => Taro.switchTab({ url: '/pages/index/index' })}>
                   <Text>去逛逛</Text>
                 </View>
               </View>
diff --git a/src/pages/orderDetail/index.scss b/src/pages/orderDetail/index.scss
index 750b2cb..52a8a9c 100644
--- a/src/pages/orderDetail/index.scss
+++ b/src/pages/orderDetail/index.scss
@@ -43,7 +43,7 @@
   top: 8px;
   bottom: 8px;
   width: 2px;
-  background: var(--line-star);
+  background: var(--border);
   opacity: 0.3;
 }
 
@@ -63,7 +63,7 @@
   height: 18px;
   border-radius: 50%;
   background: var(--bg-card);
-  border: 3px solid var(--line-star);
+  border: 2rpx solid var(--border-strong);
   margin-right: 20px;
   flex-shrink: 0;
   margin-left: -20px;
@@ -71,8 +71,8 @@
 }
 
 .timeline-item.active .timeline-dot {
-  background: var(--accent-pink);
-  border-color: var(--accent-pink);
+  background: var(--accent-primary);
+  border-color: var(--accent-primary);
 }
 
 .timeline-content {
@@ -112,12 +112,12 @@
 .address-change {
   padding: 6px 16px;
   border-radius: 8px;
-  background: rgba(91, 140, 255, 0.08);
+  background: var(--accent-secondary-soft);
 }
 
 .change-text {
   font-size: 24px;
-  color: var(--accent-blue);
+  color: var(--accent-secondary);
 }
 
 .address-body {
@@ -181,11 +181,11 @@
 
 .addr-picker-item {
   padding: 20px 16px;
-  border-bottom: 1px dashed rgba(0, 0, 0, 0.05);
+  border-bottom: 1rpx solid var(--border);
 }
 
 .addr-picker-item.active {
-  background: rgba(91, 140, 255, 0.06);
+  background: var(--accent-secondary-soft);
   border-radius: 12px;
 }
 
@@ -209,8 +209,8 @@
 
 .addr-picker-default {
   font-size: 22px;
-  color: var(--accent-pink);
-  border: 1px solid var(--accent-pink);
+  color: var(--accent-primary);
+  border: 1rpx solid var(--accent-primary);
   padding: 2px 8px;
   border-radius: 6px;
 }
@@ -231,13 +231,13 @@
   margin-top: 16px;
   padding: 20px;
   text-align: center;
-  border: 2px dashed var(--accent-blue);
+  border: 1rpx solid var(--border-strong);
   border-radius: 12px;
 }
 
 .addr-picker-add-text {
   font-size: 28px;
-  color: var(--accent-blue);
+  color: var(--accent-secondary);
 }
 
 /* 卡片标题 icon（物流/地址） */
@@ -299,7 +299,7 @@
   align-items: center;
   justify-content: space-between;
   padding: 16px 0;
-  border-top: 1px dashed rgba(0,0,0,0.06);
+  border-top: 1rpx solid var(--border);
 }
 
 .price-label {
@@ -324,7 +324,7 @@
 .total-value {
   font-size: 36px;
   font-weight: 800;
-  color: var(--accent-pink);
+  color: var(--accent-primary);
 }
 
 /* 信息卡片 */
@@ -365,7 +365,7 @@
   justify-content: space-between;
   margin-bottom: 24px;
   padding-bottom: 16px;
-  border-bottom: 1px dashed rgba(0,0,0,0.06);
+  border-bottom: 1rpx solid var(--border);
 }
 
 .logistics-title {
@@ -391,7 +391,7 @@
   top: 8px;
   bottom: 8px;
   width: 2px;
-  background: var(--line-star);
+  background: var(--border);
   opacity: 0.3;
 }
 
@@ -411,7 +411,7 @@
   height: 18px;
   border-radius: 50%;
   background: var(--bg-card);
-  border: 3px solid var(--line-star);
+  border: 2rpx solid var(--border-strong);
   margin-right: 20px;
   flex-shrink: 0;
   margin-left: -20px;
@@ -419,8 +419,8 @@
 }
 
 .timeline-item.active .timeline-dot {
-  background: var(--accent-pink);
-  border-color: var(--accent-pink);
+  background: var(--accent-primary);
+  border-color: var(--accent-primary);
 }
 
 .timeline-content {
@@ -479,10 +479,10 @@
 
 .design-preview {
   position: relative;
-  background: linear-gradient(135deg, rgba(255, 154, 158, 0.08) 0%, rgba(160, 196, 255, 0.08) 100%);
+  background: var(--bg-input);
   border-radius: 16px;
   overflow: hidden;
-  border: 3px dashed var(--accent-blue);
+  border: 1rpx solid var(--border-strong);
   margin: 0 auto;
 }
 
diff --git a/src/pages/orderDetail/index.tsx b/src/pages/orderDetail/index.tsx
index 94fd9a8..eae78ee 100644
--- a/src/pages/orderDetail/index.tsx
+++ b/src/pages/orderDetail/index.tsx
@@ -1,4 +1,4 @@
-import { View, Text, Image, Button } from '@tarojs/components'
+import { View, Text, Image } from '@tarojs/components'
 import Taro from '@tarojs/taro'
 import { useState, useEffect } from 'react'
 import './index.scss'
@@ -14,8 +14,9 @@ export default function OrderDetailPage() {
   const { theme, resolvedTheme } = useThemeContext()
   const safe = useSafeArea()
   useStatusBar(resolvedTheme)
-  const params = Taro.getCurrentInstance().router?.params
-  const orderId = params?.orderId || ''
+  const router = Taro.getCurrentInstance().router
+  const params = router ? router.params : {}
+  const orderId = (params && params.orderId) || ''
 
   const [order, setOrder] = useState<OrderItem | null>(null)
   const [address, setAddress] = useState<AddressItem | null>(null)
@@ -55,7 +56,7 @@ export default function OrderDetailPage() {
       <View className={`theme-${resolvedTheme}`}>
         <ThemedPageMeta />
         <View className='order-detail-page'>
-          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
+          <View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <Text className='page-title'>订单不存在</Text>
           </View>
         </View>
@@ -68,8 +69,7 @@ export default function OrderDetailPage() {
       <ThemedPageMeta />
       <View className='order-detail-page'>
 
-        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
-          <View className='star-badge' />
+        <View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={() => Taro.navigateBack()}>←</Text>
             <Text className='page-title'>订单详情</Text>
@@ -78,8 +78,7 @@ export default function OrderDetailPage() {
         </View>
 
         {/* 状态横幅 */}
-        <View className='status-banner dashed-card mt-20'>
-          <View className='star-badge' />
+        <View className='status-banner surface-card mt-20'>
           <Text className='status-text'>
             {order.statusCode === 'pending' && '待付款'}
             {order.statusCode === 'paid' && '待发货'}
@@ -96,8 +95,7 @@ export default function OrderDetailPage() {
 
         {/* 物流信息（仅 shipping/done） */}
         {(order.statusCode === 'shipping' || order.statusCode === 'done') && (
-          <View className='logistics-card dashed-card mt-20'>
-            <View className='star-badge' />
+          <View className='logistics-card surface-card mt-20'>
             <View className='logistics-header'>
               <View className='flex-center'>
                 <Image className='card-icon-img' src={assetUrl('/icon/包裹.png')} mode='aspectFit' />
@@ -135,13 +133,12 @@ export default function OrderDetailPage() {
         )}
 
         {/* 商品信息 */}
-        <View className='product-card dashed-card mt-20'>
-          <View className='star-badge' />
+        <View className='product-card surface-card mt-20'>
           <View className='product-row'>
             <View className='product-icon-wrapper'>
                 <Image
                 className='product-icon-img'
-                src={assetUrl(order.productIcon?.startsWith('/icon/') || /^https?:/i.test(order.productIcon || '') ? order.productIcon : PRODUCT_ICON_MAP[order.productId] || '/icon/四角星.svg')}
+                src={assetUrl((order.productIcon || '').startsWith('/icon/') || /^https?:/i.test(order.productIcon || '') ? order.productIcon : PRODUCT_ICON_MAP[order.productId] || '/icon/四角星.svg')}
                 mode='aspectFit'
               />
             </View>
@@ -157,8 +154,7 @@ export default function OrderDetailPage() {
         </View>
 
         {/* 收货地址 */}
-        <View className='address-card dashed-card mt-20'>
-          <View className='star-badge' />
+        <View className='address-card surface-card mt-20'>
           <View className='address-header'>
             <View className='flex-center'>
               <Image className='card-icon-img' src={assetUrl('/icon/地址.png')} mode='aspectFit' />
@@ -175,7 +171,7 @@ export default function OrderDetailPage() {
                 <Text className='address-phone'>{address.phone}</Text>
               </View>
               <Text className='address-detail'>
-                {address.region?.join(' ')} {address.detail}
+                {(address.region || []).join(' ')} {address.detail}
               </Text>
             </View>
           ) : (
@@ -186,8 +182,7 @@ export default function OrderDetailPage() {
         </View>
 
         {/* 订单信息 */}
-        <View className='meta-card dashed-card mt-20'>
-          <View className='star-badge' />
+        <View className='meta-card surface-card mt-20'>
           <Text className='meta-title'>订单信息</Text>
           <View className='meta-row'>
             <Text className='meta-label'>订单编号</Text>
@@ -208,7 +203,7 @@ export default function OrderDetailPage() {
         {/* 地址选择底部弹窗 */}
         {showAddrPicker && (
           <View className='modal-overlay' style={{ alignItems: 'flex-end', justifyContent: 'flex-end' }}>
-            <View className='addr-picker-sheet dashed-card'>
+            <View className='addr-picker-sheet surface-card'>
               <View className='addr-picker-header'>
                 <Text className='addr-picker-title'>选择收货地址</Text>
                 <Text className='addr-picker-close' onTap={() => setShowAddrPicker(false)}>✕</Text>
@@ -217,7 +212,7 @@ export default function OrderDetailPage() {
                 {addrList.map((addr) => (
                   <View
                     key={addr.id}
-                    className={`addr-picker-item ${address?.id === addr.id ? 'active' : ''}`}
+                    className={`addr-picker-item ${address && address.id === addr.id ? 'active' : ''}`}
                     onTap={() => handlePickAddress(addr)}
                   >
                     <View className='addr-picker-row'>
@@ -226,7 +221,7 @@ export default function OrderDetailPage() {
                       {addr.isDefault && <Text className='addr-picker-default'>默认</Text>}
                     </View>
                     <Text className='addr-picker-detail'>
-                      {addr.region?.join(' ')} {addr.detail}
+                      {(addr.region || []).join(' ')} {addr.detail}
                     </Text>
                   </View>
                 ))}
diff --git a/src/pages/orders/index.scss b/src/pages/orders/index.scss
index 5c8caef..d3a8abf 100644
--- a/src/pages/orders/index.scss
+++ b/src/pages/orders/index.scss
@@ -22,11 +22,11 @@
 }
 .tab-label {
   font-size: 28px;
-  color: #b08d8d;
+  color: var(--text-secondary);
   font-weight: 500;
 }
 .tab-item.active .tab-label {
-  color: #ff9a9e;
+  color: var(--accent-primary);
   font-weight: 700;
 }
 .tab-underline {
@@ -36,7 +36,7 @@
   transform: translateX(-50%);
   width: 40px;
   height: 4px;
-  background: #ff9a9e;
+  background: var(--accent-primary);
   border-radius: 4px;
 }
 
@@ -54,12 +54,12 @@
   justify-content: space-between;
   align-items: center;
   padding-bottom: 20px;
-  border-bottom: 2px dashed #fce4ec;
+  border-bottom: 1rpx solid var(--border);
   margin-bottom: 20px;
 }
 .order-date {
   font-size: 24px;
-  color: #b08d8d;
+  color: var(--text-secondary);
 }
 
 .order-body {
@@ -70,7 +70,7 @@
 .order-icon-wrapper {
   width: 120px;
   height: 120px;
-  background: linear-gradient(135deg, #fff0f5 0%, #e3f2fd 100%);
+  background: var(--bg-input);
   border-radius: 16px;
   display: flex;
   align-items: center;
@@ -91,25 +91,25 @@
 .order-product {
   font-size: 30px;
   font-weight: 700;
-  color: #5c3a3a;
+  color: var(--text-primary);
   display: block;
   margin-bottom: 8px;
 }
 .order-sku {
   font-size: 24px;
-  color: #b08d8d;
+  color: var(--text-secondary);
   display: block;
   margin-bottom: 8px;
 }
 .order-meta {
   font-size: 22px;
-  color: #ccc;
+  color: var(--text-muted);
   display: block;
 }
 
 .order-footer {
   padding-top: 16px;
-  border-top: 2px dashed #fce4ec;
+  border-top: 1rpx solid var(--border);
 }
 .order-price-bar {
   display: flex;
@@ -119,13 +119,13 @@
 }
 .price-label {
   font-size: 24px;
-  color: #b08d8d;
+  color: var(--text-secondary);
   margin-right: 8px;
 }
 .price-value {
   font-size: 36px;
   font-weight: 800;
-  color: #ff6b81;
+  color: var(--accent-primary);
 }
 .order-actions {
   display: flex;
@@ -135,7 +135,7 @@
 .order-btn {
   padding: 14px 28px !important;
   font-size: 26px !important;
-  border-radius: 40px !important;
+  border-radius: 999rpx !important;
 }
 
 /* 空状态 */
diff --git a/src/pages/orders/index.tsx b/src/pages/orders/index.tsx
index 0b326e8..df3cfe6 100644
--- a/src/pages/orders/index.tsx
+++ b/src/pages/orders/index.tsx
@@ -62,9 +62,15 @@ export default function OrdersPage() {
 
   // 页面每次显示时刷新（处理下单后同步）
   useEffect(() => {
-    Taro.eventCenter?.once?.('orders:refresh', load)
+    if (Taro.eventCenter) {
+      Taro.eventCenter.once('orders:refresh', load)
+    }
     load()
-    return () => { Taro.eventCenter?.off?.('orders:refresh', load) }
+    return () => {
+      if (Taro.eventCenter) {
+        Taro.eventCenter.off('orders:refresh', load)
+      }
+    }
   }, [])
 
   const filteredOrders = activeTab === 'all'
@@ -81,8 +87,7 @@ export default function OrdersPage() {
       <LoginGuard>
         <View className='orders-page'>
 
-          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
-            <View className='star-badge' />
+          <View className='page-header surface-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <Text className='page-title'>我的订单</Text>
           </View>
 
@@ -106,13 +111,12 @@ export default function OrdersPage() {
           <ScrollView className='orders-list' scrollY>
             {filteredOrders.map((order) => {
               const status = STATUS_MAP[order.statusCode] || STATUS_MAP.pending
-              const rawIcon = order.productIcon?.startsWith('/icon/') || /^https?:/i.test(order.productIcon || '')
+              const rawIcon = (order.productIcon || '').startsWith('/icon/') || /^https?:/i.test(order.productIcon || '')
                 ? order.productIcon
                 : '/icon/四角星.svg'
               const iconSrc = assetUrl(rawIcon)
               return (
-                <View key={order.id} className='order-card dashed-card' onTap={() => goDetail(order)}>
-                  <View className='star-badge' />
+                <View key={order.id} className='order-card surface-card' onTap={() => goDetail(order)}>
                   <View className='order-header'>
                     <Text className='order-date'>{order.date}</Text>
                     <Text className={`badge ${status.badge}`}>{status.label}</Text>
@@ -134,36 +138,36 @@ export default function OrdersPage() {
                     </View>
                     <View className='order-actions'>
                       {order.statusCode === 'pending' && (
-                        <View className='btn-gradient order-btn'>
+                        <View className='btn-primary order-btn'>
                           <Text>立即付款</Text>
                         </View>
                       )}
                       {order.statusCode === 'paid' && (
-                        <View className='btn-outline order-btn'>
+                        <View className='btn-secondary order-btn'>
                           <Text>催发货</Text>
                         </View>
                       )}
                       {order.statusCode === 'shipping' && (
                         <>
-                          <View className='btn-outline order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '查看物流', icon: 'none' }) }}>
+                          <View className='btn-secondary order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '查看物流', icon: 'none' }) }}>
                             <Text>查看物流</Text>
                           </View>
-                          <View className='btn-gradient order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '确认收货', icon: 'none' }) }}>
+                          <View className='btn-primary order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '确认收货', icon: 'none' }) }}>
                             <Text>确认收货</Text>
                           </View>
                         </>
                       )}
                       {order.statusCode === 'done' && (
                         <>
-                          <View className='btn-outline order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '申请售后', icon: 'none' }) }}>
+                          <View className='btn-secondary order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '申请售后', icon: 'none' }) }}>
                             <Text>申请售后</Text>
                           </View>
-                          <View className='btn-gradient order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '再来一单', icon: 'none' }) }}>
+                          <View className='btn-primary order-btn' onTap={(e) => { e.stopPropagation(); Taro.showToast({ title: '再来一单', icon: 'none' }) }}>
                             <Text>再来一单</Text>
                           </View>
                         </>
                       )}
-                      <View className='btn-outline order-btn' onTap={(e) => { e.stopPropagation(); goDetail(order) }}>
+                      <View className='btn-secondary order-btn' onTap={(e) => { e.stopPropagation(); goDetail(order) }}>
                         <Text>详情</Text>
                       </View>
                     </View>
@@ -177,7 +181,7 @@ export default function OrdersPage() {
                 <Image className='empty-icon-img' src={assetUrl('/icon/包裹.png')} mode='aspectFit' />
                 <Text className='empty-text'>暂无订单</Text>
                 <Text className='empty-sub'>去首页开始定制吧</Text>
-                <View className='btn-gradient' onTap={() => Taro.switchTab({ url: '/pages/index/index' })}>
+                <View className='btn-primary' onTap={() => Taro.switchTab({ url: '/pages/index/index' })}>
                   <Text>去定制</Text>
                 </View>
               </View>