ui: light theme default + dark/light toggle

- Light theme: clean white (#fff) base, soft gray surfaces, professional feel
- Dark theme: deep navy (#0f1117), elevated layers, subtle shadows
- Theme toggle button (moon/sun icons) in header, persists via localStorage
- Auto-detects system prefers-color-scheme on first visit
- CSS variables for all colors, both themes defined in same file
- Improved contrast ratios for both modes (WCAG AA)

sidepanel/sidepanel.js

@@ -310,10 +310,36 @@ chrome.runtime.onMessage.addListener((message) => {
   }
 });
 
+// ============================================================
+// Theme Toggle
+// ============================================================
+
+const btnTheme = document.getElementById('btn-theme');
+
+function setTheme(theme) {
+  document.documentElement.setAttribute('data-theme', theme);
+  localStorage.setItem('multipage-theme', theme);
+}
+
+function initTheme() {
+  const saved = localStorage.getItem('multipage-theme');
+  if (saved) {
+    setTheme(saved);
+  } else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+    setTheme('dark');
+  }
+}
+
+btnTheme.addEventListener('click', () => {
+  const current = document.documentElement.getAttribute('data-theme');
+  setTheme(current === 'dark' ? 'light' : 'dark');
+});
+
 // ============================================================
 // Init
 // ============================================================
 
+initTheme();
 restoreState().then(() => {
   updateButtonStates();
 });