2 files changed, 47 insertions, 4 deletions
diff --git a/src/app.css b/src/app.css
index 2c30b5f..4c59d90 100644
--- a/src/app.css
+++ b/src/app.css
@@ -2,11 +2,14 @@
 /* Syntax-highlight theme for fenced code blocks in rendered Markdown. */
 @import "highlight.js/styles/atom-one-dark.min.css";
 
-/* DaisyUI v5 — enable the plugin AND bundle the dracula theme (set as default,
-   applied via <html data-theme="dracula">). Themes not listed here are NOT
-   bundled, so dracula must be named explicitly, not merely referenced. */
+/* Custom monokai theme — must be imported BEFORE the @plugin block. */
+@import "./themes/monokai.css";
+
+/* DaisyUI v5 — enable the plugin AND bundle the monokai theme (set as default,
+   applied via <html data-theme="monokai">). Themes not listed here are NOT
+   bundled, so monokai must be named explicitly, not merely referenced. */
 @plugin "daisyui" {
-	themes: dracula --default;
+	themes: monokai --default;
 }
 
 /* Rendered-Markdown (assistant messages) typography — scoped to .markdown-body
diff --git a/src/themes/monokai.css b/src/themes/monokai.css
new file mode 100644
index 0000000..1597700
--- /dev/null
+++ b/src/themes/monokai.css
@@ -0,0 +1,40 @@
+/*!
+ * Author: Dachi — https://github.com/dachinat
+ * License: CC BY 4.0 — https://creativecommons.org/licenses/by/4.0/
+ * Repo: https://github.com/dachinat/daisyui-themes
+ */
+
+@plugin "daisyui/theme" {
+    name: "monokai";
+    default: false;
+    prefersdark: false;
+    color-scheme: "dark";
+    --color-base-100: #2e2e2e;
+    --color-base-200: #292825;
+    --color-base-300: #3b3a3a;
+    --color-base-content: #d6d6d6;
+    --color-primary: #6c99bb;
+    --color-primary-content: #000000;
+    --color-secondary: #9e86c8;
+    --color-secondary-content: #000000;
+    --color-accent: #b05279;
+    --color-accent-content: #000000;
+    --color-neutral: #e87d3e;
+    --color-neutral-content: #000000;
+    --color-info: #268bd2;
+    --color-info-content: oklch(29% 0.066 243.157);
+    --color-success: #b4d273;
+    --color-success-content: #000000;
+    --color-warning: #e5b567;
+    --color-warning-content: #000000;
+    --color-error: #dc322f;
+    --color-error-content: #000000;
+    --radius-selector: 0.25rem;
+    --radius-field: 0.5rem;
+    --radius-box: 0.25rem;
+    --size-selector: 0.25rem;
+    --size-field: 0.25rem;
+    --border: 1px;
+    --depth: 1;
+    --noise: 0;
+}