diff --git a/docs/04-theming-and-users.md b/docs/04-theming-and-users.md
index 2c2ea28..78ced66 100644
--- a/docs/04-theming-and-users.md
+++ b/docs/04-theming-and-users.md
@@ -293,6 +293,87 @@ logo override, Quick Connect hide, Settings drawer hide, LoginDisclaimer,
 SplashscreenEnabled). POST returned 204; same operational rule from §3b
 applies — this was the last branding POST in the sequence.
 
+### 3d. Slider thumb white + pure-black background (2026-05-08)
+
+Two small visual nits remained after §3c. (1) The OSD scrubber and volume
+slider thumbs in the video player were rendered with the Material-UI
+default primary tint (blue-ish circle), clashing against the otherwise
+red/white/black Cineplex palette; we want pure white circles so the thumb
+reads as a neutral "where am I" indicator and not a brand colour.
+(2) The page surface throughout the SPA was a near-black grey
+(roughly `#181818`, inherited from Jellyfin / Cineplex defaults) rather
+than true `#000000`; on OLED displays and against the Netflix-style
+artwork-edge fades this looked dusty. Both fixed with pure CSS appended
+to `CustomCss`, no `index.html` edit, no container restart.
+
+**Selectors verified against the live bundle.** `osdPositionSlider` and
+`osdVolumeSlider` are visible in `playback-video-index-html.*.chunk.js`
+and `90742.*.chunk.js` (grep on `/jellyfin/jellyfin-web/*.js`). The
+inner `.MuiSlider-thumb` class is added at runtime by MUI's React
+component, so it doesn't appear as a literal in the bundle but is the
+documented MUI public API surface — overriding it directly (rather than
+the `--mui-palette-primary-main` CSS variable) keeps the rest of the
+button/control palette unchanged. Older Jellyfin builds used
+`emby-slider .sliderThumb`, included as a belt-and-braces fallback.
+
+```css
+/* Tweak: white thumbs (2026-05-08) */
+.MuiSlider-thumb,
+.osdPositionSlider .MuiSlider-thumb,
+.osdVolumeSlider .MuiSlider-thumb,
+emby-slider .sliderThumb {
+  color: #ffffff !important;
+  background-color: #ffffff !important;
+  border-color: #ffffff !important;
+}
+.MuiSlider-thumb:hover,
+.MuiSlider-thumb.Mui-focusVisible,
+.MuiSlider-thumb:active {
+  box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.16) !important;
+}
+
+/* Tweak: pure black bg (2026-05-08) */
+:root {
+  --primary-background-color: #000000 !important;
+  --background-color: #000000 !important;
+}
+html, body, .preload, .skinBody, .mainDrawerHandle {
+  background-color: #000000 !important;
+}
+.skinHeader,
+.skinHeader.semiTransparent,
+.skinHeader.skinHeader-withBackground,
+.mainAnimatedPages,
+#reactRoot,
+.dashboardDocument {
+  background-color: #000000 !important;
+}
+```
+
+Rationale notes:
+- We deliberately did **not** override `--mui-palette-primary-main` at
+  `:root` — that variable re-tints buttons, focus rings, and a handful
+  of other accents globally. Scoping to `.MuiSlider-thumb` keeps the
+  fix surgical.
+- We kept the red track (`.MuiSlider-track`) and grey rail
+  (`.MuiSlider-rail`) untouched; only the draggable thumb changed.
+- For the background, both the Jellyfin shell variables
+  (`--primary-background-color`, `--background-color`) and the concrete
+  wrapper elements (`html`, `body`, `.skinHeader`, `.mainAnimatedPages`,
+  `#reactRoot`, `.dashboardDocument`) are forced to `#000`. Belt and
+  braces — different views render through different wrappers and the
+  Cineplex import sometimes redeclares the variables.
+- Screenshots: capture player chrome (scrubber + volume) and home/lib
+  pages on next visual sweep; if poster cards visibly lose contrast
+  against pure black, soften the card surface to `#0a0a0a` in a
+  follow-up tweak rather than raising the page surface again.
+
+POST returned 204. Verified via `GET /Branding/Configuration`: both
+new blocks present, all prior blocks (Cineplex `@import`, cast/crew
+hide, ARRFLIX logo override, Quick Connect hide, Settings drawer hide,
+header icon hide) preserved verbatim. Same race rule applies — this is
+the last branding POST in the sequence.
+
 ---
 
 ## 4. Multi-user UX prep