diff --git a/docs/superpowers/plans/2026-05-16-textarea-code-editor.md b/docs/superpowers/plans/2026-05-16-textarea-code-editor.md
index f4e7974..62a1f8f 100644
--- a/docs/superpowers/plans/2026-05-16-textarea-code-editor.md
+++ b/docs/superpowers/plans/2026-05-16-textarea-code-editor.md
@@ -277,19 +277,18 @@ Create `l4d2web/l4d2web/static/css/editor.css`:
   display: block;
   width: 100%;
   min-height: 6em;
-  padding: 0.5em 0.75em;
-  font-family: var(--font-mono, ui-monospace, "SF Mono", Menlo, monospace);
-  font-size: 0.95em;
-  line-height: 1.45;
-  color: var(--color-fg, #e6e6e6);
-  background: var(--color-bg-input, #1b1b1b);
+  padding: var(--space-s) var(--space-m);
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  color: var(--color-text, #e6e6e6);
+  background: var(--color-surface, #1b1b1b);
   border: 1px solid var(--color-border, #333);
-  border-radius: var(--radius-input, 4px);
+  border-radius: var(--radius-s, 4px);
   white-space: pre-wrap;
   word-break: break-word;
   overflow: auto;
   outline: none;
-  caret-color: var(--color-caret, #fff);
 }
 
 .editor-code:focus {
diff --git a/l4d2web/l4d2web/static/css/editor.css b/l4d2web/l4d2web/static/css/editor.css
index 6d323f1..1a44cc4 100644
--- a/l4d2web/l4d2web/static/css/editor.css
+++ b/l4d2web/l4d2web/static/css/editor.css
@@ -18,10 +18,10 @@
   display: block;
   width: 100%;
   min-height: 6em;
-  padding: 0.5em 0.75em;
-  font-family: var(--font-mono, ui-monospace, "SF Mono", Menlo, monospace);
-  font-size: 0.95em;
-  line-height: 1.45;
+  padding: var(--space-s) var(--space-m);
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 0.875rem;
+  line-height: 1.5;
   color: var(--color-text, #e6e6e6);
   background: var(--color-surface, #1b1b1b);
   border: 1px solid var(--color-border, #333);
@@ -30,7 +30,6 @@
   word-break: break-word;
   overflow: auto;
   outline: none;
-  caret-color: var(--color-caret, #fff);
 }
 
 .editor-code:focus {
diff --git a/l4d2web/l4d2web/static/css/tokens.css b/l4d2web/l4d2web/static/css/tokens.css
index 023670b..890e5ef 100644
--- a/l4d2web/l4d2web/static/css/tokens.css
+++ b/l4d2web/l4d2web/static/css/tokens.css
@@ -13,6 +13,10 @@
   --color-focus: #2563eb;
   --color-log-bg: #f8fafc;
   --color-log-text: #18181b;
+  --color-string: #0a3069;
+  --color-keyword: #cf222e;
+  --color-number: #0550ae;
+  --color-bg-popover-active: #f3f4f6;
 
   --space-base: 0.25rem;
   --space-xs: var(--space-base);
@@ -51,6 +55,10 @@
     --color-focus: #bfdbfe;
     --color-log-bg: #111827;
     --color-log-text: #e5e7eb;
+    --color-string: #a5d6ff;
+    --color-keyword: #ff7b72;
+    --color-number: #79c0ff;
+    --color-bg-popover-active: #374151;
   }
 }