Add light/dark theme toggle, fix dark theme text contrast

Theme state persists via localStorage, applied pre-paint by theme-init.js
to avoid flash. All JS moved to external files (app.js, theme-init.js)
to keep script-src 'self' CSP intact, no inline scripts.

Dark theme footer/notice/tagline colors were too close to the background
(footer nearly matched the card border color) and hard to read; brightened
to readable grays while leaving the light theme and submit button untouched.

1 files changed, 30 insertions, 0 deletions

diff --git a/static/app.js b/static/app.js
new file mode 100644
index 0000000..1168281
--- /dev/null
+++ b/static/app.js
@@ -0,0 +1,30 @@
+document.getElementById('file').addEventListener('change', function() {
+    const name = this.files.length ? this.files[0].name : '';
+    document.getElementById('filename').textContent = name;
+});
+
+(function() {
+    var toggleBtn = document.getElementById('theme-toggle');
+
+    function isLight() {
+        return document.documentElement.getAttribute('data-theme') === 'light';
+    }
+
+    function updateIcon() {
+        // Shows the icon for the theme you'd switch TO.
+        toggleBtn.textContent = isLight() ? '\u{1F319}' : '☀️';
+    }
+
+    toggleBtn.addEventListener('click', function() {
+        if (isLight()) {
+            document.documentElement.removeAttribute('data-theme');
+            localStorage.setItem('nymdrop-theme', 'dark');
+        } else {
+            document.documentElement.setAttribute('data-theme', 'light');
+            localStorage.setItem('nymdrop-theme', 'light');
+        }
+        updateIcon();
+    });
+
+    updateIcon();
+})();