[SCARPxVeNOM]

Summary

The docs site is dark-only because appearance.strict: true removes Mintlify's built-in light/dark toggle. This enables the toggle and adjusts the light-mode accent colour so that light mode is actually readable.

Closes #667

The change

   "appearance": {
     "default": "dark",
-    "strict": true
+    "strict": false
   },
   "colors": {
-    "primary": "#F0DB4F",
+    "primary": "#8A7500",
     "light": "#F0DB4F",
     "dark": "#C9B83C"
   },

Two lines in docs/docs.json. No new dependencies, no CSS, no JS.

Why the colour change is part of this

Flipping strict on its own ships a broken light mode.

In Mintlify, colors.primary is the emphasis colour used in light mode, while colors.light is the one used in dark mode — easy to read backwards. Both were set to #F0DB4F (JS yellow). Yellow on a white background measures 1.40:1, against the WCAG AA minimum of 4.5:1 for body text. It went unnoticed because light mode was unreachable.

Measured in the browser on / at 14px:

Element	Before	After	AA (4.5:1)
Active sidebar item ("Welcome")	1.40:1	4.54:1	pass
Section eyebrow ("Getting Started")	1.40:1	17.41:1	pass
Active TOC item ("Who Is This For?")	1.40:1	17.75:1	pass

#8A7500 is close to the lightest value that holds the JS-yellow hue while clearing 4.5:1 on white, so the brand colour is kept as far as the contrast requirement allows.

Dark mode is untouched. colors.light still carries #F0DB4F, measured at 14.95:1 on black both before and after. appearance.default stays "dark", so existing visitors see exactly what they see today — the toggle is simply now available to those who want it.

I checked that colors.primary is not used as a button background anywhere before darkening it; it appears as text colour, 1.5px active-indicator bars, and icon fills only.

Screenshots

1. Light mode with the existing palette — accent text at 1.40:1, fails WCAG AA

2. Light mode with colors.primary set to #8A7500 — 4.54:1, passes AA

3. Dark mode — unchanged

Both light-mode shots already include the toggle, since strict: false was applied for all of them. They show why the colour adjustment is needed, not the state of the live site — on https://33jsconcepts.com today, light mode cannot be reached at all.

How to verify

npm run docs
# open the local preview, then use the toggle in the top-left

Contrast ratios were measured in the page via getComputedStyle, with colours resolved through a canvas (the theme emits some oklch() values that a naive rgb() parse gets wrong). A sweep of all 114 visible text nodes returns zero failures in both modes, other than the item below.

Out of scope

Mintlify's own "Powered by Mintlify" footer measures 2.56:1 in light mode and 4.42:1 in dark. That is vendor chrome rather than anything docs.json controls, so I have left it alone.

Open question

I kept appearance.default as "dark" to avoid changing the default experience. Mintlify's own default is "system", which follows each visitor's OS preference. Happy to switch it in this PR if you would prefer that — it seemed like your call rather than mine.