From 6747faeb7a36caa2a66bfc74f15a5728164902e3 Mon Sep 17 00:00:00 2001
From: Joseph Montanaro <jfmonty2@gmail.com>
Date: Sat, 7 Mar 2026 09:18:19 -0500
Subject: [PATCH] claude dark v4, blue/gold

---
 src/layouts/BaseLayout.astro |  2 +-
 src/styles/main.css          |  1 +
 src/styles/prose.css         |  2 +-
 src/styles/vars.css          | 19 +++++++++++++++++--
 4 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 15a36e4..edc9671 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -25,7 +25,7 @@ import '@styles/main.css';
             text-align: center;
 
             &:hover {
-                background: hsl(0deg 0% 0% / 10%);
+                background: var(--nav-hover);
             }
         }
     }
diff --git a/src/styles/main.css b/src/styles/main.css
index b2b2ea2..9115b40 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -9,4 +9,5 @@ body {
     font-size: var(--content-size);
     line-height: var(--content-line-height);
     color: var(--content-color);
+    background-color: var(--bg-color);
 }
diff --git a/src/styles/prose.css b/src/styles/prose.css
index 605012b..6b5ddc7 100644
--- a/src/styles/prose.css
+++ b/src/styles/prose.css
@@ -5,7 +5,7 @@
         font-family: 'Baskervville Variable', serif;
         font-weight: 650;
         margin-bottom: 0.25rem;
-        color: hsl(0 0% 27%);
+        color: var(--heading-color);
         letter-spacing: 0.015em;
     }
 
diff --git a/src/styles/vars.css b/src/styles/vars.css
index 316372c..0faaead 100644
--- a/src/styles/vars.css
+++ b/src/styles/vars.css
@@ -4,16 +4,31 @@
     --content-line-height: 1.5;
     --content-width: 52.5rem;
     --content-padding: 0.65rem;
+    --bg-color: hsl(0deg 0% 100%);
     --content-color: hsl(0deg 0% 20%);
     --content-color-faded: #555;
+    --heading-color: hsl(0deg 0% 27%);
     --primary-color: hsl(202deg 72% 28%);
     --primary-color-faded: hsl(202deg 14% 36%);
-    --accent-color: hsl(0deg, 92%, 29%);
-    --accent-color-faded: hsl(0deg, 25%, 55%);
+    --accent-color: hsl(0deg 92% 29%);
+    --accent-color-faded: hsl(0deg 25% 55%);
+    --nav-hover: hsl(0deg 0% 0% / 10%);
 
     @media(max-width: 640px) {
         --content-line-height: 1.25;
         --content-size: 1.15rem;
         --content-size-sm: 0.9rem;
     }
+
+    @media(prefers-color-scheme: dark) {
+        --bg-color: hsl(220deg 18% 11%);
+        --content-color: hsl(215deg 10% 78%);
+        --content-color-faded: hsl(215deg 6% 55%);
+        --heading-color: hsl(210deg 15% 90%);
+        --primary-color: hsl(215deg 60% 50%);
+        --primary-color-faded: hsl(220deg 30% 22%);
+        --accent-color: hsl(45deg 85% 55%);
+        --accent-color-faded: hsl(45deg 35% 50%);
+        --nav-hover: hsl(210deg 30% 100% / 12%);
+    }
 }