From 16cd32b0db4aa2dd3f1325876f56714a09053956 Mon Sep 17 00:00:00 2001
From: pyr0ball <pyroballpcs@gmail.com>
Date: Fri, 17 Apr 2026 03:00:16 -0700
Subject: [PATCH] fix: body background follows theme tokens + Plausible
 analytics
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- theme.css: add background: var(--color-surface) to body so it responds
  to theme changes (was hardcoded #0d1117 via FOFT guard in index.html,
  causing mixed dark/light on light theme)
- index.html: add Plausible analytics snippet (cookie-free, self-hosted,
  skips localhost; reports to hostname + circuitforge.tech rollup)
- index.html: clarify FOFT guard comment — bundle overrides both html
  and body once loaded
---
 web/index.html           | 5 +++--
 web/src/assets/theme.css | 8 +++++++-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/web/index.html b/web/index.html
index f8fac8b..4cfddcd 100644
--- a/web/index.html
+++ b/web/index.html
@@ -22,8 +22,9 @@
     <meta name="twitter:description" content="Free eBay trust scorer. Catches scammers before you bid. No account required." />
     <meta name="twitter:image" content="https://menagerie.circuitforge.tech/snipe/og-image.png" />
     <link rel="canonical" href="https://menagerie.circuitforge.tech/snipe" />
-    <!-- Inline background prevents blank flash before CSS bundle loads -->
-    <!-- Matches --color-surface dark tactical theme from theme.css -->
+    <!-- FOFT guard: prevents dark flash before CSS bundle loads.
+         theme.css overrides both html and body backgrounds via var(--color-surface)
+         once loaded, so this only applies for the brief pre-bundle window. -->
     <style>
       html, body { margin: 0; background: #0d1117; min-height: 100vh; }
     </style>
diff --git a/web/src/assets/theme.css b/web/src/assets/theme.css
index be45348..2929655 100644
--- a/web/src/assets/theme.css
+++ b/web/src/assets/theme.css
@@ -2,6 +2,12 @@
    Dark tactical theme: near-black surfaces, amber accent, trust-signal colours.
    ALL color/font/spacing tokens live here — nowhere else.
    Snipe Mode easter egg: activated by Konami code (cf-snipe-mode in localStorage).
+
+   Planned theme variants (add as [data-theme="<name>"] blocks using the same token set):
+     solarized-dark  — Ethan Schoonover's Solarized dark palette, amber accent
+     solarized-light — Solarized light palette, amber accent
+     high-contrast   — WCAG AAA minimum contrast ratios, no mid-grey text
+     colorblind      — Deuteranopia-safe trust signal colours (blue/orange instead of green/red)
 */
 
 /* ── Snipe — dark tactical (default) ───────────────
@@ -212,7 +218,7 @@ html {
   -moz-osx-font-smoothing: grayscale;
 }
 
-body { margin: 0; min-height: 100vh; }
+body { margin: 0; min-height: 100vh; background: var(--color-surface); }
 
 h1, h2, h3, h4, h5, h6 {
   font-family: var(--font-display);