diff --git a/frontend/app.html b/frontend/app.html
index 0370b61..262e9ec 100644
--- a/frontend/app.html
+++ b/frontend/app.html
@@ -154,6 +154,49 @@
         linear-gradient(135deg, #e0e7ff 0%, #f0f4f8 50%, #fdf2f8 100%);
     }
 
+    /* 亮色主题导航栏 */
+    body.light-theme .navbar {
+      background: rgba(255, 255, 255, 0.85);
+      border-bottom: 1px solid rgba(102, 126, 234, 0.15);
+    }
+
+    body.light-theme .nav-item:hover {
+      background: rgba(102, 126, 234, 0.1);
+    }
+
+    body.light-theme .user-info {
+      background: rgba(102, 126, 234, 0.08);
+      border-color: rgba(102, 126, 234, 0.2);
+    }
+
+    /* 亮色主题卡片 */
+    body.light-theme .card {
+      background: rgba(255, 255, 255, 0.7);
+      box-shadow: 0 8px 32px rgba(102, 126, 234, 0.1);
+    }
+
+    /* 亮色主题表格 */
+    body.light-theme table tr:hover {
+      background: rgba(102, 126, 234, 0.05);
+    }
+
+    /* 亮色主题模态框 */
+    body.light-theme .modal-content {
+      background: rgba(255, 255, 255, 0.95);
+      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
+    }
+
+    /* 亮色主题输入框 */
+    body.light-theme .form-input {
+      background: rgba(255, 255, 255, 0.8);
+      border-color: rgba(102, 126, 234, 0.2);
+    }
+
+    body.light-theme .form-input:focus {
+      background: rgba(255, 255, 255, 0.95);
+      border-color: var(--accent-1);
+    }
+
     /* 防止 Vue 初始化前显示原始模板 */
     [v-cloak] { display: none !important; }