优化黑暗模式和白天模式

public/index.html

@@ -437,13 +437,18 @@
                 <label for="logoUrlInput">Logo URL (图片链接，为空则显示默认图标)</label>
                 <input type="url" id="logoUrlInput" placeholder="https://example.com/logo.png">
               </div>
-              <div class="form-group" style="margin-top: 15px;">
-                <label for="defaultThemeInput">默认主题</label>
-                <select id="defaultThemeInput"
-                  style="padding: 10px 14px; background: var(--bg-input); border: 1px solid var(--border-color); border-radius: var(--radius-sm); color: var(--text-primary);">
-                  <option value="dark">默认夜间模式</option>
-                  <option value="light">默认白天模式</option>
-                </select>
+              <div class="settings-section" style="margin-top: 25px; border-top: 1px solid var(--border-color); padding-top: 20px;">
+                <h4 style="font-size: 0.85rem; color: var(--accent-indigo); margin-bottom: 15px; text-transform: uppercase; letter-spacing: 0.5px;">界面外观 (Appearance)</h4>
+                <div class="form-group">
+                  <label for="defaultThemeInput">色彩主题模式</label>
+                  <select id="defaultThemeInput"
+                    style="padding: 10px 14px; background: var(--bg-input); border: 1px solid var(--border-color); border-radius: var(--radius-sm); color: var(--text-primary); width: 100%;">
+                    <option value="auto">跟随系统主题 (Sync with OS)</option>
+                    <option value="dark">强制深色模式 (Always Dark)</option>
+                    <option value="light">强制浅色模式 (Always Light)</option>
+                  </select>
+                  <p style="font-size: 0.72rem; color: var(--text-muted); margin-top: 6px;">选择“跟随系统”后，应用将自动同步您操作系统或浏览器的黑暗/白天模式设置。</p>
+                </div>
               </div>
               <div class="form-group" style="margin-top: 15px;">
                 <label for="show95BandwidthInput">24h趋势图默认显示 95计费线</label>