Dark mode: portal (tokens/toggle) + dsh chat (vars + toggle)

portal/templates/base.html

@@ -25,6 +25,7 @@
         <span>{{ user.full_name }}</span>
       </div>
       <a href="/account/password" class="button-utility" title="Change password">Password</a>
+      <button type="button" id="themeToggle" class="button-utility" title="Toggle dark mode" aria-label="Toggle dark mode">🌙</button>
       <a href="/logout" class="button-utility">Sign out</a>
     </div>
   </nav>
@@ -32,5 +33,25 @@
   <main>
   {% block content %}{% endblock %}
   </main>
+  <script>
+    (function () {
+      var root = document.documentElement;
+      var saved = null;
+      try { saved = localStorage.getItem('fhlTheme'); } catch (_) {}
+      var dark = saved === 'dark' || (!saved && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
+      if (dark) root.setAttribute('data-theme', 'dark');
+      function sync() {
+        var b = document.getElementById('themeToggle');
+        if (b) b.textContent = root.getAttribute('data-theme') === 'dark' ? '☀️' : '🌙';
+      }
+      var t = document.getElementById('themeToggle');
+      if (t) t.addEventListener('click', function () {
+        if (root.getAttribute('data-theme') === 'dark') { root.removeAttribute('data-theme'); try { localStorage.setItem('fhlTheme','light'); } catch(_){} }
+        else { root.setAttribute('data-theme','dark'); try { localStorage.setItem('fhlTheme','dark'); } catch(_){} }
+        sync();
+      });
+      sync();
+    })();
+  </script>
 </body>
 </html>