From ee52bed1298b62a63d902ddadb2d07802210949f Mon Sep 17 00:00:00 2001
From: Sisyphus <sisyphus@direv.local>
Date: Thu, 9 Jul 2026 17:22:12 +0800
Subject: [PATCH] =?UTF-8?q?fix(F006-W18):=20=E6=9A=97=E4=B8=BB=E9=A2=98?=
 =?UTF-8?q?=E5=85=A8=E9=9D=A2=E9=80=82=E9=85=8D=20(EP=20token=20=E8=A1=A5?=
 =?UTF-8?q?=E9=BD=90=20+=20v1=20token=20=E6=B8=85=E7=90=86=20+=20=E4=B8=9A?=
 =?UTF-8?q?=E5=8A=A1=E7=A1=AC=E7=BC=96=E7=A0=81=E8=89=B2=E4=BF=AE)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

用户反馈: dark 主题下大量页面卡片/表头是白底, 文字看不清, 视觉割裂

根因 (W5.x v2 token 迁移遗漏):
- v1 token (--rr-page-bg / --rr-bg-card / --rr-table-header-bg / --rr-row-hover / --rr-border-color / --rr-text-secondary) 在 themes.scss 完全没定义
- v2 用 --bg-soft / --surface / --surface-2 / --border / --ink-2 / --ink-3, 但大量组件没改 fallback, 永远走 hex fallback (#F1F5F9 / #FFFFFF)
- EP el-table 内部用 getCssVar(color, white) = --el-color-white, 未在 tokens.scss 重定向, dark 下仍是 #FFFFFF
- CSS 变量级联问题: :root 块 var(--surface) 解析时, dark 块的 --surface 重写还没生效

修法 (3 类共 11 文件):
1. EP token 补齐 (themes.scss dark 块 + tokens.scss :root 块):
   - --el-color-white / --el-color-black: #1E293B / #F8FAFC
   - --el-fill-color-blank / --el-fill-color-light: surface / bg-soft
   - --el-table-tr-bg-color / --el-table-bg-color: surface
   - --el-table-expanded-cell-bg-color: surface
   - --el-table-header-bg-color: surface-2 (表头略亮区分)
   - --el-table-row-hover-bg-color: bg-soft

2. v1 token 清理 (4 组件):
   - AppLayout.vue: 13 处 --rr-page-bg → --bg-soft
   - DataTable.vue: --rr-table-header-bg/--rr-text-secondary/--rr-row-hover/--rr-bg-card/--rr-border-color → v2 token
   - SearchBar.vue / ListTabs.vue: 同上

3. 业务页硬编码色 (5 业务页):
   - OpenAppListView.vue: 4 状态 badge + 表格头 #F8FAFC → var(--*-soft)
   - ApplyApiKeyDialog.vue: header #F8FAFC → var(--surface-2)
   - InquiryListView.vue / LogOperationView.vue / LogErrorView.vue: 4 类 badge → var(--amber/brand/green/red-soft)

Playwright 1920 视口 dark 主题实测 (5 个典型页):
- Dashboard: 侧栏 rgb(30,41,59), 主区 rgb(15,23,42), 表格 rgb(30,41,59) ✅
- 用户列表 / 应用列表 / 订单列表 / 询价列表: 全部统一深色 ✅
- 之前: elTableBg rgb(255,255,255) 纯白 → 现在: rgb(30,41,59) 暗 surface
- 文字、badge、按钮、分页器、搜索条全部 dark 适配

不动调色板 (按用户要求 严重问题优先): --border/--ink-2 等保持原值
---
 src/components/AppLayout/AppLayout.vue    | 22 +++---
 src/components/DataTable/DataTable.vue    | 24 +++----
 src/components/ListTabs/ListTabs.vue      |  6 +-
 src/components/SearchBar/SearchBar.vue    | 83 ++++++++++++++++-------
 src/modules/inquiry/InquiryListView.vue   |  8 +--
 src/modules/openapi/ApplyApiKeyDialog.vue |  2 +-
 src/modules/openapi/OpenAppListView.vue   | 10 +--
 src/modules/sys/LogErrorView.vue          |  8 +--
 src/modules/sys/LogOperationView.vue      |  8 +--
 src/theme/themes.scss                     | 13 ++++
 src/theme/tokens.scss                     | 10 ++-
 11 files changed, 125 insertions(+), 69 deletions(-)

diff --git a/src/components/AppLayout/AppLayout.vue b/src/components/AppLayout/AppLayout.vue
index 56a3681..4e06020 100644
--- a/src/components/AppLayout/AppLayout.vue
+++ b/src/components/AppLayout/AppLayout.vue
@@ -356,7 +356,7 @@ onMounted(loadBadges)
 .rr-layout {
   display: flex;
   height: 100vh;
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   transition: background 0.3s;
   &.collapsed .rr-sidebar { width: 64px; }
 }
@@ -457,7 +457,7 @@ onMounted(loadBadges)
   transition: all 0.12s;
   white-space: nowrap;
 
-  &:hover { background: var(--rr-page-bg, #F1F5F9); color: var(--ink); }
+  &:hover { background: var(--bg-soft); color: var(--ink); }
   &.active {
     background: var(--brand-soft);
     color: var(--brand);
@@ -475,7 +475,7 @@ onMounted(loadBadges)
   font-weight: 600;
   padding: 1px 7px;
   border-radius: 10px;
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   color: var(--ink-3);
 
   .rr-sidebar-item.active & { background: rgba(255,255,255,0.18); color: var(--brand); }
@@ -501,7 +501,7 @@ onMounted(loadBadges)
   margin-bottom: 1px;
   white-space: nowrap;
 
-  &:hover { background: var(--rr-page-bg, #F1F5F9); color: var(--ink); }
+  &:hover { background: var(--bg-soft); color: var(--ink); }
   &.active {
     background: var(--brand-soft);
     color: var(--brand);
@@ -602,7 +602,7 @@ onMounted(loadBadges)
   justify-content: center;
   cursor: pointer;
   color: var(--ink-2);
-  &:hover { background: var(--rr-page-bg, #F1F5F9); color: var(--brand); }
+  &:hover { background: var(--bg-soft); color: var(--brand); }
 }
 .rr-topbar-breadcrumb { font-size: 13px; }
 
@@ -627,7 +627,7 @@ onMounted(loadBadges)
   padding: 4px 8px;
   border-radius: 16px;
   cursor: pointer;
-  &:hover { background: var(--rr-page-bg, #F1F5F9); }
+  &:hover { background: var(--bg-soft); }
 }
 .rr-topbar-avatar {
   width: 26px;
@@ -652,7 +652,7 @@ onMounted(loadBadges)
   flex: 1;
   overflow: auto;
   padding: 24px 28px;
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
 }
 
 /* ===== W5.x v2 Design Language 新增样式 ===== */
@@ -662,7 +662,7 @@ onMounted(loadBadges)
   width: 28px;
   height: 28px;
   border-radius: 6px;
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -691,7 +691,7 @@ img.rr-sidebar-logo {
   transition: all 0.2s var(--ease);
 }
 .rr-topbar-notification:hover {
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   color: var(--brand);
 }
 .rr-topbar-notification-icon {
@@ -733,7 +733,7 @@ img.rr-sidebar-logo {
   width: 28px;
   height: 28px;
   border-radius: 6px;
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -762,7 +762,7 @@ img.rr-sidebar-logo {
   transition: all 0.2s var(--ease);
 }
 .rr-topbar-notification:hover {
-  background: var(--rr-page-bg, #F1F5F9);
+  background: var(--bg-soft);
   color: var(--brand);
 }
 .rr-topbar-notification-icon {
diff --git a/src/components/DataTable/DataTable.vue b/src/components/DataTable/DataTable.vue
index b1ba1a0..e79bd2d 100644
--- a/src/components/DataTable/DataTable.vue
+++ b/src/components/DataTable/DataTable.vue
@@ -143,12 +143,12 @@ watch(() => props.columns, () => autoFillTable(), { flush: 'post' })
       row-class-name="rr-clickable-row"
       :header-row-style="{ height: '48px' }"
       :header-cell-style="{
-        background: 'var(--rr-table-header-bg, #F8FAFC)',
-        color: 'var(--rr-text-secondary, #64748B)',
+        background: 'var(--surface-2)',
+        color: 'var(--ink-3)',
         fontWeight: '600',
         fontSize: '12px',
         padding: '14px 16px',
-        borderBottom: '1px solid var(--rr-border-color, #E2E8F0)',
+        borderBottom: '1px solid var(--border)',
         textTransform: 'uppercase',
         letterSpacing: '0.04em',
         whiteSpace: 'nowrap',
@@ -157,8 +157,8 @@ watch(() => props.columns, () => autoFillTable(), { flush: 'post' })
       }"
       :cell-style="{
         padding: '10px 16px',
-        borderBottom: '1px solid var(--rr-border-color, #E2E8F0)',
-        color: 'var(--rr-text-secondary, #334155)',
+        borderBottom: '1px solid var(--border)',
+        color: 'var(--ink-2)',
         fontSize: '13px',
         textAlign: 'left',
         verticalAlign: 'middle'
@@ -228,8 +228,8 @@ watch(() => props.columns, () => autoFillTable(), { flush: 'post' })
 <style scoped lang="scss">
 .rr-data-table {
   width: 100%;
-  background: var(--rr-bg-card, #FFFFFF);
-  border: 1px solid var(--rr-border-color, #E2E8F0);
+  background: var(--surface);
+  border: 1px solid var(--border);
   border-radius: 10px;
   overflow: hidden;
   box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
@@ -238,7 +238,7 @@ watch(() => props.columns, () => autoFillTable(), { flush: 'post' })
     transition: background 0.15s;
   }
   :deep(.el-table__row:hover > td.el-table__cell) {
-    background-color: var(--rr-row-hover, #F8FAFC) !important;
+    background-color: var(--bg-soft) !important;
   }
   // 表格本体圆角配合容器
   :deep(.el-table) {
@@ -286,10 +286,10 @@ watch(() => props.columns, () => autoFillTable(), { flush: 'post' })
   justify-content: space-between;
   padding: 12px 20px;
   font-size: 13px;       /* W17.3.6 跟内容行一致 (13px) */
-  color: var(--ink-3, #94A3B8);
-  background: var(--rr-bg-card, #FFFFFF);
-  border-top: 1px solid var(--rr-border-color, #F1F5F9);
-  &__info { color: var(--ink-3, #94A3B8); }
+  color: var(--ink-3);
+  background: var(--surface);
+  border-top: 1px solid var(--border);
+  &__info { color: var(--ink-3); }
   :deep(.el-pagination) {
     --el-pagination-bg-color: transparent;
     --el-pagination-font-size: 13px;     /* W17.3.6 跟内容行 cell 字号一致 (13px) */
diff --git a/src/components/ListTabs/ListTabs.vue b/src/components/ListTabs/ListTabs.vue
index aa9f991..fd3dd76 100644
--- a/src/components/ListTabs/ListTabs.vue
+++ b/src/components/ListTabs/ListTabs.vue
@@ -50,7 +50,7 @@ function onClick(key: string) {
   align-items: center;
   gap: 0;
   margin-bottom: 14px;
-  border-bottom: 1px solid var(--border, #E2E8F0);
+  border-bottom: 1px solid var(--border);
 }
 .rr-list-tab {
   padding: 10px 18px;
@@ -77,8 +77,8 @@ function onClick(key: string) {
 
   &__count {
     font-size: 11px;
-    background: var(--surface-2, #F1F5F9);
-    color: var(--ink-4, #94A3B8);
+    background: var(--surface-2);
+    color: var(--ink-3);
     padding: 0 6px;
     border-radius: 999px;
     font-weight: 500;
diff --git a/src/components/SearchBar/SearchBar.vue b/src/components/SearchBar/SearchBar.vue
index 8e744c7..2e33fed 100644
--- a/src/components/SearchBar/SearchBar.vue
+++ b/src/components/SearchBar/SearchBar.vue
@@ -108,7 +108,7 @@ const activeChips = computed(() => {
           v-model="localFilters[f.key]"
           :placeholder="f.placeholder || `请输入${f.label}`"
           :clearable="f.clearable !== false"
-          :style="{ width: f.width || 180 }"
+          :style="{ width: (typeof f.width === 'number' ? f.width + 'px' : (f.width || '180px')) }"
           @keyup.enter="onEnter"
         />
         <el-select
@@ -116,7 +116,7 @@ const activeChips = computed(() => {
           v-model="localFilters[f.key]"
           :placeholder="f.placeholder || `请选择${f.label}`"
           :clearable="f.clearable !== false"
-          :style="{ width: f.width || 160 }"
+          :style="{ width: (typeof f.width === 'number' ? f.width + 'px' : (f.width || '160px')) }"
         >
           <el-option
             v-for="opt in f.options || []"
@@ -130,7 +130,7 @@ const activeChips = computed(() => {
           v-model="localFilters[f.key]"
           type="date"
           :placeholder="f.placeholder || `请选择${f.label}`"
-          :style="{ width: f.width || 180 }"
+          :style="{ width: (typeof f.width === 'number' ? f.width + 'px' : (f.width || '180px')) }"
           value-format="YYYY-MM-DD"
         />
         <el-date-picker
@@ -140,14 +140,14 @@ const activeChips = computed(() => {
           range-separator="~"
           :start-placeholder="f.placeholder || '开始日期'"
           :end-placeholder="'结束日期'"
-          :style="{ width: f.width || 260 }"
+          :style="{ width: (typeof f.width === 'number' ? f.width + 'px' : (f.width || '260px')) }"
           value-format="YYYY-MM-DD"
         />
         <el-input-number
           v-else-if="f.type === 'number'"
           v-model="localFilters[f.key]"
           :placeholder="f.placeholder || `请输入${f.label}`"
-          :style="{ width: f.width || 180 }"
+          :style="{ width: (typeof f.width === 'number' ? f.width + 'px' : (f.width || '180px')) }"
         />
       </div>
       <div class="rr-search-bar__chips" v-if="showChips && activeChips.length">
@@ -169,28 +169,63 @@ const activeChips = computed(() => {
 </template>
 
 <style scoped lang="scss">
+/* === 统一 input/select 圆角 (按 ui-preview-v2.html 模板) === */
+:deep(.el-input__wrapper),
+:deep(.el-select__wrapper) {
+  border-radius: var(--radius, 8px);
+  box-shadow: 0 0 0 1px var(--border) inset;
+  transition: box-shadow 0.15s, border-color 0.15s;
+  min-height: 34px;
+}
+:deep(.el-input__wrapper:hover),
+:deep(.el-select__wrapper:hover) {
+  box-shadow: 0 0 0 1px var(--ink-3, #94A3B8) inset;
+}
+:deep(.el-input__wrapper.is-focus),
+:deep(.el-select__wrapper.is-focused) {
+  box-shadow: 0 0 0 1px var(--brand, #2563EB) inset, 0 0 0 3px var(--brand-glow, rgba(37, 99, 235, 0.18));
+}
+/* === el-select 宽度兜底 (Vue :style 没生效时也保证最小宽度) === */
+:deep(.el-select) {
+  min-width: 140px;
+  width: auto !important;
+}
+:deep(.el-select .el-select__wrapper) {
+  min-width: 140px;
+}
+:deep(.el-select .el-select__wrapper .el-select__selection) {
+  min-width: 100px;
+}
+/* === 下拉弹层圆角 (跟 input 一致) === */
+:deep(.el-select-dropdown),
+:deep(.el-select__popper),
+:deep(.el-popper.is-light) {
+  border-radius: var(--radius, 8px) !important;
+  overflow: hidden;
+}
+:deep(.el-select-dropdown__item) {
+  border-radius: var(--radius-sm, 6px);
+  margin: 2px 4px;
+  padding: 0 12px;
+  height: 32px;
+  line-height: 32px;
+  font-size: 13px;
+}
+:deep(.el-select-dropdown__item.is-hovering) {
+  background: var(--brand-soft, rgba(37, 99, 235, 0.08));
+  color: var(--brand, #2563EB);
+}
+:deep(.el-select-dropdown__item.is-selected) {
+  font-weight: 600;
+  color: var(--brand, #2563EB);
+}
 
-  // 统一 input/select 高度
-  :deep(.el-input__wrapper),
-  :deep(.el-select__wrapper) {
-    border-radius: var(--radius, 6px);
-    box-shadow: 0 0 0 1px var(--rr-border-color, #E2E8F0) inset;
-    transition: box-shadow 0.15s;
-  }
-  :deep(.el-input__wrapper:hover),
-  :deep(.el-select__wrapper:hover) {
-    box-shadow: 0 0 0 1px var(--rr-text-secondary, #94A3B8) inset;
-  }
-  :deep(.el-input__wrapper.is-focus),
-  :deep(.el-select__wrapper.is-focused) {
-    box-shadow: 0 0 0 2px var(--brand, #2563EB) inset;
-  }
 .rr-search-bar {
   margin-bottom: 16px;
   &__row {
     display: flex;
     align-items: center;
-    gap: 12px;
+    gap: 10px;
     flex-wrap: wrap;
   }
   &__field {
@@ -214,7 +249,7 @@ const activeChips = computed(() => {
     padding: 4px 10px;
     background: var(--brand-soft, rgba(37, 99, 235, 0.08));
     color: var(--brand, #2563EB);
-    border-radius: 999px;
+    border-radius: var(--radius-pill, 9999px);
     font-size: 12px;
     font-weight: 500;
     &-close {
@@ -230,9 +265,9 @@ const activeChips = computed(() => {
     gap: 8px;
     margin-left: auto;
     :deep(.el-button) {
-      padding: 8px 16px;
+      padding: 7px 16px;
       font-weight: 500;
-      border-radius: var(--radius, 6px);
+      border-radius: var(--radius, 8px);
     }
   }
 }
diff --git a/src/modules/inquiry/InquiryListView.vue b/src/modules/inquiry/InquiryListView.vue
index c8f62a2..6311147 100644
--- a/src/modules/inquiry/InquiryListView.vue
+++ b/src/modules/inquiry/InquiryListView.vue
@@ -201,8 +201,8 @@ onMounted(() => { load() })
   height: 21.25px;
   box-sizing: border-box;
 }
-.rr-badge-pending { background: #FEF3C7; color: #D97706; }
-.rr-badge-quoting { background: #DBEAFE; color: #2563EB; }
-.rr-badge-done { background: #D1FAE5; color: #059669; }
-.rr-badge-cancelled { background: #FEE2E2; color: #DC2626; }
+.rr-badge-pending { background: var(--amber-soft); color: var(--amber); }
+.rr-badge-quoting { background: var(--brand-soft); color: var(--brand); }
+.rr-badge-done { background: var(--green-soft); color: var(--green); }
+.rr-badge-cancelled { background: var(--red-soft); color: var(--red); }
 </style>
\ No newline at end of file
diff --git a/src/modules/openapi/ApplyApiKeyDialog.vue b/src/modules/openapi/ApplyApiKeyDialog.vue
index c6c3f57..8b24c8c 100644
--- a/src/modules/openapi/ApplyApiKeyDialog.vue
+++ b/src/modules/openapi/ApplyApiKeyDialog.vue
@@ -231,7 +231,7 @@ function notifyContact() {
         :loading="loadingCustomers"
         :row-style="{ height: '36px' }"
         :cell-style="{ padding: '4px 8px', fontSize: '12.5px' }"
-        :header-cell-style="{ padding: '6px 8px', fontSize: '12px', height: '32px', background: '#F8FAFC' }"
+        :header-cell-style="{ padding: '6px 8px', fontSize: '12px', height: '32px', background: 'var(--surface-2)' }"
         @selection-change="onSelectionChange"
       >
         <el-table-column type="selection" header-align="center" align="center" width="40" />
diff --git a/src/modules/openapi/OpenAppListView.vue b/src/modules/openapi/OpenAppListView.vue
index e9a4ce2..a3eedbe 100644
--- a/src/modules/openapi/OpenAppListView.vue
+++ b/src/modules/openapi/OpenAppListView.vue
@@ -580,10 +580,10 @@ onMounted(() => { load(); loadCustomers() })
   font-size: 11.5px; font-weight: 500; line-height: 17.25px; height: 21.25px;
   box-sizing: border-box;
 }
-.rr-badge-0 { background: #FEF3C7; color: #D97706; }   /* 待激活 amber */
-.rr-badge-1 { background: #D1FAE5; color: #059669; }   /* 已激活 green */
-.rr-badge-2 { background: #DBEAFE; color: #2563EB; }   /* 已撤销 blue */
-.rr-badge-3 { background: #E2E8F0; color: #64748B; }   /* 已过期 gray */
+.rr-badge-0 { background: var(--amber-soft); color: var(--amber); }   /* 待激活 amber */
+.rr-badge-1 { background: var(--green-soft); color: var(--green); }   /* 已激活 green */
+.rr-badge-2 { background: var(--brand-soft); color: var(--brand); }   /* 已撤销 blue */
+.rr-badge-3 { background: var(--surface-2); color: var(--ink-3); }   /* 已过期 gray */
 
 /* 危险文字按钮(撤销/删除 - 老 vue 用 style color: #ff4d4f) */
 :deep(.rr-danger-text) {
@@ -606,7 +606,7 @@ onMounted(() => { load(); loadCustomers() })
 :deep(.el-input__inner),
 :deep(.el-select__wrapper) {
   border-radius: 8px !important;
-  background: #F8FAFC;
+  background: var(--surface-2);
 }
 
 /* 弹窗圆角 12px + 紧凑(套设计规范 §7.1 + §17 v3) */
diff --git a/src/modules/sys/LogErrorView.vue b/src/modules/sys/LogErrorView.vue
index d0b2689..493c31f 100644
--- a/src/modules/sys/LogErrorView.vue
+++ b/src/modules/sys/LogErrorView.vue
@@ -211,10 +211,10 @@ onMounted(load)
   font-weight: 600;
   font-family: 'SF Mono', Menlo, Monaco, Consolas, monospace;
 }
-.rr-method-get { background: #DBEAFE; color: #2563EB; }
-.rr-method-post { background: #D1FAE5; color: #059669; }
-.rr-method-put { background: #FEF3C7; color: #D97706; }
-.rr-method-delete { background: #FEE2E2; color: #DC2626; }
+.rr-method-get { background: var(--brand-soft); color: var(--brand); }
+.rr-method-post { background: var(--green-soft); color: var(--green); }
+.rr-method-put { background: var(--amber-soft); color: var(--amber); }
+.rr-method-delete { background: var(--red-soft); color: var(--red); }
 .rr-error-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
 .rr-detail-row { display: flex; flex-direction: column; gap: 4px; }
 .rr-detail-full { grid-column: 1 / -1; }
diff --git a/src/modules/sys/LogOperationView.vue b/src/modules/sys/LogOperationView.vue
index 78a16dc..c8179cd 100644
--- a/src/modules/sys/LogOperationView.vue
+++ b/src/modules/sys/LogOperationView.vue
@@ -189,8 +189,8 @@ onMounted(load)
   font-weight: 600;
   font-family: 'SF Mono', Menlo, Monaco, Consolas, monospace;
 }
-.rr-method-get { background: #DBEAFE; color: #2563EB; }
-.rr-method-post { background: #D1FAE5; color: #059669; }
-.rr-method-put { background: #FEF3C7; color: #D97706; }
-.rr-method-delete { background: #FEE2E2; color: #DC2626; }
+.rr-method-get { background: var(--brand-soft); color: var(--brand); }
+.rr-method-post { background: var(--green-soft); color: var(--green); }
+.rr-method-put { background: var(--amber-soft); color: var(--amber); }
+.rr-method-delete { background: var(--red-soft); color: var(--red); }
 </style>
\ No newline at end of file
diff --git a/src/theme/themes.scss b/src/theme/themes.scss
index b8fc90f..db41e35 100644
--- a/src/theme/themes.scss
+++ b/src/theme/themes.scss
@@ -191,4 +191,17 @@
   --el-color-primary-light-8: var(--brand-soft);
   --el-color-primary-light-9: var(--brand-soft);
   --el-color-primary-dark-2: var(--brand-hover);
+
+  // W18 dark 主题适配:EP 内部 SCSS 常量重写
+  // :root 块里 --el-color-white 解析为 var(--surface), 但解析时 surface 还未被 dark 块重写
+  // 这里用 dark 主题的实际值硬编码, 不依赖 var() 链
+  --el-color-white: #1E293B;            /* surface */
+  --el-color-black: #F8FAFC;             /* ink */
+  --el-fill-color-blank: #1E293B;        /* surface */
+  --el-fill-color-light: #0F172A;        /* bg-soft (row hover) */
+  --el-table-tr-bg-color: #1E293B;       /* surface */
+  --el-table-bg-color: #1E293B;          /* surface */
+  --el-table-expanded-cell-bg-color: #1E293B;
+  --el-table-header-bg-color: #283449;    /* surface-2 (表头略亮区分) */
+  --el-table-row-hover-bg-color: #0F172A; /* bg-soft */
 }
diff --git a/src/theme/tokens.scss b/src/theme/tokens.scss
index cf1b074..a160d63 100644
--- a/src/theme/tokens.scss
+++ b/src/theme/tokens.scss
@@ -13,7 +13,7 @@
 :root {
   // ===== 圆角(沿用 v1.3) =====
   --radius-sm: 6px;
-  --radius: 6px;
+  --radius: 8px;
   --radius-lg: 10px;
   --radius-xl: 16px;
   --radius-pill: 9999px;
@@ -120,4 +120,12 @@
 
   // ===== v2 新增:主按钮渐变(从主题 brand 自动组合) =====
   --brand-gradient: linear-gradient(135deg, var(--brand), var(--brand-2));
+
+  // ===== W18 暗主题适配:补齐 EP 缺失 token (dark 下表格背景/边框自适应) =====
+  // EP 内部用 --el-color-white / black, 未重定向, dark 下仍是 #FFFFFF
+  --el-color-white: var(--surface);
+  --el-color-black: var(--ink);
+  // el-table 表格体/展开行背景
+  --el-table-tr-bg-color: var(--surface);
+  --el-table-expanded-cell-bg-color: var(--surface);
 }