feat(design): Matrix toned down to moss, text on an accent fill held to --accent-fg

The lime accent was the loudest of the four (OKLCH L 0.85, C 0.21) and read as neon; the owner chose the
moss variant at Midnight's lightness with near-neutral greys, and the Matrix backdrops follow it. Fixed
white/black parts on a solid accent fill (two switch knobs, three play buttons, the Up next pill) now use
--accent-fg, and theme.contract.test.ts refuses a fixed white or black next to a solid bg-accent.

frontend/public/backdrops/light/matrix.svg

@@ -1,13 +1,13 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 1000" preserveAspectRatio="xMidYMid slice">
   <defs>
-    <radialGradient id="a" cx="20%" cy="18%" r="55%"><stop offset="0%" stop-color="#cfe8a0" stop-opacity=".9"/><stop offset="100%" stop-color="#cfe8a0" stop-opacity="0"/></radialGradient>
-    <radialGradient id="b" cx="86%" cy="26%" r="52%"><stop offset="0%" stop-color="#a3e635" stop-opacity=".45"/><stop offset="100%" stop-color="#a3e635" stop-opacity="0"/></radialGradient>
-    <radialGradient id="c" cx="68%" cy="92%" r="60%"><stop offset="0%" stop-color="#b8dca8" stop-opacity=".85"/><stop offset="100%" stop-color="#b8dca8" stop-opacity="0"/></radialGradient>
-    <radialGradient id="d" cx="8%" cy="88%" r="55%"><stop offset="0%" stop-color="#96d69c" stop-opacity=".8"/><stop offset="100%" stop-color="#96d69c" stop-opacity="0"/></radialGradient>
+    <radialGradient id="a" cx="20%" cy="18%" r="55%"><stop offset="0%" stop-color="#d9e2c4" stop-opacity=".9"/><stop offset="100%" stop-color="#d9e2c4" stop-opacity="0"/></radialGradient>
+    <radialGradient id="b" cx="86%" cy="26%" r="52%"><stop offset="0%" stop-color="#86a05a" stop-opacity=".35"/><stop offset="100%" stop-color="#86a05a" stop-opacity="0"/></radialGradient>
+    <radialGradient id="c" cx="68%" cy="92%" r="60%"><stop offset="0%" stop-color="#cdd6bf" stop-opacity=".85"/><stop offset="100%" stop-color="#cdd6bf" stop-opacity="0"/></radialGradient>
+    <radialGradient id="d" cx="8%" cy="88%" r="55%"><stop offset="0%" stop-color="#c3cfb3" stop-opacity=".8"/><stop offset="100%" stop-color="#c3cfb3" stop-opacity="0"/></radialGradient>
     <filter id="s"><feGaussianBlur stdDeviation="60"/></filter>
     <filter id="g"><feTurbulence type="fractalNoise" baseFrequency="0.85" numOctaves="2" stitchTiles="stitch"/><feColorMatrix type="saturate" values="0"/></filter>
   </defs>
-  <rect width="1600" height="1000" fill="#eaf5ec"/>
+  <rect width="1600" height="1000" fill="#eef0e8"/>
   <g filter="url(#s)">
     <rect width="1600" height="1000" fill="url(#a)"/>
     <rect width="1600" height="1000" fill="url(#c)"/>

frontend/public/backdrops/matrix.svg

@@ -1,13 +1,13 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 1000" preserveAspectRatio="xMidYMid slice">
   <defs>
-    <radialGradient id="a" cx="20%" cy="18%" r="55%"><stop offset="0%" stop-color="#3a5a0f" stop-opacity=".95"/><stop offset="100%" stop-color="#3a5a0f" stop-opacity="0"/></radialGradient>
-    <radialGradient id="b" cx="86%" cy="26%" r="52%"><stop offset="0%" stop-color="#a3e635" stop-opacity=".45"/><stop offset="100%" stop-color="#a3e635" stop-opacity="0"/></radialGradient>
-    <radialGradient id="c" cx="68%" cy="92%" r="60%"><stop offset="0%" stop-color="#1a3a14" stop-opacity=".9"/><stop offset="100%" stop-color="#1a3a14" stop-opacity="0"/></radialGradient>
-    <radialGradient id="d" cx="8%" cy="88%" r="55%"><stop offset="0%" stop-color="#164a26" stop-opacity=".85"/><stop offset="100%" stop-color="#164a26" stop-opacity="0"/></radialGradient>
+    <radialGradient id="a" cx="20%" cy="18%" r="55%"><stop offset="0%" stop-color="#34431f" stop-opacity=".95"/><stop offset="100%" stop-color="#34431f" stop-opacity="0"/></radialGradient>
+    <radialGradient id="b" cx="86%" cy="26%" r="52%"><stop offset="0%" stop-color="#86a05a" stop-opacity=".35"/><stop offset="100%" stop-color="#86a05a" stop-opacity="0"/></radialGradient>
+    <radialGradient id="c" cx="68%" cy="92%" r="60%"><stop offset="0%" stop-color="#1d2a18" stop-opacity=".9"/><stop offset="100%" stop-color="#1d2a18" stop-opacity="0"/></radialGradient>
+    <radialGradient id="d" cx="8%" cy="88%" r="55%"><stop offset="0%" stop-color="#22301c" stop-opacity=".85"/><stop offset="100%" stop-color="#22301c" stop-opacity="0"/></radialGradient>
     <filter id="s"><feGaussianBlur stdDeviation="60"/></filter>
     <filter id="g"><feTurbulence type="fractalNoise" baseFrequency="0.85" numOctaves="2" stitchTiles="stitch"/><feColorMatrix type="saturate" values="0"/></filter>
   </defs>
-  <rect width="1600" height="1000" fill="#020805"/>
+  <rect width="1600" height="1000" fill="#0a0c09"/>
   <g filter="url(#s)">
     <rect width="1600" height="1000" fill="url(#a)"/>
     <rect width="1600" height="1000" fill="url(#c)"/>