fix: fix light/dark/system theme switcher

- Add darkMode: class to tailwind config for class-based dark mode
- Load saved theme from localStorage on mount and apply immediately
- Add media query listener for system theme changes in system mode

frontend/src/App.tsx

@@ -24,11 +24,41 @@ function App() {
   const [theme, setTheme] = useState<'light' | 'dark' | 'system'>('system')
   const [content, setContent] = useState('')
 
+  // Load theme from localStorage on mount and apply it
+  useEffect(() => {
+    const savedTheme = localStorage.getItem('theme')
+    if (savedTheme && ['light', 'dark', 'system'].includes(savedTheme)) {
+      setTheme(savedTheme as 'light' | 'dark' | 'system')
+      // Apply immediately so we don't show the default state first
+      applyTheme(savedTheme as 'light' | 'dark' | 'system')
+    }
+  }, [])
+
+  // Load files on mount
   useEffect(() => {
     loadFiles()
+  }, [])
+
+  // Apply theme when it changes
+  useEffect(() => {
     applyTheme(theme)
   }, [theme])
 
+  // Listen for system theme changes when in system mode
+  useEffect(() => {
+    if (theme !== 'system') return
+
+    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
+    const handleSystemThemeChange = () => {
+      applyTheme('system')
+    }
+
+    mediaQuery.addEventListener('change', handleSystemThemeChange)
+    return () => {
+      mediaQuery.removeEventListener('change', handleSystemThemeChange)
+    }
+  }, [theme])
+
   useEffect(() => {
     if (currentFile) {
       setContent(currentFile.content)