feat: compact UI with theme switcher (light/dark/mono)

- Redesign download cards to be significantly more compact
- Add CSS custom properties for theming
- Add theme switcher (Light, Dark, Mono) with localStorage persistence
- Update README with environment variable Docker deployment docs
- Update Docker Compose example to use environment: instead of volume mount

public/app.js

@@ -3,15 +3,38 @@ let downloads = [];
 let refreshInterval = null;
 let currentRefreshRate = 5000; // default 5 seconds
 
+// Apply saved theme immediately (before DOMContentLoaded to avoid flash)
+(function() {
+  const saved = localStorage.getItem('sofarr-theme') || 'light';
+  document.documentElement.setAttribute('data-theme', saved);
+})();
+
 // Check authentication on load
 document.addEventListener('DOMContentLoaded', () => {
   checkAuthentication();
+  initThemeSwitcher();
   
   document.getElementById('login-form').addEventListener('submit', handleLogin);
   document.getElementById('logout-btn').addEventListener('click', handleLogout);
   document.getElementById('refresh-rate').addEventListener('change', handleRefreshRateChange);
 });
 
+function initThemeSwitcher() {
+  const saved = localStorage.getItem('sofarr-theme') || 'light';
+  document.querySelectorAll('.theme-btn').forEach(btn => {
+    btn.classList.toggle('active', btn.dataset.theme === saved);
+    btn.addEventListener('click', () => setTheme(btn.dataset.theme));
+  });
+}
+
+function setTheme(theme) {
+  document.documentElement.setAttribute('data-theme', theme);
+  localStorage.setItem('sofarr-theme', theme);
+  document.querySelectorAll('.theme-btn').forEach(btn => {
+    btn.classList.toggle('active', btn.dataset.theme === theme);
+  });
+}
+
 function startAutoRefresh() {
   if (refreshInterval) clearInterval(refreshInterval);
   if (currentRefreshRate > 0) {