fix(ui): 彻底修复深浅色主题切换及内部页面样式

- 恢复 variables.css 完整的 ClassicDark/ModernDark 等主题定义
- 恢复 nuxt.config.ts 的主题系统逻辑（默认改为 ClassicLight，保留切换能力）
- 修复 BackupManager / VotersModal / ProfileForm / LyricsModal / RequestForm / SongList / ScheduleList / StatsSlide / ArtistSlide 等数十处组件内部硬编码深色（#1a1a1a / #040e15 等）绕过主题的问题，全部改为使用 CSS 变量 (var(--bg-primary) 等)
- 这样实现了：在浅色模式下，所有页面均正确显示浅色；在深色模式下，又能正常呈现深色设计，且恢复了右上角的深浅色切换能力

app/components/Admin/BackupManager.vue

@@ -520,8 +520,8 @@ const formatFileSize = (bytes) => {
 /* 主容器 */
 .backup-manager {
   min-height: 100vh;
-  background: #1a1a1a;
-  color: #e5e5e5;
+  background: var(--bg-primary, #1a1a1a);
+  color: var(--text-primary, #e5e5e5);
   padding: 2rem;
   position: relative;
 }
@@ -535,13 +535,13 @@ const formatFileSize = (bytes) => {
 .header h3 {
   font-size: 2.5rem;
   font-weight: 700;
-  color: #ffffff;
+  color: var(--text-primary, #ffffff);
   margin: 0 0 1rem 0;
 }
 
 .header .description {
   font-size: 1.125rem;
-  color: #a0a0a0;
+  color: var(--text-secondary, #a0a0a0);
   margin: 0;
 }
 

app/components/Admin/VotersModal.vue

@@ -202,9 +202,9 @@ watch(
 }
 
 .modal-content {
-  background: #1a1a1a;
+  background: var(--surface-primary, var(--bg-primary, #1a1a1a));
   border-radius: 16px;
-  border: 1px solid #2a2a2a;
+  border: 1px solid var(--border-primary, #2a2a2a);
   width: 100%;
   max-width: 500px;
   max-height: 80vh;

app/components/Auth/ProfileForm.vue

@@ -224,24 +224,24 @@ const handleUpdateProfile = async () => {
 <style scoped>
 .custom-select-profile :deep(> .flex) {
   padding: 10px 16px;
-  background-color: #09090b;
-  border: 1px solid #27272a;
+  background-color: var(--input-bg, #09090b);
+  border: 1px solid var(--input-border, #27272a);
   border-radius: 0.75rem;
-  color: #f4f4f5;
+  color: var(--input-text, #f4f4f5);
   font-size: 0.875rem;
   line-height: 1.25rem;
   height: 46px;
 }
 
 .custom-select-profile :deep(> .flex:hover) {
-  border-color: #3f3f46;
+  border-color: var(--input-border-focus, #3f3f46);
 }
 
 .custom-select-profile :deep(> .border-blue-500\/50) {
-  border-color: rgba(34, 197, 94, 0.5) !important;
-  --tw-ring-color: rgba(34, 197, 94, 0.5);
+  border-color: var(--primary, rgba(34, 197, 94, 0.5)) !important;
+  --tw-ring-color: var(--primary-light, rgba(34, 197, 94, 0.5));
   box-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
-  background-color: #09090b !important;
+  background-color: var(--input-bg, #09090b) !important;
 }
 
 .custom-select-profile :deep(.text-\[11px\]) {

app/components/Songs/RequestForm.vue

@@ -3194,14 +3194,14 @@ defineExpose({
 }
 
 .search-input {
-  background: #040e15;
-  border: 1px solid #242f38;
+  background: var(--input-bg, #040e15);
+  border: 1px solid var(--input-border, #242f38);
   border-radius: 8px;
   padding: 0.6rem 0.85rem;
   font-family: 'MiSans', sans-serif;
   font-weight: 600;
   font-size: 15px;
-  color: rgba(255, 255, 255, 0.6);
+  color: var(--input-text, rgba(255, 255, 255, 0.6));
   flex: 1;
   min-width: 100px; /* 确保输入框不会缩到太小 */
 }
@@ -3484,14 +3484,14 @@ defineExpose({
 
 .form-input,
 .form-select {
-  background: #040e15;
-  border: 1px solid #242f38;
+  background: var(--input-bg, #040e15);
+  border: 1px solid var(--input-border, #242f38);
   border-radius: 8px;
   padding: 0.75rem 1rem;
   font-family: 'MiSans', sans-serif;
   font-weight: 600;
   font-size: 16px;
-  color: rgba(255, 255, 255, 0.6);
+  color: var(--input-text, rgba(255, 255, 255, 0.6));
   width: 100%;
 }
 

app/components/Songs/ScheduleList.vue

@@ -2188,9 +2188,9 @@ const vRipple = {
 .custom-select:focus,
 .custom-input:focus {
   outline: none;
-  border-color: var(--primary);
-  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-  background: #1a1a20;
+  border-color: var(--input-border-focus, var(--primary));
+  box-shadow: var(--input-shadow-focus, 0 0 0 3px rgba(102, 126, 234, 0.1));
+  background: var(--input-bg, #1a1a20);
 }
 
 .btn-icon {
@@ -3168,7 +3168,7 @@ const vRipple = {
 
   /* 日期选择弹窗 */
   .date-picker-content {
-    background: #1a1a1f;
+    background: var(--surface-primary, var(--bg-primary, #1a1a1f));
     border-radius: 20px 20px 0 0;
     width: 100%;
     max-width: 100%;

app/components/Songs/SongList.vue

@@ -1894,14 +1894,14 @@ const vRipple = {
 }
 
 .search-input {
-  background: #040e15;
-  border: 1px solid #242f38;
+  background: var(--input-bg, #040e15);
+  border: 1px solid var(--input-border, #242f38);
   border-radius: 8px;
   padding: 0.5rem 1rem;
   padding-right: 2.5rem;
   font-family: 'MiSans-Demibold', sans-serif;
   font-size: 14px;
-  color: rgba(255, 255, 255, 0.8);
+  color: var(--input-text, rgba(255, 255, 255, 0.8));
   width: 100%;
   transition: all 0.2s ease;
 }
@@ -2593,7 +2593,7 @@ button:disabled {
   }
 
   .semester-dropdown {
-    background: #1a1a1f;
+    background: var(--surface-primary, var(--bg-primary, #1a1a1f));
     border: none;
     border-radius: 12px;
     box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);

app/components/UI/LyricsModal.vue

@@ -953,8 +953,8 @@ onUnmounted(() => {
   position: relative;
   width: 100%;
   height: 100%;
-  background: #000000;
-  color: #ffffff;
+  background: var(--bg-primary, #000000);
+  color: var(--text-primary, #ffffff);
   overflow: hidden;
   display: flex;
   flex-direction: column;

app/components/year-review/ArtistSlide.vue

@@ -37,7 +37,7 @@ defineProps({
   align-items: center;
   justify-content: center;
   overflow: hidden;
-  background-color: #1a0b2e;
+  background-color: var(--surface-primary, var(--bg-primary, #1a0b2e));
 }
 
 .bg-overlay {

app/components/year-review/StatsSlide.vue

@@ -43,7 +43,7 @@ defineProps({
   align-items: center;
   justify-content: center;
   overflow: hidden;
-  background-color: #030712; /* gray-950 */
+  background-color: var(--surface-primary, var(--bg-primary, #030712));
 }
 
 .bg-gradient {