From edd4681d4244f6c325bb5976a59587adbcbc0080 Mon Sep 17 00:00:00 2001 From: andrewleesteele <8799863+andrewleesteele@users.noreply.github.com> Date: Wed, 5 Aug 2026 15:59:54 +0000 Subject: [PATCH 1/3] Style inline code as monospace chips The global Inter font family was applying to bare inline spans, rendering variables in a proportional font with no visual treatment so they read as malformed prose. Force a monospace stack, subtle background, and normal spacing on inline code (code blocks inside
 unaffected).

Co-Authored-By: Claude Opus 4.8 
---
 style.css | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/style.css b/style.css
index 367a499..abbeccd 100644
--- a/style.css
+++ b/style.css
@@ -16,6 +16,27 @@ kbd {
   text-transform: none !important;
 }
 
+/* inline code — the global Inter font family bleeds onto bare  spans, so
+   variables like `payload` render in a proportional font with no chip and read
+   as malformed prose rather than code. force a monospace stack and a subtle
+   background so inline code looks like code. code blocks live inside 
 and
+   keep their own styling. */
+:not(pre) > code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    "Liberation Mono", "Courier New", monospace !important;
+  font-size: 0.875em !important;
+  padding: 0.1em 0.35em !important;
+  background-color: rgba(33, 34, 37, 0.06) !important;
+  border: 1px solid rgba(33, 34, 37, 0.1) !important;
+  letter-spacing: normal !important;
+  font-weight: 400 !important;
+}
+
+html.dark :not(pre) > code {
+  background-color: rgba(237, 238, 240, 0.06) !important;
+  border-color: rgba(237, 238, 240, 0.12) !important;
+}
+
 /* remove all rounded corners site-wide */
 *,
 *::before,

From 9e8d60532fb07b7e5eacb599425e8217345ee427 Mon Sep 17 00:00:00 2001
From: andrewleesteele <8799863+andrewleesteele@users.noreply.github.com>
Date: Wed, 5 Aug 2026 16:05:54 +0000
Subject: [PATCH 2/3] Tint inline code with kernel green

Grey chip read as sterile. Use kernel green (#81b300) as a low-alpha
fill with a green border, keeping the existing charcoal/light text per
the brand rule (green as fill, never green body text).

Co-Authored-By: Claude Opus 4.8 
---
 style.css | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/style.css b/style.css
index abbeccd..15c3773 100644
--- a/style.css
+++ b/style.css
@@ -20,21 +20,23 @@ kbd {
    variables like `payload` render in a proportional font with no chip and read
    as malformed prose rather than code. force a monospace stack and a subtle
    background so inline code looks like code. code blocks live inside 
 and
-   keep their own styling. */
+   keep their own styling. tinted with kernel green (#81b300) as a fill so it
+   reads as brand, not sterile grey — green is used as the chip fill with the
+   existing charcoal text, per the brand rule (never green body text). */
 :not(pre) > code {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
     "Liberation Mono", "Courier New", monospace !important;
   font-size: 0.875em !important;
   padding: 0.1em 0.35em !important;
-  background-color: rgba(33, 34, 37, 0.06) !important;
-  border: 1px solid rgba(33, 34, 37, 0.1) !important;
+  background-color: rgba(129, 179, 0, 0.12) !important;
+  border: 1px solid rgba(129, 179, 0, 0.35) !important;
   letter-spacing: normal !important;
   font-weight: 400 !important;
 }
 
 html.dark :not(pre) > code {
-  background-color: rgba(237, 238, 240, 0.06) !important;
-  border-color: rgba(237, 238, 240, 0.12) !important;
+  background-color: rgba(129, 179, 0, 0.16) !important;
+  border-color: rgba(129, 179, 0, 0.4) !important;
 }
 
 /* remove all rounded corners site-wide */

From 32e25d3ff1df27f309f103d0ccff8db1b5ff0842 Mon Sep 17 00:00:00 2001
From: andrewleesteele <8799863+andrewleesteele@users.noreply.github.com>
Date: Wed, 5 Aug 2026 22:48:45 +0000
Subject: [PATCH 3/3] Tint inline code with light gold instead of green

Switch the inline-code chip fill from kernel green to a light gold
(#cab168, the docs accent), keeping charcoal/off-white text.

Co-Authored-By: Claude Opus 4.8 
---
 style.css | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/style.css b/style.css
index 15c3773..5580b8c 100644
--- a/style.css
+++ b/style.css
@@ -20,23 +20,22 @@ kbd {
    variables like `payload` render in a proportional font with no chip and read
    as malformed prose rather than code. force a monospace stack and a subtle
    background so inline code looks like code. code blocks live inside 
 and
-   keep their own styling. tinted with kernel green (#81b300) as a fill so it
-   reads as brand, not sterile grey — green is used as the chip fill with the
-   existing charcoal text, per the brand rule (never green body text). */
+   keep their own styling. tinted with a light gold (#cab168, the docs accent)
+   fill so it reads as brand, not sterile grey, with the existing charcoal text. */
 :not(pre) > code {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
     "Liberation Mono", "Courier New", monospace !important;
   font-size: 0.875em !important;
   padding: 0.1em 0.35em !important;
-  background-color: rgba(129, 179, 0, 0.12) !important;
-  border: 1px solid rgba(129, 179, 0, 0.35) !important;
+  background-color: rgba(202, 177, 104, 0.14) !important;
+  border: 1px solid rgba(202, 177, 104, 0.4) !important;
   letter-spacing: normal !important;
   font-weight: 400 !important;
 }
 
 html.dark :not(pre) > code {
-  background-color: rgba(129, 179, 0, 0.16) !important;
-  border-color: rgba(129, 179, 0, 0.4) !important;
+  background-color: rgba(202, 177, 104, 0.18) !important;
+  border-color: rgba(202, 177, 104, 0.45) !important;
 }
 
 /* remove all rounded corners site-wide */