diff --git a/project_doing.md b/project_doing.md
index 9cb92a6..efbc964 100644
--- a/project_doing.md
+++ b/project_doing.md
@@ -40,3 +40,15 @@
     - Updated Panel B template to use real API data structure.
 
 
+
+## 2026-01-24
+
+### [Task 10] Optimize Dark Mode for simulate.vue
+- **Time**: 2026-01-24
+- **Goal**: Full support for dark theme using dark: classes for all components in the simulation page.
+- **Scope**: src/pages/simulate.vue
+- **Result**:
+    - Applied detailed dark: classes to Sidebar, Panel A/B, and Data Tables.
+    - Optimized color contrast for sticky columns and scrollable areas in dark mode.
+    - Updated all modals (Major list, Switch plan) and Popconfirm UI for dark mode compatibility.
+
diff --git a/src/pages/simulate.vue b/src/pages/simulate.vue
index 1e107fd..d280a26 100644
--- a/src/pages/simulate.vue
+++ b/src/pages/simulate.vue
@@ -593,8 +593,8 @@ function deletePlan(planId: string) {
       1. 移动端提示层 (Phone View)
       逻辑：默认显示 (flex)，在 lg (1024px) 及以上屏幕隐藏
   ========================================================== -->
-    <div class="w-full flex flex-col items-center justify-center bg-gray-50 p-8 text-center lg:hidden">
-      <div class="max-w-sm w-full rounded-2xl bg-white p-8 shadow-lg">
+    <div class="w-full flex flex-col items-center justify-center bg-gray-50 dark:bg-slate-950 p-8 text-center lg:hidden">
+      <div class="max-w-sm w-full rounded-2xl bg-white dark:bg-slate-900 p-8 shadow-lg">
         <!-- 图标 (手机) -->
         <div class="mx-auto mb-4 h-16 w-16 flex items-center justify-center rounded-full bg-blue-50 text-blue-500">
           <svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@@ -605,10 +605,10 @@ function deletePlan(planId: string) {
           </svg>
         </div>
 
-        <h3 class="mb-2 text-xl text-slate-800 font-bold">
+        <h3 class="mb-2 text-xl text-slate-800 dark:text-slate-100 font-bold">
           请访问小程序
         </h3>
-        <p class="mb-6 text-sm text-slate-500 leading-relaxed">
+        <p class="mb-6 text-sm text-slate-500 dark:text-slate-400 leading-relaxed">
           当前页面包含大量数据表格，<br>为保证最佳体验，请在 PC 端浏览<br>或前往微信小程序查看。
         </p>
 
@@ -625,7 +625,7 @@ function deletePlan(planId: string) {
          新增：左侧固定侧边栏
     ========================================================== -->
     <div
-      class="fixed left-0 top-24 z-50 hidden w-15 flex-col select-none items-center border-r border-slate-200 rounded-lg bg-white py-8 shadow-lg lg:flex"
+      class="fixed left-0 top-24 z-50 hidden w-15 flex-col select-none items-center border-r border-slate-200 dark:border-slate-800 rounded-lg bg-white dark:bg-slate-900 py-8 shadow-lg lg:flex"
     >
       <!-- Logo 占位 -->
       <!-- <div class="mb-8">
@@ -635,12 +635,12 @@ function deletePlan(planId: string) {
       <div class="w-full flex flex-col gap-6 px-2">
         <button
           class="group flex flex-col items-center gap-1 rounded-lg p-2 transition-colors"
-          :class="activePanel === 'market' ? 'bg-blue-50 text-blue-600' : 'text-slate-500 hover:bg-slate-50'"
+          :class="activePanel === 'market' ? 'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400' : 'text-slate-500 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/50'"
           @click="activePanel = 'market'"
         >
           <div
             class="rounded-full p-2"
-            :class="activePanel === 'market' ? 'bg-blue-100' : 'bg-slate-100 group-hover:bg-slate-200'"
+            :class="activePanel === 'market' ? 'bg-blue-100 dark:bg-blue-900/40' : 'bg-slate-100 dark:bg-slate-800 group-hover:bg-slate-200 dark:group-hover:bg-slate-700'"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
@@ -657,12 +657,12 @@ function deletePlan(planId: string) {
 
         <button
           class="group flex flex-col items-center gap-1 rounded-lg p-2 transition-colors"
-          :class="activePanel === 'my-volunteers' ? 'bg-blue-50 text-blue-600' : 'text-slate-500 hover:bg-slate-50'"
+          :class="activePanel === 'my-volunteers' ? 'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400' : 'text-slate-500 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800/50'"
           @click="activePanel = 'my-volunteers'"
         >
           <div
             class="relative rounded-full p-2"
-            :class="activePanel === 'my-volunteers' ? 'bg-blue-100' : 'bg-slate-100 group-hover:bg-slate-200'"
+            :class="activePanel === 'my-volunteers' ? 'bg-blue-100 dark:bg-blue-900/40' : 'bg-slate-100 dark:bg-slate-800 group-hover:bg-slate-200 dark:group-hover:bg-slate-700'"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
@@ -688,7 +688,7 @@ function deletePlan(planId: string) {
 
     <div
       id="bPanel"
-      class="mx-auto hidden h-screen max-w-7xl flex-col select-none px-4 text-slate-700 font-sans lg:flex lg:px-8 sm:px-6"
+      class="mx-auto hidden h-screen max-w-7xl flex-col select-none px-4 text-slate-700 dark:text-slate-200 font-sans lg:flex lg:px-8 sm:px-6"
     >
       <!-- =========================================================
            Panel A: 模拟填志愿 (原有的市场列表)
@@ -696,7 +696,7 @@ function deletePlan(planId: string) {
       ========================================================== -->
       <div v-show="activePanel === 'market'" class="h-full flex flex-col">
         <!-- 顶部筛选栏 (保持不变) -->
-        <div class="mt-8 rounded-t-lg bg-white p-6 border-b border-slate-200">
+        <div class="mt-8 rounded-t-lg bg-white dark:bg-slate-900 p-6 border-b border-slate-200 dark:border-slate-800">
           <div class="grid grid-cols-1 select-none gap-6 lg:grid-cols-6">
             <!-- Top Toolbar -->
             <div class="lg:col-span-4">
@@ -712,7 +712,7 @@ function deletePlan(planId: string) {
               :class="[
                 currentBatchTab === tab.key
                   ? 'bg-blue-500 text-white border-blue-500'
-                  : 'bg-white text-slate-600 hover:text-blue-500 border-slate-200',
+                  : 'bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-400 hover:text-blue-500 dark:hover:text-blue-400 border-slate-200 dark:border-slate-800',
               ]" @click="currentBatchTab = tab.key"
             >
               {{ tab.label }}
@@ -726,7 +726,7 @@ function deletePlan(planId: string) {
               :class="[
                 currentBatch2Tab === tab.key
                   ? 'bg-blue-500 text-white border-blue-500'
-                  : 'bg-white text-slate-600 hover:text-blue-500 border-slate-200',
+                  : 'bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-400 hover:text-blue-500 dark:hover:text-blue-400 border-slate-200 dark:border-slate-800',
               ]" @click="currentBatch2Tab = tab.key"
             >
               {{ tab.label }}
@@ -742,7 +742,7 @@ function deletePlan(planId: string) {
             :class="[
               currentProbTab === tab.key
                 ? 'bg-blue-500 text-white border-blue-500'
-                : 'bg-white text-slate-600 hover:text-blue-500 border-slate-200',
+                : 'bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-400 hover:text-blue-500 dark:hover:text-blue-400 border-slate-200 dark:border-slate-800',
             ]" @click="currentProbTab = tab.key"
           >
             {{ tab.label }} <span class="ml-1 opacity-90">{{ tab.count }}</span>
@@ -754,38 +754,38 @@ function deletePlan(planId: string) {
         <!-- 关键点：h-[calc(100vh-150px)] 用于限制高度，overflow-auto 用于滚动 -->
         <div
           ref="scrollContainer"
-          class="relative flex-1 h-[calc(100vh-320px)] overflow-auto scroll-smooth border border-slate-200 rounded-b-md bg-white shadow-sm"
+          class="relative flex-1 h-[calc(100vh-320px)] overflow-auto scroll-smooth border border-slate-200 dark:border-slate-800 rounded-b-md bg-white dark:bg-slate-900 shadow-sm"
           @scroll="handleScroll"
         >
           <table class="relative min-w-[1500px] w-full border-collapse text-sm">
             <!-- 表头 -->
-            <thead class="sticky top-0 z-30 bg-slate-50 text-center text-slate-500 font-medium shadow-sm">
+            <thead class="sticky top-0 z-30 bg-slate-50 dark:bg-slate-800 text-center text-slate-500 dark:text-slate-400 font-medium shadow-sm">
               <tr>
                 <!-- 左侧冻结列：院校 -->
                 <th
-                  class="sticky left-0 z-40 w-52 border-r border-slate-200 bg-slate-50 p-4 text-left shadow-[4px_0_8px_-4px_rgba(0,0,0,0.1)]"
+                  class="sticky left-0 z-40 w-52 border-r border-slate-200 dark:border-slate-700 bg-slate-50 dark:bg-slate-800 p-4 text-left shadow-[4px_0_8px_-4px_rgba(0,0,0,0.1)]"
                 >
                   招生院校
                 </th>
-                <th class="w-auto border-r border-slate-200 p-4">
+                <th class="w-auto border-r border-slate-200 dark:border-slate-700 p-4">
                   招生专业
                 </th>
-                <th class="w-40 border-r border-slate-200 p-2">
+                <th class="w-40 border-r border-slate-200 dark:border-slate-700 p-2">
                   录取概率
                 </th>
-                <th class="w-32 border-r border-slate-200 p-2">
+                <th class="w-32 border-r border-slate-200 dark:border-slate-700 p-2">
                   26省内招生
                 </th>
                 <!-- 假设中间有很多历年数据列，撑开宽度 -->
-                <th class="w-20 border-r border-slate-200 p-2">
+                <th class="w-20 border-r border-slate-200 dark:border-slate-700 p-2">
                   历年
                 </th>
-                <th class="w-32 border-r border-slate-200 p-2" v-for="(item) in oldYears" :key="item">
+                <th class="w-32 border-r border-slate-200 dark:border-slate-700 p-2" v-for="(item) in oldYears" :key="item">
                   {{item}}
                 </th>
                 <!-- 右侧冻结列：操作 -->
                 <th
-                  class="sticky right-0 z-40 w-40 border-l border-slate-200 bg-slate-50 p-4 shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)]"
+                  class="sticky right-0 z-40 w-40 border-l border-slate-200 dark:border-slate-700 bg-slate-50 dark:bg-slate-800 p-4 shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)]"
                 >
                   操作
                 </th>
@@ -793,38 +793,38 @@ function deletePlan(planId: string) {
             </thead>
 
             <!-- 表格内容 -->
-            <tbody class="divide-y divide-slate-200">
+            <tbody class="divide-y divide-slate-200 dark:divide-slate-800">
               <template v-for="school in schools" :key="school.schoolCode + school.majorCode">
                 <!-- Row 1 -->
-                <tr class="group transition-colors hover:bg-slate-50">
+                <tr class="group transition-colors hover:bg-slate-50 dark:hover:bg-slate-800/50">
                   <!-- Sticky Left: 院校信息 -->
                   <!-- 注意：bg-white 是为了遮挡滚动的文字，group-hover:bg-slate-50 是为了保持 hover 效果 -->
                   <td
                     rowspan="4"
-                    class="sticky left-0 z-20 border-r border-slate-200 bg-white p-4 align-top shadow-[4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-slate-50"
+                    class="sticky left-0 z-20 border-r border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-4 align-top shadow-[4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-slate-50 dark:group-hover:bg-slate-800/50"
                   >
-                    <div class="mb-1 w-52 truncate text-left text-base text-slate-900 font-bold" :title="school.schoolName">
+                    <div class="mb-1 w-52 truncate text-left text-base text-slate-900 dark:text-slate-100 font-bold" :title="school.schoolName">
                       {{ school.schoolName }}
                     </div>
-                    <div class="mb-2 flex flex-wrap gap-1 text-xs text-slate-500">
-                      <span v-for="tag in [school.province, school.schoolNature, school.institutionType].filter(Boolean)" :key="tag" class="rounded bg-slate-100 px-1 py-0.5">{{ tag
+                    <div class="mb-2 flex flex-wrap gap-1 text-xs text-slate-500 dark:text-slate-400">
+                      <span v-for="tag in [school.province, school.schoolNature, school.institutionType].filter(Boolean)" :key="tag" class="rounded bg-slate-100 dark:bg-slate-800 px-1 py-0.5">{{ tag
                       }}</span>
                     </div>
-                    <div class="text-left text-xs text-slate-400">
+                    <div class="text-left text-xs text-slate-400 dark:text-slate-500">
                       代码 {{ school.schoolCode }}
                     </div>
                   </td>
 
                   <!-- 中间普通滚动列 -->
 
-                  <td rowspan="4" class="border-r border-slate-100 bg-white p-4 align-top group-hover:bg-slate-50">
-                    <div class="mb-1 text-slate-900 font-bold">
+                  <td rowspan="4" class="border-r border-slate-100 dark:border-slate-800 bg-white dark:bg-slate-900 p-4 align-top group-hover:bg-slate-50 dark:group-hover:bg-slate-800/50">
+                    <div class="mb-1 text-slate-900 dark:text-slate-100 font-bold">
                       {{ school.majorName }}
                     </div>
-                    <div class="mb-1 text-xs text-slate-500">
+                    <div class="mb-1 text-xs text-slate-500 dark:text-slate-400">
                       {{ school.limitation }}
                     </div>
-                    <div class="mt-2 text-xs text-slate-400">
+                    <div class="mt-2 text-xs text-slate-400 dark:text-slate-500">
                       {{ `[${school.enrollmentCode}]` }} {{ school.tuition }}
                     </div>
                   </td>
@@ -833,7 +833,7 @@ function deletePlan(planId: string) {
                     rowspan="4"
                     class="border-r border-slate-100 bg-white p-2 text-center align-top group-hover:bg-slate-50"
                   >
-                    <div class="mb-2 text-lg font-bold">
+                    <div class="mb-2 text-lg font-bold text-slate-900 dark:text-slate-100">
                       {{ school.enrollProbability }}%
                     </div>
                     <div class="mb-2 flex justify-center">
@@ -844,7 +844,7 @@ function deletePlan(planId: string) {
                         {{ getProbabilityLabel(school.enrollProbability) }}
                       </div>
                     </div>
-                    <div class="mb-2 flex justify-center">
+                    <div class="mb-2 flex justify-center text-slate-600 dark:text-slate-400">
                       折合分：{{school.studentScore}}
                     </div>
                   </td>
@@ -853,27 +853,27 @@ function deletePlan(planId: string) {
                     rowspan="4"
                     class="border-r border-slate-100 bg-white p-2 text-center align-top group-hover:bg-slate-50"
                   >
-                    <div class="text-lg font-medium">
+                    <div class="text-lg font-medium text-slate-900 dark:text-slate-100">
                       {{ school.planNum }}人
                     </div>
                   </td>
 
                   <!-- 历年数据区域 (横向较宽) -->
                   <td
-                    class="h-10 border-r border-slate-100 bg-slate-50/50 px-2 py-2 text-center text-xs text-slate-500"
+                    class="h-10 border-r border-slate-100 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-800/30 px-2 py-2 text-center text-xs text-slate-500 dark:text-slate-400"
                   >
                     招生人数
                   </td>
-                  <td class="border-r border-slate-100 px-2 py-2 text-center text-sm" v-for="year in oldYears" :key="year">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-2 py-2 text-center text-sm text-slate-700 dark:text-slate-300" v-for="year in oldYears" :key="year">
                     {{ school.historyMajorEnrollMap?.[year]?.enrollmentCount || "-" }}
                   </td>
                   <!-- Sticky Right: 操作 -->
                   <td
                     rowspan="4"
-                    class="sticky right-0 z-20 border-l border-slate-200 bg-white p-4 text-center align-middle shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-slate-50"
+                    class="sticky right-0 z-20 border-l border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-4 text-center align-middle shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-slate-50 dark:group-hover:bg-slate-800/50"
                   >
                     <button
-                      class="whitespace-nowrap border border-blue-500 rounded-full bg-white px-3 py-1.5 text-xs text-blue-500 transition-colors hover:bg-blue-50"
+                      class="whitespace-nowrap border border-blue-500 rounded-full bg-white dark:bg-slate-900 px-3 py-1.5 text-xs text-blue-500 dark:text-blue-400 transition-colors hover:bg-blue-50 dark:hover:bg-blue-900/20"
                       @click="openMajorModal(school)"
                     >
                       查看可选专业
@@ -882,25 +882,25 @@ function deletePlan(planId: string) {
                 </tr>
 
                 <!-- Row 2: 最低分数 -->
-                <tr class="group hover:bg-slate-50">
+                <tr class="group hover:bg-slate-50 dark:hover:bg-slate-800/50">
                   <td
-                    class="h-10 border-r border-slate-100 bg-slate-50/50 px-2 py-2 text-center text-xs text-slate-500"
+                    class="h-10 border-r border-slate-100 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-800/30 px-2 py-2 text-center text-xs text-slate-500 dark:text-slate-400"
                   >
                     最低分数
                   </td>
-                  <td class="border-r border-slate-100 px-2 py-2 text-center text-sm font-medium" v-for="year in oldYears" :key="year">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-2 py-2 text-center text-sm font-medium text-slate-700 dark:text-slate-300" v-for="year in oldYears" :key="year">
                     {{ school.historyMajorEnrollMap?.[year]?.admissionLine || "-" }}
                   </td>
                 </tr>
 
                 <!-- Row 3: 历年线差 -->
-                <tr class="group hover:bg-slate-50">
+                <tr class="group hover:bg-slate-50 dark:hover:bg-slate-800/50">
                   <td
-                    class="h-10 border-r border-slate-100 bg-slate-50/50 px-2 py-2 text-center text-xs text-slate-500"
+                    class="h-10 border-r border-slate-100 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-800/30 px-2 py-2 text-center text-xs text-slate-500 dark:text-slate-400"
                   >
                     历年线差
                   </td>
-                  <td class="border-r border-slate-100 px-2 py-2 text-center text-sm" v-for="year in oldYears" :key="year">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-2 py-2 text-center text-sm text-slate-700 dark:text-slate-300" v-for="year in oldYears" :key="year">
                     {{ (school.historyMajorEnrollMap?.[year]?.admissionLine && school.historyMajorEnrollMap?.[year]?.controlLine) 
                        ? (school.historyMajorEnrollMap[year].admissionLine - school.historyMajorEnrollMap[year].controlLine).toFixed(1) 
                        : "-" }}
@@ -908,13 +908,13 @@ function deletePlan(planId: string) {
                 </tr>
 
                 <!-- Row 4: 录取方式 -->
-                <tr class="group border-b border-slate-200 hover:bg-slate-50">
+                <tr class="group border-b border-slate-200 dark:border-slate-800 hover:bg-slate-50 dark:hover:bg-slate-800/50">
                   <td
-                    class="h-10 border-r border-slate-100 bg-slate-50/50 px-2 py-2 text-center text-xs text-slate-500"
+                    class="h-10 border-r border-slate-100 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-800/30 px-2 py-2 text-center text-xs text-slate-500 dark:text-slate-400"
                   >
                     录取方式
                   </td>
-                  <td class="border-r border-slate-100 px-2 py-2 text-center text-xs text-slate-600" v-for="year in oldYears" :key="year">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-2 py-2 text-center text-xs text-slate-600 dark:text-slate-400" v-for="year in oldYears" :key="year">
                     {{ school.historyMajorEnrollMap?.[year]?.rulesEnrollProbability || "-" }}
                   </td>
                 </tr>
@@ -922,7 +922,7 @@ function deletePlan(planId: string) {
 
               <!-- 加载状态条 -->
               <tr v-if="isLoading || isFinished">
-                <td colspan="100%" class="sticky left-0 bg-slate-50 p-4 text-center text-sm text-slate-500">
+                <td colspan="100%" class="sticky left-0 bg-slate-50 dark:bg-slate-800 p-4 text-center text-sm text-slate-500 dark:text-slate-400">
                   <span v-if="isLoading" class="flex items-center justify-center gap-2">
                     <svg
                       class="h-5 w-5 animate-spin text-blue-500" xmlns="http://www.w3.org/2000/svg" fill="none"
@@ -950,20 +950,20 @@ function deletePlan(planId: string) {
       ========================================================== -->
       <div v-show="activePanel === 'my-volunteers'" class="h-full flex flex-col animate-fade-in-up">
         <div
-          class="mb-6 mt-8 flex flex-col gap-4 rounded-lg bg-white p-6 shadow lg:flex-row lg:items-center lg:justify-between"
+          class="mb-6 mt-8 flex flex-col gap-4 rounded-lg bg-white dark:bg-slate-900 p-6 shadow lg:flex-row lg:items-center lg:justify-between border border-transparent dark:border-slate-800"
         >
           <!-- 左侧：标题与统计 -->
           <div>
             <div class="flex items-center gap-3">
-              <h2 class="text-2xl text-slate-800 font-bold">
+              <h2 class="text-2xl text-slate-800 dark:text-slate-100 font-bold">
                 {{ currentVolunteerInfo?.volunteerName || '未命名方案' }}
               </h2>
-              <span class="border border-orange-100 rounded bg-orange-50 px-2 py-0.5 text-xs text-orange-500">
+              <span class="border border-orange-100 dark:border-orange-900/30 rounded bg-orange-50 dark:bg-orange-900/20 px-2 py-0.5 text-xs text-orange-500 dark:text-orange-400">
                 {{ volunteerPlans.find(p => p.id === activePlanId)?.tag || '手动' }}
               </span>
             </div>
-            <p class="mt-2 text-left text-sm text-slate-500">
-              拖拽左侧手柄可调整顺序，共 <span class="text-blue-600 font-bold">{{ myVolunteers.length }}</span> 个志愿
+            <p class="mt-2 text-left text-sm text-slate-500 dark:text-slate-400">
+              拖拽左侧手柄可调整顺序，共 <span class="text-blue-600 dark:text-blue-400 font-bold">{{ myVolunteers.length }}</span> 个志愿
             </p>
           </div>
 
@@ -971,7 +971,7 @@ function deletePlan(planId: string) {
           <div class="flex flex-wrap items-center gap-3">
             <!-- 新建 -->
             <button
-              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 transition-colors hover:border-slate-200 hover:bg-slate-50 hover:text-blue-600"
+              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 dark:text-slate-400 transition-colors hover:border-slate-200 dark:hover:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 hover:text-blue-600 dark:hover:text-blue-400"
               @click="handleCreatePlan"
             >
               <svg
@@ -985,7 +985,7 @@ function deletePlan(planId: string) {
 
             <!-- 修改 -->
             <button
-              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 transition-colors hover:border-slate-200 hover:bg-slate-50 hover:text-blue-600"
+              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 dark:text-slate-400 transition-colors hover:border-slate-200 dark:hover:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 hover:text-blue-600 dark:hover:text-blue-400"
               @click="handleEditPlan"
             >
               <svg
@@ -1002,7 +1002,7 @@ function deletePlan(planId: string) {
 
             <!-- 切换 (点击触发弹窗) -->
             <button
-              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 transition-colors hover:border-slate-200 hover:bg-slate-50 hover:text-blue-600"
+              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 dark:text-slate-400 transition-colors hover:border-slate-200 dark:hover:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 hover:text-blue-600 dark:hover:text-blue-400"
               @click="handleSwitchPlan"
             >
               <svg
@@ -1019,7 +1019,7 @@ function deletePlan(planId: string) {
 
             <!-- 导出 -->
             <button
-              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 transition-colors hover:border-slate-200 hover:bg-slate-50 hover:text-blue-600"
+              class="flex items-center gap-1.5 border border-transparent rounded-md px-3 py-2 text-sm text-slate-600 dark:text-slate-400 transition-colors hover:border-slate-200 dark:hover:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800 hover:text-blue-600 dark:hover:text-blue-400"
               @click="handleExportPlan"
             >
               <svg
@@ -1035,7 +1035,7 @@ function deletePlan(planId: string) {
             </button>
 
             <!-- 提交按钮 (突出显示) -->
-            <div class="mx-1 h-6 w-px bg-slate-200" />
+            <div class="mx-1 h-6 w-px bg-slate-200 dark:bg-slate-800" />
             <button
               :disabled="!isModified || isSaving"
               class="ml-1 rounded bg-blue-600 px-5 py-2 text-sm text-white font-medium shadow-md transition-all active:scale-95 hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed"
@@ -1054,34 +1054,34 @@ function deletePlan(planId: string) {
             :class="[
               volunteerCurrentTab === tab.key
                 ? 'bg-blue-500 text-white border-blue-500'
-                : 'bg-white text-slate-600 hover:text-blue-500 border-slate-200',
+                : 'bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-400 hover:text-blue-500 dark:hover:text-blue-400 border-slate-200 dark:border-slate-800',
             ]" @click="switchVolunteerTab(tab.key)"
           >
             {{ tab.label }} <span class="ml-1 opacity-90">({{ `${tab.count}/${tab.max}` }})</span>
           </button>
         </div>
         <div
-          class="relative flex-1 overflow-auto scroll-smooth border border-slate-200 rounded-b-md bg-white shadow-sm"
+          class="relative flex-1 overflow-auto scroll-smooth border border-slate-200 dark:border-slate-800 rounded-b-md bg-white dark:bg-slate-900 shadow-sm"
         >
           <table class="w-full border-collapse text-sm">
-            <thead class="sticky top-0 z-30 bg-slate-50 text-slate-500 font-medium shadow-sm">
+            <thead class="sticky top-0 z-30 bg-slate-50 dark:bg-slate-800 text-slate-500 dark:text-slate-400 font-medium shadow-sm">
               <tr>
-                <th class="w-16 border-r border-slate-200 p-4 text-center">
+                <th class="w-16 border-r border-slate-200 dark:border-slate-700 p-4 text-center">
                   排序
                 </th>
-                <th class="w-20 border-r border-slate-200 p-4 text-center">
+                <th class="w-20 border-r border-slate-200 dark:border-slate-700 p-4 text-center">
                   序号
                 </th>
-                <th class="border-r border-slate-200 p-4 text-left">
+                <th class="border-r border-slate-200 dark:border-slate-700 p-4 text-left">
                   院校信息
                 </th>
-                <th class="border-r border-slate-200 p-4 text-left">
+                <th class="border-r border-slate-200 dark:border-slate-700 p-4 text-left">
                   专业信息
                 </th>
-                <th class="border-r border-slate-200 p-4 text-center">
+                <th class="border-r border-slate-200 dark:border-slate-700 p-4 text-center">
                   概率/分数
                 </th>
-                <th class="border-r border-slate-200 p-4 text-center">
+                <th class="border-r border-slate-200 dark:border-slate-700 p-4 text-center">
                   25省内招生
                 </th>
                 <th class="w-32 p-4 text-center">
@@ -1089,16 +1089,16 @@ function deletePlan(planId: string) {
                 </th>
               </tr>
             </thead>
-            <tbody class="divide-y divide-slate-200">
+            <tbody class="divide-y divide-slate-200 dark:divide-slate-800">
               <tr
                 v-for="(vol, index) in filteredVolunteers" :key="vol.id"
-                class="group bg-white transition-colors hover:bg-slate-50" :draggable="dragEnabledIndex === index"
+                class="group bg-white dark:bg-slate-900 transition-colors hover:bg-slate-50 dark:hover:bg-slate-800/50" :draggable="dragEnabledIndex === index"
                 @dragstart="handleDragStart($event, index)" @dragover="handleDragOver($event)"
                 @drop="handleDrop(index)"
               >
                 <!-- 拖拽手柄列 -->
                 <td
-                  class="cursor-move cursor-move border-r border-slate-200 p-4 text-center text-slate-400 active:text-blue-700 hover:text-blue-500" @mouseenter="dragEnabledIndex = index"
+                  class="cursor-move border-r border-slate-200 dark:border-slate-700 p-4 text-center text-slate-400 dark:text-slate-500 active:text-blue-700 hover:text-blue-500 dark:hover:text-blue-400" @mouseenter="dragEnabledIndex = index"
                   @mouseleave="dragEnabledIndex = null"
                 >
                   <svg
@@ -1110,42 +1110,42 @@ function deletePlan(planId: string) {
                 </td>
 
                 <!-- 志愿序号 -->
-                <td class="border-r border-slate-200 p-4 text-center text-lg text-slate-500 font-bold">
+                <td class="border-r border-slate-200 dark:border-slate-700 p-4 text-center text-lg text-slate-500 dark:text-slate-400 font-bold">
                   {{ index + 1 }}
                 </td>
 
                 <!-- 院校信息 -->
-                <td class="border-r border-slate-200 p-4 text-left">
-                  <div class="text-base text-slate-900 font-bold">
+                <td class="border-r border-slate-200 dark:border-slate-700 p-4 text-left">
+                  <div class="text-base text-slate-900 dark:text-slate-100 font-bold">
                     {{ vol.schoolName }}
                   </div>
                   <div class="mt-1 flex gap-2">
                     <span
                       v-for="tag in (vol.tags || [vol.province, vol.schoolNature].filter(Boolean))" :key="tag"
-                      class="rounded bg-slate-100 px-1.5 py-0.5 text-xs text-slate-500"
+                      class="rounded bg-slate-100 dark:bg-slate-800 px-1.5 py-0.5 text-xs text-slate-500 dark:text-slate-400"
                     >{{ tag }}</span>
                   </div>
-                  <div class="mt-1 text-xs text-slate-400">
+                  <div class="mt-1 text-xs text-slate-400 dark:text-slate-500">
                     代码: {{ vol.schoolCode }}
                   </div>
                 </td>
 
                 <!-- 专业信息 -->
-                <td class="border-r border-slate-200 p-4">
-                  <div class="text-slate-800 font-bold">
+                <td class="border-r border-slate-200 dark:border-slate-700 p-4">
+                  <div class="text-slate-800 dark:text-slate-100 font-bold">
                     {{ vol.majorName }}
                   </div>
-                  <div class="mt-1 text-xs text-slate-500">
+                  <div class="mt-1 text-xs text-slate-500 dark:text-slate-400">
                     {{ vol.tuition || '-' }}
                   </div>
-                  <div class="text-xs text-slate-400">
+                  <div class="text-xs text-slate-400 dark:text-slate-500">
                     代码: {{ vol.majorCode }}
                   </div>
                 </td>
 
                 <!-- 分数/概率 -->
-                <td class="border-r border-slate-200 p-4 text-center">
-                  <div class="text-lg font-bold">
+                <td class="border-r border-slate-200 dark:border-slate-700 p-4 text-center">
+                  <div class="text-lg font-bold text-slate-900 dark:text-slate-100">
                     {{ vol.enrollProbability }}%
                   </div>
                   <!-- <div class="mt-1 text-xs text-slate-500">
@@ -1160,8 +1160,8 @@ function deletePlan(planId: string) {
                 </td>
 
                 <!-- 25省内招生 -->
-                <td class="border-r border-slate-200 p-4 text-center">
-                  <div class="text-lg font-bold">
+                <td class="border-r border-slate-200 dark:border-slate-700 p-4 text-center">
+                  <div class="text-lg font-bold text-slate-900 dark:text-slate-100">
                     {{ vol.planNum }}人
                   </div>
                 </td>
@@ -1188,11 +1188,11 @@ function deletePlan(planId: string) {
 
               <!-- 空状态 -->
               <tr v-if="myVolunteers.length === 0">
-                <td colspan="7" class="items-center justify-center py-20 text-center text-slate-400">
+                <td colspan="7" class="items-center justify-center py-20 text-center text-slate-400 dark:text-slate-500">
                   <div class="flex flex-col items-center justify-center">
-                    <div class="mb-3 rounded-full bg-slate-100 p-4">
+                    <div class="mb-3 rounded-full bg-slate-100 dark:bg-slate-800 p-4">
                     <svg
-                      xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-slate-300" fill="none"
+                      xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-slate-300 dark:text-slate-600" fill="none"
                       viewBox="0 0 24 24" stroke="currentColor"
                     >
                       <path
@@ -1221,22 +1221,22 @@ function deletePlan(planId: string) {
       >
         <!-- 宽度加宽至 1100px 以容纳更多列 -->
         <div
-          class="h-[85vh] w-[1100px] flex flex-col animate-fade-in-up overflow-hidden rounded-lg bg-white shadow-2xl"
+          class="h-[85vh] w-[1100px] flex flex-col animate-fade-in-up overflow-hidden rounded-lg bg-white dark:bg-slate-900 shadow-2xl border border-transparent dark:border-slate-800"
         >
           <!-- Header -->
-          <div class="flex items-center justify-between border-b border-slate-200 bg-slate-50 px-6 py-4">
+          <div class="flex items-center justify-between border-b border-slate-200 dark:border-slate-800 bg-slate-50 dark:bg-slate-800/50 px-6 py-4">
             <div>
               <div class="flex items-end gap-3">
-                <h3 class="text-xl text-slate-800 font-bold">
+                <h3 class="text-xl text-slate-800 dark:text-slate-100 font-bold">
                   {{ currentSchool?.schoolName }}
                 </h3>
-                <span class="text-sm text-slate-500">院校代码: {{ currentSchool?.schoolCode }}</span>
+                <span class="text-sm text-slate-500 dark:text-slate-400">院校代码: {{ currentSchool?.schoolCode }}</span>
               </div>
-              <p class="mt-1 text-xs text-slate-500">
+              <p class="mt-1 text-xs text-slate-500 dark:text-slate-400">
                 该院校下的其他专业列表
               </p>
             </div>
-            <button class="rounded-full p-1 text-slate-400 hover:bg-slate-200 hover:text-slate-600" @click="closeModal">
+            <button class="rounded-full p-1 text-slate-400 dark:text-slate-500 hover:bg-slate-200 dark:hover:bg-slate-700 hover:text-slate-600 dark:hover:text-slate-300" @click="closeModal">
               <svg
                 xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
                 stroke="currentColor"
@@ -1247,10 +1247,10 @@ function deletePlan(planId: string) {
           </div>
 
           <!-- Content: Table -->
-          <div class="flex-1 overflow-auto bg-slate-50 p-0">
+          <div class="flex-1 overflow-auto bg-slate-50 dark:bg-slate-900 p-0">
             <table class="w-full border-collapse text-left text-sm">
               <thead
-                class="sticky top-0 z-10 bg-slate-100 text-xs text-slate-500 font-semibold tracking-wider uppercase shadow-sm"
+                class="sticky top-0 z-10 bg-slate-100 dark:bg-slate-800 text-xs text-slate-500 dark:text-slate-400 font-semibold tracking-wider uppercase shadow-sm"
               >
                 <tr>
                   <th class="w-16 px-6 py-3">
@@ -1278,9 +1278,9 @@ function deletePlan(planId: string) {
                   </th>
                 </tr>
               </thead>
-              <tbody class="bg-white divide-y divide-slate-100">
+              <tbody class="bg-white dark:bg-slate-900 divide-y divide-slate-100 dark:divide-slate-800">
                 <tr v-if="modalLoading">
-                  <td colspan="7" class="p-12 text-center text-slate-400">
+                  <td colspan="7" class="p-12 text-center text-slate-400 dark:text-slate-500">
                     <svg class="mx-auto mb-2 h-8 w-8 animate-spin text-blue-400" viewBox="0 0 24 24">
                       <path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Z" opacity="0.2" />
                       <path fill="currentColor" d="M12 2A10 10 0 0 1 22 12h-2a8 8 0 0 0-8-8V2Z" />
@@ -1290,20 +1290,20 @@ function deletePlan(planId: string) {
                 </tr>
                 <tr
                   v-for="major in modalMajors" v-else :key="major.code"
-                  class="group transition-colors hover:bg-blue-50/30"
+                  class="group transition-colors hover:bg-blue-50/30 dark:hover:bg-blue-900/10"
                 >
-                  <td class="px-6 py-4 text-xs text-slate-400 font-mono">
+                  <td class="px-6 py-4 text-xs text-slate-400 dark:text-slate-500 font-mono">
                     {{ major.enrollmentCode }}
                   </td>
                   <td class="px-6 py-4">
-                    <div class="text-base text-slate-800 font-bold">
+                    <div class="text-base text-slate-800 dark:text-slate-100 font-bold">
                       {{ major.name }}
                     </div>
-                    <div class="mt-1 flex gap-2 text-xs text-slate-500">
-                      <span class="rounded bg-slate-100 px-1.5 py-0.5">{{
+                    <div class="mt-1 flex gap-2 text-xs text-slate-500 dark:text-slate-400">
+                      <span class="rounded bg-slate-100 dark:bg-slate-800 px-1.5 py-0.5">{{
                         major.batch
                       }}</span>
-                      <span class="rounded bg-slate-100 px-1.5 py-0.5">{{
+                      <span class="rounded bg-slate-100 dark:bg-slate-800 px-1.5 py-0.5">{{
                         major.tuition
                       }}</span>
                     </div>
@@ -1313,26 +1313,26 @@ function deletePlan(planId: string) {
                       class="font-bold" :class="getStatusColor(getProbabilityLabel(major.prob))"
                     >{{ major.prob }}%</span>
                   </td>
-                  <td class="px-6 py-4 text-center font-medium">
+                  <td class="px-6 py-4 text-center font-medium text-slate-700 dark:text-slate-300">
                     {{ major.score }}
                   </td>
-                  <td class="px-6 py-4 text-center text-slate-500">
+                  <td class="px-6 py-4 text-center text-slate-500 dark:text-slate-400">
                     {{ major.rulesEnrollProbability }}
                   </td>
-                  <td class="px-6 py-4 text-center text-slate-500">
+                  <td class="px-6 py-4 text-center text-slate-500 dark:text-slate-400">
                     {{ major.plan }}人
                   </td>
 
                   <!-- 操作列：加入/移除 -->
                   <td
-                    class="sticky right-0 bg-white px-6 py-4 text-center shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-blue-50/30"
+                    class="sticky right-0 bg-white dark:bg-slate-900 px-6 py-4 text-center shadow-[-4px_0_8px_-4px_rgba(0,0,0,0.1)] group-hover:bg-blue-50/30 dark:group-hover:bg-blue-900/10"
                   >
                     <button
                       class="min-w-[90px] rounded-full px-3 py-1.5 text-xs font-medium transition-all duration-200"
                       :class="[
                         selectedMajorCodes.includes(`${currentSchool?.schoolCode}_${major.code}_${major.enrollmentCode || currentSchool?.enrollmentCode}`)
-                          ? 'bg-red-50 text-red-500 border border-red-200 hover:bg-red-100' // 选中状态：红色，显示志愿序号
-                          : 'bg-white text-blue-600 border border-blue-500 hover:bg-blue-50', // 未选状态：蓝色
+                          ? 'bg-red-50 dark:bg-red-900/20 text-red-500 dark:text-red-400 border border-red-200 dark:border-red-900/30 hover:bg-red-100 dark:hover:bg-red-900/30' // 选中状态：红色，显示志愿序号
+                          : 'bg-white dark:bg-slate-800 text-blue-600 dark:text-blue-400 border border-blue-500 dark:border-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20', // 未选状态：蓝色
                       ]" @click="toggleMajor(major)"
                     >
                       {{ getVolunteerBtnText(major) }}
@@ -1344,17 +1344,17 @@ function deletePlan(planId: string) {
           </div>
 
           <!-- Footer: Confirm with Popover -->
-          <div class="relative flex items-center justify-between border-t border-slate-200 bg-white p-4">
-            <div class="text-sm text-slate-500">
+          <div class="relative flex items-center justify-between border-t border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 p-4">
+            <div class="text-sm text-slate-500 dark:text-slate-400">
               已选
-              <span class="text-lg text-blue-600 font-bold">{{
+              <span class="text-lg text-blue-600 dark:text-blue-400 font-bold">{{
                 selectedMajorCodes.length
               }}</span>
               个志愿
             </div>
 
             <div class="relative flex gap-3">
-              <button class="px-5 py-2 text-sm text-slate-600 hover:text-slate-900" @click="closeModal">
+              <button class="px-5 py-2 text-sm text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-slate-200" @click="closeModal">
                 取消
               </button>
 
@@ -1389,11 +1389,11 @@ function deletePlan(planId: string) {
                 <!-- 气泡层 -->
                 <div
                   v-if="showSaveConfirm"
-                  class="absolute bottom-full right-0 z-50 mb-3 w-64 animate-fade-in-up border border-slate-200 rounded-lg bg-white p-4 shadow-xl"
+                  class="absolute bottom-full right-0 z-50 mb-3 w-64 animate-fade-in-up border border-slate-200 dark:border-slate-800 rounded-lg bg-white dark:bg-slate-900 p-4 shadow-xl"
                 >
                   <!-- 小三角 -->
                   <div
-                    class="absolute right-6 h-3 w-3 rotate-45 border-b border-r border-slate-200 bg-white -bottom-1.5"
+                    class="absolute right-6 h-3 w-3 rotate-45 border-b border-r border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 -bottom-1.5"
                   />
 
                   <div class="mb-3 flex items-start gap-3">
@@ -1407,10 +1407,10 @@ function deletePlan(planId: string) {
                       </svg>
                     </div>
                     <div>
-                      <p class="text-sm text-slate-800 font-bold">
+                      <p class="text-sm text-slate-800 dark:text-slate-100 font-bold">
                         确认提交志愿？
                       </p>
-                      <p class="mt-1 text-xs text-slate-500">
+                      <p class="mt-1 text-xs text-slate-500 dark:text-slate-400">
                         提交后将更新您的志愿表，已选
                         {{ selectedMajorCodes.length }} 个专业。
                       </p>
@@ -1419,7 +1419,7 @@ function deletePlan(planId: string) {
 
                   <div class="flex justify-end gap-2">
                     <button
-                      class="rounded px-2 py-1 text-xs text-slate-500 hover:bg-slate-100"
+                      class="rounded px-2 py-1 text-xs text-slate-500 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
                       @click="showSaveConfirm = false"
                     >
                       再想想
@@ -1452,16 +1452,16 @@ function deletePlan(planId: string) {
         @click.self="showSwitchModal = false"
       >
         <div
-          class="max-h-[80vh] w-[1000px] flex flex-col animate-fade-in-up overflow-hidden rounded-lg bg-white shadow-2xl"
+          class="max-h-[80vh] w-[1000px] flex flex-col animate-fade-in-up overflow-hidden rounded-lg bg-white dark:bg-slate-900 shadow-2xl border border-transparent dark:border-slate-800"
         >
           <!-- Header -->
-          <div class="flex items-center justify-between border-b border-slate-200 px-6 py-4">
-            <h3 class="text-lg text-slate-800 font-bold">
+          <div class="flex items-center justify-between border-b border-slate-200 dark:border-slate-800 px-6 py-4">
+            <h3 class="text-lg text-slate-800 dark:text-slate-100 font-bold">
               我的志愿方案
             </h3>
 
             <!-- 简单的关闭按钮 -->
-            <button class="text-slate-400 hover:text-slate-600" @click="showSwitchModal = false">
+            <button class="text-slate-400 dark:text-slate-500 hover:text-slate-600 dark:hover:text-slate-300" @click="showSwitchModal = false">
               <svg
                 xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
                 stroke="currentColor"
@@ -1472,16 +1472,16 @@ function deletePlan(planId: string) {
           </div>
 
           <!-- Toolbar / Filter -->
-          <div class="flex justify-end border-b border-slate-100 bg-slate-50 px-6 py-3">
+          <div class="flex justify-end border-b border-slate-100 dark:border-slate-800 bg-slate-50 dark:bg-slate-800/50 px-6 py-3">
             <div class="relative">
               <select
-                class="appearance-none border border-slate-300 rounded bg-white py-1.5 pl-3 pr-8 text-sm text-slate-700 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+                class="appearance-none border border-slate-300 dark:border-slate-700 rounded bg-white dark:bg-slate-800 py-1.5 pl-3 pr-8 text-sm text-slate-700 dark:text-slate-300 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
               >
                 <option>请选择省份</option>
                 <option>北京</option>
                 <option>湖北</option>
               </select>
-              <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-slate-500">
+              <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-slate-500 dark:text-slate-600">
                 <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                   <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
                 </svg>
@@ -1490,68 +1490,68 @@ function deletePlan(planId: string) {
           </div>
 
           <!-- Table -->
-          <div class="flex-1 overflow-auto p-6">
-            <table class="w-full border border-slate-200 text-left text-sm">
-              <thead class="bg-slate-50 text-slate-500">
+          <div class="flex-1 overflow-auto p-6 bg-white dark:bg-slate-900">
+            <table class="w-full border border-slate-200 dark:border-slate-800 text-left text-sm">
+              <thead class="bg-slate-50 dark:bg-slate-800 text-slate-500 dark:text-slate-400">
                 <tr>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 font-medium">
                     名称
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     省份
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     艺术类别
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     文化分
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     统考分
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     最后更新时间
                   </th>
-                  <th class="border-b border-r border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-r border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     状态
                   </th>
-                  <th class="border-b border-slate-200 px-4 py-3 text-center font-medium">
+                  <th class="border-b border-slate-200 dark:border-slate-800 px-4 py-3 text-center font-medium">
                     操作
                   </th>
                 </tr>
               </thead>
-              <tbody class="divide-y divide-slate-100">
-                <tr v-for="plan in volunteerPlans" :key="plan.id" class="transition-colors hover:bg-slate-50">
-                  <td class="border-r border-slate-100 px-4 py-3">
+              <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
+                <tr v-for="plan in volunteerPlans" :key="plan.id" class="transition-colors hover:bg-slate-50 dark:hover:bg-slate-800/50">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3">
                     <div class="flex items-center gap-2">
-                      <span class="text-slate-700 font-medium">{{ plan.name }}</span>
+                      <span class="text-slate-700 dark:text-slate-300 font-medium">{{ plan.name }}</span>
                       <span
                         class="rounded px-1.5 py-0.5 text-[10px]"
-                        :class="plan.tag === '手动' ? 'bg-orange-50 text-orange-500' : 'bg-blue-50 text-blue-500'"
+                        :class="plan.tag === '手动' ? 'bg-orange-50 dark:bg-orange-900/20 text-orange-500 dark:text-orange-400' : 'bg-blue-50 dark:bg-blue-900/20 text-blue-500 dark:text-blue-400'"
                       >
                         {{ plan.tag }}
                       </span>
                     </div>
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center text-slate-600">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center text-slate-600 dark:text-slate-400">
                     {{ plan.province }}
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center text-slate-600">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center text-slate-600 dark:text-slate-400">
                     {{ plan.artType }}
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center">
-                    <span class="text-slate-800 font-medium">{{ plan.cultureScore }}</span>
-                    <span class="ml-1 text-xs text-slate-400">{{ plan.cultureSubjects }}</span>
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center">
+                    <span class="text-slate-800 dark:text-slate-200 font-medium">{{ plan.cultureScore }}</span>
+                    <span class="ml-1 text-xs text-slate-400 dark:text-slate-500">{{ plan.cultureSubjects }}</span>
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center text-slate-800 font-medium">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center text-slate-800 dark:text-slate-200 font-medium">
                     {{
                       plan.artScore }}
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center text-xs text-slate-500 font-mono">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center text-xs text-slate-500 dark:text-slate-500 font-mono">
                     {{
                       plan.updateTime }}
                   </td>
-                  <td class="border-r border-slate-100 px-4 py-3 text-center text-slate-600">
+                  <td class="border-r border-slate-100 dark:border-slate-800 px-4 py-3 text-center text-slate-600 dark:text-slate-400">
                     {{ plan.status }}
                   </td>
                   <td class="px-4 py-3 text-center">
@@ -1565,13 +1565,13 @@ function deletePlan(planId: string) {
                       >
                         切换
                       </button>
-                      <span class="text-slate-300">|</span>
-                      <button class="text-xs text-slate-600 hover:text-slate-900 hover:underline">
+                      <span class="text-slate-300 dark:text-slate-700">|</span>
+                      <button class="text-xs text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-slate-200 hover:underline">
                         导出
                       </button>
-                      <span class="text-slate-300">|</span>
+                      <span class="text-slate-300 dark:text-slate-700">|</span>
                       <button
-                        class="text-xs text-slate-600 hover:text-red-600 hover:underline"
+                        class="text-xs text-slate-600 dark:text-slate-400 hover:text-red-600 dark:hover:text-red-400 hover:underline"
                         @click="deletePlan(plan.id)"
                       >
                         删除