diff --git a/static/css/04-interactive/_chat.css b/static/css/04-interactive/_chat.css
index c0a8df1..1189206 100644
--- a/static/css/04-interactive/_chat.css
+++ b/static/css/04-interactive/_chat.css
@@ -701,6 +701,83 @@
     color: var(--text-light, #999999);
 }
 
+/* ==========================================================================
+   Dark Mode — lighter panel to distinguish from CV background
+   ========================================================================== */
+
+[data-color-theme="dark"] .chat-panel {
+    background: #2c2c2c;
+    border-color: #444;
+}
+
+[data-color-theme="dark"] .chat-row-bot .chat-msg {
+    background: #383838;
+    color: #e0e0e0;
+}
+
+[data-color-theme="dark"] .chat-input {
+    background: #333;
+    border-color: #555;
+    color: #e0e0e0;
+}
+
+[data-color-theme="dark"] .chat-input-area {
+    background: #2c2c2c;
+    border-top-color: #444;
+}
+
+[data-color-theme="dark"] .chat-suggestions {
+    border-top-color: #444;
+}
+
+[data-color-theme="dark"] .chat-chip {
+    border-color: #555;
+    color: #bbb;
+}
+
+[data-color-theme="dark"] .chat-nav-link {
+    color: #4eca81;
+    border-bottom-color: #4eca81;
+}
+
+/* Auto dark (system preference) */
+@media (prefers-color-scheme: dark) {
+    [data-color-theme="auto"] .chat-panel {
+        background: #2c2c2c;
+        border-color: #444;
+    }
+
+    [data-color-theme="auto"] .chat-row-bot .chat-msg {
+        background: #383838;
+        color: #e0e0e0;
+    }
+
+    [data-color-theme="auto"] .chat-input {
+        background: #333;
+        border-color: #555;
+        color: #e0e0e0;
+    }
+
+    [data-color-theme="auto"] .chat-input-area {
+        background: #2c2c2c;
+        border-top-color: #444;
+    }
+
+    [data-color-theme="auto"] .chat-suggestions {
+        border-top-color: #444;
+    }
+
+    [data-color-theme="auto"] .chat-chip {
+        border-color: #555;
+        color: #bbb;
+    }
+
+    [data-color-theme="auto"] .chat-nav-link {
+        color: #4eca81;
+        border-bottom-color: #4eca81;
+    }
+}
+
 /* ==========================================================================
    Responsive
    ========================================================================== */