diff --git a/CLAUDE.md b/CLAUDE.md
index 46793ab7..a940d73c 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -115,12 +115,29 @@ release.
 | `npm run check` | Verify generated artifacts (class hints, variables hints, vendored admin-app core) aren't stale — exits non-zero on drift, never writes. Needs the framework source (sibling checkout, `.framework`, or `SLASHED_FRAMEWORK_DIR`); CI clones it at the pinned `SLASHED_CSS_REF` and runs this as the per-PR drift gate |
 | `composer phpunit` | Run the PHP unit suite (`tests-php/`) |
 
-`tests/` is `node --test` specs, run automatically by `npm test`, with one
-exception: `tests/playwright-admin.js` is a manual, local-only dev/QA tool —
-it walks the admin SPA and saves screenshots for a human to review, has no
-pass/fail assertions, and isn't wired into `npm test` or CI (no committed
-HTML fixture, needs a locally-running dev server). Run it directly with
-`node tests/playwright-admin.js`; see the file header for prerequisites.
+`tests/` is `node --test` specs, run automatically by `npm test`, with two
+exceptions — both manual, local-only dev/QA tools that need a Playwright
+browser (not an npm dependency of this repo) and so are wired into neither
+`npm test` nor CI. See each file's header for prerequisites.
+
+- `tests/playwright-admin.js` — walks the admin SPA and saves screenshots for
+  a human to review. No pass/fail assertions (also needs a locally-running dev
+  server serving an uncommitted `test-admin.html`). Run:
+  `node tests/playwright-admin.js`.
+- `tests/override-effect-probe.mjs` — answers "which configurator controls
+  actually change anything on the page?". For each control group it asks the
+  real PHP emitter (`tests/php-harness/emit-override-css.php`) for the CSS a
+  site would serve, then diffs every live `--sf-*` token in a headless browser
+  against the un-overridden page, for both the layered and the flat bundle. A
+  control group that changes nothing prints `DEAD` and the run exits non-zero.
+  Reach for this first whenever a configurator control appears to do nothing in
+  WordPress but works on the standalone configurator. Run:
+  `node tests/override-effect-probe.mjs`.
+
+When that probe says every control group is `OK` but a control still does nothing
+on a real site, the conflict is in that page's CSS environment: paste
+`scripts/diagnose-page-tokens.js` into the browser console there and read the
+result with `docs/troubleshooting-token-overrides.md`.
 
 `tests-php/` is a plain PHPUnit suite (`composer phpunit`, wired into CI's
 `quality` job) covering pure/near-pure PHP logic that needs no WordPress
diff --git a/SLASHED-for-WP/includes/class-css-generator.php b/SLASHED-for-WP/includes/class-css-generator.php
index 78cc9b78..6f90a77e 100644
--- a/SLASHED-for-WP/includes/class-css-generator.php
+++ b/SLASHED-for-WP/includes/class-css-generator.php
@@ -7,6 +7,10 @@
  * @layer slashed.overrides { :root { ... } } containing only validated,
  * non-empty values. Framework defaults are untouched when no override is set.
  *
+ * The wrapper follows the bundle actually served: the flat bundles carry no
+ * @layer at all, so against those the overrides must be emitted unlayered —
+ * see get_override_css().
+ *
  * @package SLASHED
  */
 
@@ -61,11 +65,21 @@ public static function get_override_css() {
 			return self::$cache;
 		}
 
-		$css = "@layer slashed.overrides {\n\t:root {\n";
+		if ( self::use_cascade_layer() ) {
+			$open   = "@layer slashed.overrides {\n\t:root {\n";
+			$indent = "\t\t";
+			$close  = "\t}\n}";
+		} else {
+			$open   = ":root {\n";
+			$indent = "\t";
+			$close  = '}';
+		}
+
+		$css = $open;
 		foreach ( $declarations as $declaration ) {
-			$css .= "\t\t" . $declaration . "\n";
+			$css .= $indent . $declaration . "\n";
 		}
-		$css .= "\t}\n}";
+		$css .= $close;
 
 		/** @filter slashed/override_css The generated token override CSS string. */
 		self::$cache = apply_filters( 'slashed/override_css', $css );
@@ -73,6 +87,35 @@ public static function get_override_css() {
 		return self::$cache;
 	}
 
+	/**
+	 * Whether the override block should be wrapped in @layer slashed.overrides.
+	 *
+	 * The framework's layered bundles declare every token inside
+	 * @layer slashed.tokens and reserve slashed.overrides as the last layer, so
+	 * wrapping is what lets these declarations win — and keeps them from also
+	 * beating the framework's @media-scoped rules (prefers-reduced-motion
+	 * clamps, colour-scheme defaults), which an unlayered block would.
+	 *
+	 * The flat bundles are the same rules with every @layer stripped. Against
+	 * those, an unlayered framework declaration beats ANY layered one no matter
+	 * the source order, so a wrapped block is silently inert: every token
+	 * override — colours, spacing, the modular scales — stops reaching the page.
+	 * Emit unlayered in that case, matching the bundle Slashed_CSS_Loader
+	 * actually serves.
+	 *
+	 * Slashed_CSS_Loader is absent when an integration plugin runs standalone
+	 * (without slashed.php); it can't serve a flat bundle either, so the
+	 * layered wrapper is the correct default there.
+	 *
+	 * @return bool
+	 */
+	private static function use_cascade_layer() {
+		if ( ! class_exists( 'Slashed_CSS_Loader' ) ) {
+			return true;
+		}
+		return Slashed_CSS_Loader::layers_enabled();
+	}
+
 	/**
 	 * Build declarations from the flat { "--name": "value" } override map the
 	 * in-WordPress configurator saves via POST /tokens/overrides.
diff --git a/SLASHED-for-WP/includes/class-css-loader.php b/SLASHED-for-WP/includes/class-css-loader.php
index c9adb67a..36bfc934 100644
--- a/SLASHED-for-WP/includes/class-css-loader.php
+++ b/SLASHED-for-WP/includes/class-css-loader.php
@@ -52,6 +52,17 @@ public static function get_bundle() {
 	 * @return string
 	 */
 	public static function get_url() {
+		// SLASHED_PATH / SLASHED_URL are defined by slashed.php, i.e. only in
+		// unified mode. An integration plugin running standalone loads this class
+		// but resolves its own bundle URL (slashed_{builder}_get_css_url()), so
+		// there is no local bundle to find here — and dereferencing the constants
+		// would be a fatal error. Fall through to the filter with an empty URL,
+		// exactly as a missing bundle file does.
+		if ( ! defined( 'SLASHED_PATH' ) || ! defined( 'SLASHED_URL' ) ) {
+			/** This filter is documented below. */
+			return apply_filters( 'slashed/css_bundle_url', '' );
+		}
+
 		$bundle   = self::get_bundle();
 		$flat     = Slashed_Settings::get_css_flat();
 		$debug    = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;
@@ -71,6 +82,74 @@ public static function get_url() {
 		return apply_filters( 'slashed/css_bundle_url', $url );
 	}
 
+	/**
+	 * Whether the served bundle carries @layer, so inline CSS added on top of
+	 * the `slashed-framework` handle should be wrapped in a framework layer.
+	 *
+	 * False when the flat variant is enabled: those bundles are the same rules
+	 * with every @layer stripped, and an unlayered declaration beats ANY layered
+	 * one regardless of specificity or source order. Inline CSS that keeps its
+	 * @layer wrapper is therefore silently inert against a flat bundle — which
+	 * is how token overrides and the builder dark-mode bridges stopped reaching
+	 * the page whenever flat mode was switched on.
+	 *
+	 * Layer support is a property of the bundle actually served, not of the
+	 * setting: `slashed/css_bundle_url` can serve a bundle the css_flat setting
+	 * does not describe, and getting that backwards reintroduces the very bug
+	 * this method exists to prevent (layered overrides over a flat bundle, or
+	 * unlayered rules outranking the framework's @media-scoped rules over a
+	 * layered one). So the resolved URL decides whenever it is recognisably one
+	 * of SLASHED's own bundles, and the setting is only the fallback for a URL
+	 * this cannot read — a CDN path with an arbitrary name, say. Hosts serving
+	 * such a bundle should state its layer mode via `slashed/css_layers_enabled`
+	 * rather than rely on the fallback.
+	 *
+	 * @return bool
+	 */
+	public static function layers_enabled() {
+		$url     = self::get_url();
+		$mode    = '' === $url ? null : self::url_layer_mode( $url );
+		$enabled = null === $mode ? ! Slashed_Settings::get_css_flat() : $mode;
+
+		/**
+		 * Filter whether the served bundle supports @layer.
+		 *
+		 * @param bool   $enabled Whether inline framework CSS should be layered.
+		 * @param string $url     The resolved bundle URL this was derived from.
+		 */
+		return (bool) apply_filters( 'slashed/css_layers_enabled', $enabled, $url );
+	}
+
+	/**
+	 * Layer mode implied by a bundle URL's filename.
+	 *
+	 * Pure and side-effect free so the naming contract can be tested directly.
+	 *
+	 * @param string $url Resolved bundle URL.
+	 * @return bool|null True when the name is a layered SLASHED bundle, false for
+	 *                   a flat one, null when the name is not one this recognises.
+	 */
+	public static function url_layer_mode( $url ) {
+		$path = wp_parse_url( (string) $url, PHP_URL_PATH );
+		$name = is_string( $path ) ? basename( $path ) : '';
+		if ( ! preg_match( '/^slashed\.[a-z0-9-]+(\.flat)?(\.min)?\.css$/i', $name, $m ) ) {
+			return null;
+		}
+		return empty( $m[1] );
+	}
+
+	/**
+	 * Wrap inline CSS in a framework cascade layer, or return it unlayered when
+	 * the flat bundle is being served (see layers_enabled()).
+	 *
+	 * @param string $layer Layer name, e.g. 'slashed.themes'.
+	 * @param string $css   Rules to wrap.
+	 * @return string
+	 */
+	public static function wrap_layer( $layer, $css ) {
+		return self::layers_enabled() ? '@layer ' . $layer . '{' . $css . '}' : $css;
+	}
+
 	/**
 	 * Derive a cache-busting version string for a resolved CSS URL.
 	 *
diff --git a/SLASHED-for-WP/integrations/bricks/includes/class-enqueue.php b/SLASHED-for-WP/integrations/bricks/includes/class-enqueue.php
index 23782b2f..577db921 100644
--- a/SLASHED-for-WP/integrations/bricks/includes/class-enqueue.php
+++ b/SLASHED-for-WP/integrations/bricks/includes/class-enqueue.php
@@ -37,9 +37,14 @@ public function enqueue_frontend_styles() {
 		}
 
 		// Bridge Bricks' dark mode toggle (data-brx-theme attribute) to SLASHED's theme system.
+		// Layered only when the served bundle has layers — against a flat bundle a
+		// layered rule can never win, which would leave the bridge inert.
+		$bridge = '[data-brx-theme="light"]{color-scheme:light;--sf-is-dark:0}[data-brx-theme="dark"]{color-scheme:dark;--sf-is-dark:1}';
 		wp_add_inline_style(
 			'slashed-framework',
-			'@layer slashed.themes{[data-brx-theme="light"]{color-scheme:light;--sf-is-dark:0}[data-brx-theme="dark"]{color-scheme:dark;--sf-is-dark:1}}'
+			class_exists( 'Slashed_CSS_Loader' )
+				? Slashed_CSS_Loader::wrap_layer( 'slashed.themes', $bridge )
+				: '@layer slashed.themes{' . $bridge . '}'
 		);
 	}
 
diff --git a/SLASHED-for-WP/integrations/gutenberg/includes/class-enqueue.php b/SLASHED-for-WP/integrations/gutenberg/includes/class-enqueue.php
index 4cc7d6b4..ed0fd2f9 100644
--- a/SLASHED-for-WP/integrations/gutenberg/includes/class-enqueue.php
+++ b/SLASHED-for-WP/integrations/gutenberg/includes/class-enqueue.php
@@ -63,9 +63,14 @@ public function enqueue_editor_styles() {
 		// Bridge the Gutenberg dark-mode toggle to SLASHED's theme system.
 		// Attaches to whichever code enqueued the shared handle.
 		if ( wp_style_is( 'slashed-framework', 'enqueued' ) ) {
+			// Layered only when the served bundle has layers — against a flat bundle
+			// a layered rule can never win, which would leave the bridge inert.
+			$bridge = 'html[data-wp-dark-mode-active]{color-scheme:dark;--sf-is-dark:1}';
 			wp_add_inline_style(
 				'slashed-framework',
-				'@layer slashed.themes{html[data-wp-dark-mode-active]{color-scheme:dark;--sf-is-dark:1}}'
+				class_exists( 'Slashed_CSS_Loader' )
+					? Slashed_CSS_Loader::wrap_layer( 'slashed.themes', $bridge )
+					: '@layer slashed.themes{' . $bridge . '}'
 			);
 		}
 	}
diff --git a/docs/troubleshooting-token-overrides.md b/docs/troubleshooting-token-overrides.md
new file mode 100644
index 00000000..9e6885d6
--- /dev/null
+++ b/docs/troubleshooting-token-overrides.md
@@ -0,0 +1,77 @@
+# Troubleshooting: a configurator control changes nothing on the page
+
+Symptom: a control works in the standalone configurator (and in the plugin's own
+live preview) but changes nothing on the WordPress page. The spacing/typography
+**modular scale** is the usual reporter, because it works indirectly — it moves
+a *source knob* that the framework's generative `clamp()`s read, rather than
+writing the concrete value.
+
+Work through it in this order; each step is a measurement, not a guess.
+
+## 1. Is the emitted CSS itself capable of moving the page?
+
+```bash
+node tests/override-effect-probe.mjs
+```
+
+This asks the real PHP emitter for the CSS a site would serve for each control
+group, then diffs every live `--sf-*` token in a headless browser against the
+un-overridden page — for both the layered and the flat bundle. `DEAD` means the
+control cannot work anywhere; `OK` means the problem is specific to the site.
+See the file header for prerequisites (`playwright`, `php`).
+
+If everything is `OK` here, the defect is in the page's CSS environment, and no
+amount of reading plugin code will find it. Go to step 2.
+
+## 2. What does the actual page say?
+
+Open the page where the change should be visible (the front end, or the Bricks
+canvas iframe — pick the iframe as the console context, not the builder panel),
+and paste the whole of [`scripts/diagnose-page-tokens.js`](../scripts/diagnose-page-tokens.js)
+into DevTools.
+
+Read the output against this table. "Source knob" = `--sf-space-ratio-min` et al;
+"derived output" = `--sf-space-m`, `--sf-space-4xl`, …
+
+| What the output shows | What it means | Fix |
+|---|---|---|
+| Section 4 says the ladder does NOT match the knobs | The decisive case. The concrete output tokens are declared by something that is not the framework's generative CSS, so the knobs feed a formula whose result is discarded — they read back correctly at `:root` and change nothing. Note this does **not** require the outputs to sit at their defaults: an unrelated hand-set ladder reads as "not default" and still proves the knobs are inert. Section 2 names the declaring rule. | Remove that source. If it is another SLASHED copy loaded by a theme/optimizer, stop the duplicate load. |
+| Source knob = your value, derived outputs = defaults | Same shadowing, in its most obvious form. Section 2 names it — look for `layer=(unlayered …)`, which beats every `@layer`, or a declaration in a layer after `slashed.overrides`. | As above. |
+| Source knob = default value | The override never reached the page. Section 2 will show no `slashed.overrides` declaration. | Page cache or CSS optimizer serving HTML from before the save — purge it. Confirm `<style id="slashed-framework-inline-css">` exists in view-source. |
+| Section 4 says the ladder matches, and the knobs show your values | The tokens *are* live on the page. | The element you are looking at does not consume them — e.g. the builder sets padding in px. Check the element's own computed padding in DevTools, not the token. |
+| Section 1 flags a `.flat.` bundle | Flat bundles carry no `@layer`. The emitter follows this automatically (`Slashed_CSS_Loader::layers_enabled()`), but a *third-party* optimizer that strips `@layer` from the bundle recreates the same mismatch from outside, and the plugin cannot detect that. | Disable the optimizer's layer stripping, or switch the plugin to flat mode deliberately so both sides agree. |
+
+## 3. Is a concrete value stored in the override map?
+
+This is the cause that has actually been observed in the field, so check it
+early — the diagnostic's section 5 calls it out by name.
+
+```bash
+wp option get slashed_overrides --format=json
+```
+
+An explicit output token in the map (say
+`--sf-space-m: clamp(1.00rem, 0.85rem + 0.75vw, 1.50rem)`) **beats the scale
+knob by design** — fine-tuning wins over the knob that generated it, in both the
+JS preview and the PHP emitter (`array_merge($derived, $overrides)`), because the
+emitted `@layer slashed.overrides` block lands after the framework's generative
+rules. A full per-step ladder stored this way makes the base *and* ratio knobs
+completely inert while both still read back correctly at `:root`, which is the
+confusing part: nothing looks broken, the values are simply unused.
+
+Such entries arrive from an older settings page, the All-tokens tab, or an
+imported theme. The fix is to drop the `--sf-space-*` **step** keys (`2xs`, `xs`,
+`s`, `m`, `l`, `xl`, `2xl`, `3xl`, `4xl`) and keep the base/ratio/scale knobs —
+reset them from the configurator's All-tokens tab, or rewrite the option. Note
+the same applies to `--sf-text-*` steps and the typography scale.
+
+## What is already known-good (don't re-audit these)
+
+- The configurator writes only live token names — every `--sf-*` literal in
+  `configurator/src` resolves against `data/inventory.json`.
+- The vendored `admin-app/src/` and `framework-css/` match the framework at the
+  pinned `SLASHED_CSS_REF`; `npm run check` is the gate for that.
+- The live preview injects **unlayered** `:root` CSS including pre-computed
+  derived tokens (`persistence.ts:injectLivePreview`), which is why the preview
+  can look right while the saved page is wrong. A preview/page mismatch is a
+  symptom of a cascade conflict on the page, not of a broken control.
diff --git a/scripts/diagnose-page-tokens.js b/scripts/diagnose-page-tokens.js
new file mode 100644
index 00000000..cad2f91c
--- /dev/null
+++ b/scripts/diagnose-page-tokens.js
@@ -0,0 +1,222 @@
+/**
+ * Browser console snippet — NOT a node script. Paste the whole file into
+ * DevTools on a live page (front end, or the Bricks canvas iframe) to find out
+ * why a configurator control "does nothing" on that specific site.
+ *
+ * It reports, for the spacing modular scale (edit WATCH for other domains):
+ *   1. every stylesheet on the page, flagging SLASHED bundles and flat builds
+ *   2. every CSS rule that declares one of the watched tokens, with the cascade
+ *      layer it sits in — an unlayered declaration beats every layered one, so
+ *      this is what identifies a shadowing rule
+ *   3. the computed value of each source knob and derived output at :root
+ *   4. a verdict tying those together
+ *
+ * The telltale failure is a source knob that shows YOUR value while the derived
+ * --sf-space-* outputs sit at their defaults: something on the page declares
+ * the concrete output tokens and shadows the generative clamp()s the knob feeds.
+ *
+ * See docs/troubleshooting-token-overrides.md for how to read the output.
+ */
+(() => {
+  const SOURCES = [
+    '--sf-space-ratio-min', '--sf-space-ratio-max',
+    '--sf-space-base-min', '--sf-space-base-max',
+    '--sf-space-scale', '--sf-fluid-min-vw', '--sf-fluid-max-vw',
+  ];
+  const OUTPUTS = ['--sf-space-2xs', '--sf-space-s', '--sf-space-m', '--sf-space-l', '--sf-space-4xl'];
+  const WATCH = [...SOURCES, ...OUTPUTS];
+
+  const rootStyle = getComputedStyle(document.documentElement);
+  console.group('%cSLASHED token diagnostic', 'font-weight:bold');
+
+  console.group('1. Stylesheets on this page');
+  const sheets = [];
+  for (const sheet of document.styleSheets) {
+    const href = sheet.href || '(inline <style>)';
+    let rules = null;
+    let readable = true;
+    try {
+      rules = sheet.cssRules;
+    } catch {
+      readable = false;
+    }
+    sheets.push({ sheet, href, readable });
+    const flags = [];
+    if (/slashed/i.test(href)) flags.push('SLASHED bundle');
+    if (/\.flat\./i.test(href)) flags.push('FLAT (no @layer)');
+    if (!readable) flags.push('cross-origin — cannot inspect');
+    console.log(`${href}${flags.length ? '   [' + flags.join(', ') + ']' : ''}`);
+  }
+  console.groupEnd();
+
+  console.group('2. Who declares these tokens (in cascade order)');
+  const found = [];
+  const walk = (rules, layer, sheetLabel) => {
+    for (const rule of rules) {
+      // Note: a plain CSSStyleRule also exposes .cssRules (CSS nesting), so the
+      // declaration check must come first and recursion must not be an else-branch.
+      if (rule.style) {
+        // Only a rule that actually matches the root element can affect the
+        // tokens read at :root. Builders reset long lists of custom properties
+        // on their own components (Bricks' frontend-layer.min.css sets dozens of
+        // --sf-* to `unset` on .brxe-* selectors); those rows are informative but
+        // must never be reported as shadowing the scale.
+        let matchesRoot = false;
+        try {
+          matchesRoot = !!rule.selectorText && document.documentElement.matches(rule.selectorText);
+        } catch { /* unsupported selector — treat as non-matching */ }
+        for (const token of WATCH) {
+          const value = rule.style.getPropertyValue(token);
+          if (!value) continue;
+          found.push({
+            token,
+            value: value.trim().slice(0, 60),
+            important: rule.style.getPropertyPriority(token) === 'important',
+            layer: layer || '(unlayered — beats every layer)',
+            selector: rule.selectorText,
+            atRoot: matchesRoot,
+            sheet: sheetLabel,
+          });
+        }
+      }
+      if (rule.cssRules && rule.cssRules.length) {
+        const isLayer = typeof rule.name === 'string' && /Layer/.test(rule.constructor.name);
+        walk(
+          rule.cssRules,
+          isLayer ? [layer, rule.name || '(anonymous)'].filter(Boolean).join(' > ') : layer,
+          sheetLabel,
+        );
+      }
+    }
+  };
+  for (const { sheet, href, readable } of sheets) {
+    if (!readable) continue;
+    walk(sheet.cssRules, '', href.replace(/^.*\//, '') || href);
+  }
+  if (found.length) console.table(found);
+  else console.warn('No rule on this page declares any of the watched tokens.');
+  console.groupEnd();
+
+  console.group('3. Computed values at :root');
+  console.table(
+    WATCH.map((token) => ({
+      token,
+      computed: rootStyle.getPropertyValue(token).trim() || '(empty)',
+      kind: SOURCES.includes(token) ? 'source knob' : 'derived output',
+    })),
+  );
+  console.groupEnd();
+
+  console.group('4. Is the ladder actually generated from the knobs?');
+  // The framework builds every --sf-space-* step from the knobs above:
+  //   step n = lerp(base_min * ratio_min^n, base_max * ratio_max^n, t) * scale
+  // where t is where the current viewport sits in the fluid range. t and the rem
+  // size are unknown here, but they cancel when each step is measured RELATIVE to
+  // step m (n=0) — so the shape of the ladder alone says whether the knobs
+  // produced it. A ladder that fits no t is being declared by something else,
+  // which is the signature of a knob that reads back correctly yet does nothing.
+  const px = (token) => parseFloat(rootStyle.getPropertyValue(token));
+  const STEPS = [['--sf-space-2xs', -3], ['--sf-space-xs', -2], ['--sf-space-s', -1],
+    ['--sf-space-m', 0], ['--sf-space-l', 1], ['--sf-space-xl', 2],
+    ['--sf-space-2xl', 3], ['--sf-space-3xl', 4], ['--sf-space-4xl', 5]];
+  const knob = (token, fallback) => {
+    const v = parseFloat(rootStyle.getPropertyValue(token));
+    return Number.isFinite(v) ? v : fallback;
+  };
+  const aMin = knob('--sf-space-ratio-min', 1.25);
+  const aMax = knob('--sf-space-ratio-max', 1.333);
+  const bMin = knob('--sf-space-base-min', 1);
+  const bMax = knob('--sf-space-base-max', 2);
+  const measured = STEPS.map(([t, n]) => [n, px(t)]).filter(([, v]) => Number.isFinite(v) && v > 0);
+  const base = measured.find(([n]) => n === 0);
+  if (!base || measured.length < 4) {
+    console.warn('Not enough --sf-space-* steps resolved to check the ladder.');
+  } else {
+    const model = (n, t) => {
+      const lo = bMin * aMin ** n;
+      const hi = bMax * aMax ** n;
+      // The framework wraps the interpolation in clamp(lo, …, hi). When the
+      // knobs make lo exceed hi (a mobile ratio steeper than the desktop one,
+      // which the panel allows), CSS clamp() returns its first argument — so
+      // the step pins to lo instead of interpolating. Model that, or a
+      // perfectly healthy page reads as a mismatch at the top of the ladder.
+      if (lo >= hi) return lo;
+      return lo + t * (hi - lo);
+    };
+    let best = { t: 0, worst: Infinity };
+    for (let t = 0; t <= 1.0001; t += 0.0005) {
+      let worst = 0;
+      for (const [n, value] of measured) {
+        const predicted = model(n, t) / model(0, t);
+        worst = Math.max(worst, Math.abs(predicted - value / base[1]) / (value / base[1]));
+      }
+      if (worst < best.worst) best = { t, worst };
+    }
+    const pct = (best.worst * 100).toFixed(1);
+    if (best.worst > 0.02) {
+      console.warn(
+        `The ladder does NOT match the knobs (best fit is still ${pct}% off).\n` +
+          'The concrete --sf-space-* tokens on this page are declared by something\n' +
+          'other than the framework\'s generative CSS, so the base/ratio knobs feed a\n' +
+          'formula whose result is being thrown away — they read back correctly at\n' +
+          ':root and change nothing. Section 5 names the source; section 2 lists every\n' +
+          'rule that declares them.',
+      );
+    } else {
+      console.log(`Ladder matches the knobs (within ${pct}%) — the scale IS generated from them.`);
+    }
+  }
+  console.groupEnd();
+
+  console.group('5. Verdict');
+  // A concrete output token declared at :root anywhere later than the framework's
+  // own generative rules shadows the scale. That covers both an unlayered
+  // third-party rule and — the common case — a stale concrete value stored in the
+  // plugin's own override map, which lands in @layer slashed.overrides.
+  const shadowing = found.filter(
+    (f) => OUTPUTS.includes(f.token) && f.atRoot && !/slashed\.tokens/.test(f.layer),
+  );
+  const fromOverrideMap = shadowing.filter((f) => /slashed\.overrides/.test(f.layer));
+  const foreign = shadowing.filter((f) => !/slashed\.overrides/.test(f.layer));
+  const overrideRules = found.filter((f) => /overrides/.test(f.layer) && f.atRoot);
+  if (!overrideRules.length) {
+    console.warn(
+      'No declaration in @layer slashed.overrides (or unlayered override block) was found.\n' +
+        'The saved tokens are not reaching this page at all — check that the page is not\n' +
+        'served from a cache predating the save, and view-source for a\n' +
+        '<style id="slashed-framework-inline-css"> block.',
+    );
+  }
+  if (fromOverrideMap.length) {
+    console.warn(
+      'Concrete --sf-space-* values are stored in the PLUGIN\'S OWN override map\n' +
+        '(they are emitted into @layer slashed.overrides at :root, after the\n' +
+        'framework\'s generative rules, so they win). This is why the base and ratio\n' +
+        'knobs read back correctly and change nothing: an explicit per-step value\n' +
+        'takes precedence over the knob that would have generated it, by design.\n' +
+        'These are usually left over from an older settings page or an imported\n' +
+        'theme. Inspect with:  wp option get slashed_overrides --format=json\n' +
+        'and remove the --sf-space-* step keys (keep the base/ratio/scale knobs).\n' +
+        'Shadowing declarations:',
+    );
+    console.table(fromOverrideMap);
+  }
+  if (foreign.length) {
+    console.warn(
+      'Concrete --sf-space-* output tokens are declared at :root by CSS outside the\n' +
+        'framework, which shadows the modular-scale knobs. Offending rules:',
+    );
+    console.table(foreign);
+  }
+  if (overrideRules.length && !shadowing.length) {
+    console.log(
+      'Overrides are present and nothing unlayered is shadowing the output tokens.\n' +
+        'Compare section 3: if a source knob shows your value but the derived outputs\n' +
+        'did not move, the framework CSS on this page is not the generative build.\n' +
+        'If both moved, the tokens ARE live and the element you are looking at does not\n' +
+        'use them (e.g. builder-set padding in px).',
+    );
+  }
+  console.groupEnd();
+  console.groupEnd();
+})();
diff --git a/tests-php/CssGeneratorFlatBundleTest.php b/tests-php/CssGeneratorFlatBundleTest.php
new file mode 100644
index 00000000..cf08c73f
--- /dev/null
+++ b/tests-php/CssGeneratorFlatBundleTest.php
@@ -0,0 +1,125 @@
+<?php
+/**
+ * Emission tests for the flat-bundle path: when the flat CSS variant is served,
+ * the override block must be emitted UNLAYERED.
+ *
+ * Why this matters: the flat bundles are the layered rules with every @layer
+ * stripped, and an unlayered declaration beats any layered one regardless of
+ * specificity or source order. A `@layer slashed.overrides` wrapper is
+ * therefore completely inert against a flat bundle — every token override
+ * (colours, spacing, the modular scales) silently stops reaching the page.
+ *
+ * Runs in a separate process: it loads Slashed_Settings / Slashed_CSS_Loader,
+ * and their mere presence switches other units into "unified mode" (see
+ * Slashed_Token_Store::get_plugin_settings and TokenStoreTest's standalone-mode
+ * test), so that must not leak into the rest of the suite.
+ *
+ * @runTestsInSeparateProcesses
+ * @preserveGlobalState disabled
+ *
+ * @package SLASHED
+ */
+
+use PHPUnit\Framework\TestCase;
+
+final class CssGeneratorFlatBundleTest extends TestCase {
+
+	protected function setUp(): void {
+		slashed_test_reset_state();
+		// layers_enabled() resolves the real bundle URL, so the plugin's path
+		// constants have to point at the committed dist/ for the flat and layered
+		// filenames to exist. Per-test process isolation keeps these local.
+		if ( ! defined( 'SLASHED_PATH' ) ) {
+			define( 'SLASHED_PATH', dirname( __DIR__ ) . '/SLASHED-for-WP/' );
+		}
+		if ( ! defined( 'SLASHED_URL' ) ) {
+			define( 'SLASHED_URL', 'https://example.test/wp-content/plugins/slashed/' );
+		}
+		$includes = dirname( __DIR__ ) . '/SLASHED-for-WP/includes/';
+		require_once $includes . 'class-settings.php';
+		require_once $includes . 'class-css-loader.php';
+	}
+
+	/** Set the flat toggle the way the settings page does. */
+	private function set_flat( bool $flat ): void {
+		update_option( Slashed_Settings::OPTION_KEY, array( 'css_flat' => $flat ) );
+	}
+
+	public function test_layered_bundle_keeps_the_overrides_layer_wrapper() {
+		$this->set_flat( false );
+		Slashed_Token_Store::update_overrides( array( '--sf-color-primary' => '#ff0000' ) );
+
+		$this->assertSame(
+			"@layer slashed.overrides {\n\t:root {\n\t\t--sf-color-primary: #ff0000;\n\t}\n}",
+			Slashed_CSS_Generator::get_override_css()
+		);
+	}
+
+	public function test_flat_bundle_emits_the_same_declarations_unlayered() {
+		$this->set_flat( true );
+		Slashed_Token_Store::update_overrides( array( '--sf-color-primary' => '#ff0000' ) );
+
+		$this->assertSame(
+			":root {\n\t--sf-color-primary: #ff0000;\n}",
+			Slashed_CSS_Generator::get_override_css()
+		);
+	}
+
+	public function test_flat_bundle_carries_every_declaration_including_derived_ones() {
+		$this->set_flat( true );
+		// --sf-space-ratio-min is a source knob the framework's generative
+		// clamp()s read; --sf-radius-scale additionally expands to derived
+		// output tokens. Both must survive the unlayered path intact.
+		Slashed_Token_Store::update_overrides(
+			array(
+				'--sf-space-ratio-min' => '1.618',
+				'--sf-radius-scale'    => '2',
+			)
+		);
+
+		$css = Slashed_CSS_Generator::get_override_css();
+		$this->assertStringNotContainsString( '@layer', $css );
+		$this->assertStringContainsString( '--sf-space-ratio-min: 1.618;', $css );
+		$this->assertStringContainsString( '--sf-radius-m: 16px;', $css );
+		$this->assertStringContainsString( '--sf-radius-scale: 2;', $css );
+	}
+
+	/**
+	 * The setting is not the authority — the served bundle is. `slashed/css_bundle_url`
+	 * can point at a bundle css_flat does not describe, and emitting the wrong
+	 * layer mode for it reintroduces exactly the inert-override bug.
+	 *
+	 * @dataProvider provide_bundle_urls
+	 */
+	public function test_layer_mode_is_read_from_the_resolved_bundle_url( $url, $expected ) {
+		$this->assertSame( $expected, Slashed_CSS_Loader::url_layer_mode( $url ) );
+	}
+
+	public function provide_bundle_urls() {
+		return array(
+			'layered, minified'    => array( 'https://x.test/dist/slashed.optimal.min.css', true ),
+			'layered, unminified'  => array( 'https://x.test/dist/slashed.full.css', true ),
+			'flat, minified'       => array( 'https://x.test/dist/slashed.optimal.flat.min.css', false ),
+			'flat, unminified'     => array( 'https://x.test/dist/slashed.full.flat.css', false ),
+			'query string ignored' => array( 'https://x.test/dist/slashed.optimal.flat.min.css?ver=123', false ),
+			'unrecognised name'    => array( 'https://cdn.test/assets/a1b2c3.css', null ),
+			'empty'                => array( '', null ),
+		);
+	}
+
+	public function test_wrap_layer_follows_the_same_switch() {
+		$this->set_flat( false );
+		$this->assertTrue( Slashed_CSS_Loader::layers_enabled() );
+		$this->assertSame(
+			'@layer slashed.themes{:root{--sf-is-dark:1}}',
+			Slashed_CSS_Loader::wrap_layer( 'slashed.themes', ':root{--sf-is-dark:1}' )
+		);
+
+		$this->set_flat( true );
+		$this->assertFalse( Slashed_CSS_Loader::layers_enabled() );
+		$this->assertSame(
+			':root{--sf-is-dark:1}',
+			Slashed_CSS_Loader::wrap_layer( 'slashed.themes', ':root{--sf-is-dark:1}' )
+		);
+	}
+}
diff --git a/tests-php/bootstrap.php b/tests-php/bootstrap.php
index 240c6bee..d9e54786 100644
--- a/tests-php/bootstrap.php
+++ b/tests-php/bootstrap.php
@@ -66,6 +66,14 @@ function apply_filters( $tag, $value ) {
 	}
 }
 
+if ( ! function_exists( 'wp_parse_url' ) ) {
+	// WordPress's wrapper is a straight parse_url() delegate on the PHP versions
+	// this plugin supports; the wrapper exists for pre-5.4.7 compatibility only.
+	function wp_parse_url( $url, $component = -1 ) {
+		return parse_url( $url, $component ); // phpcs:ignore WordPress.WP.AlternativeFunctions.parse_url_parse_url
+	}
+}
+
 /**
  * Reset the in-memory option store and the CSS generator's static cache so
  * each option-touching test starts from a clean slate.
diff --git a/tests/override-effect-probe.mjs b/tests/override-effect-probe.mjs
new file mode 100644
index 00000000..008ebe64
--- /dev/null
+++ b/tests/override-effect-probe.mjs
@@ -0,0 +1,201 @@
+/**
+ * Manual, local-only dev/QA tool — NOT part of `npm test` or CI (needs a
+ * Playwright browser, which this repo doesn't depend on).
+ *
+ * Answers the question "which configurator controls actually change anything on
+ * the page?" mechanically, instead of by clicking through the UI and squinting.
+ *
+ * For every case below it:
+ *   1. asks the real PHP emitter what CSS a site would serve for that override
+ *      map (tests/php-harness/emit-override-css.php — same validation, derived
+ *      token expansion and @layer/unlayered wrapper as production), then
+ *   2. loads a probe page with a bundle from SLASHED-for-WP/dist/ plus that CSS
+ *      and diffs every live --sf-* token (and a handful of computed properties
+ *      on a real element) against the same page without the override.
+ *
+ * A case that changes nothing is reported DEAD: either the control writes a
+ * token the framework no longer reads, or the emitted CSS can't win the cascade.
+ * The whole matrix is run against both the layered and the flat bundle, because
+ * a wrapper/bundle mismatch takes out every control at once — that is how the
+ * flat-mode regression (layered overrides are inert against a flat bundle) was
+ * found, and re-running this is how you'd catch it coming back.
+ *
+ * Prerequisites (not automated by this script):
+ *   1. `playwright` installed with a Chromium available — it is not an npm
+ *      dependency of this repo:
+ *        npm install --no-save playwright && npx playwright install chromium
+ *   2. `php` on PATH.
+ *   3. SLASHED-for-WP/dist/ populated (it is committed; `npm run sync-dist`
+ *      refreshes it).
+ *
+ * Run: node tests/override-effect-probe.mjs
+ * Exit code is 1 when any case is DEAD, so it can be used as an ad-hoc gate.
+ */
+
+import fs from 'node:fs';
+import path from 'node:path';
+import http from 'node:http';
+import { execFileSync } from 'node:child_process';
+
+let chromium;
+try {
+  ({ chromium } = await import('playwright'));
+} catch {
+  console.error(
+    'playwright not found. This is a manual dev tool (not an npm dependency of\n' +
+    'this repo) — install it yourself first, e.g.:\n' +
+    '  npm install --no-save playwright && npx playwright install chromium'
+  );
+  process.exit(1);
+}
+
+const ROOT = path.resolve(import.meta.dirname, '..');
+const DIST = path.join(ROOT, 'SLASHED-for-WP', 'dist');
+const HARNESS = path.join(import.meta.dirname, 'php-harness', 'emit-override-css.php');
+
+// Self-check: a token the framework does not read must come out DEAD. If this
+// one ever reports OK the measurement below has gone noisy and every other
+// verdict in the run is worthless.
+const CONTROL_CASE = 'control: unknown token (must be DEAD)';
+
+// One case per configurator control group that has a distinct route to the
+// page. Values are deliberately far from the defaults so any real effect shows
+// up as a computed-value change.
+const CASES = {
+  [CONTROL_CASE]: { '--sf-definitely-not-a-framework-token': '99px' },
+  'spacing: modular scale (ratio)': { '--sf-space-ratio-min': '1.618', '--sf-space-ratio-max': '1.618' },
+  'spacing: modular scale (base)': { '--sf-space-base-min': '1.5', '--sf-space-base-max': '3' },
+  'spacing: space scale knob': { '--sf-space-scale': '2' },
+  'spacing: gap / gutter': { '--sf-gap': '3rem', '--sf-gutter': '4rem' },
+  'spacing: section scale': { '--sf-section-scale': '2' },
+  'typography: modular scale (ratio)': { '--sf-text-ratio-min': '1.5', '--sf-text-ratio-max': '1.5' },
+  'typography: modular scale (base)': { '--sf-text-base-min': '1.4', '--sf-text-base-max': '1.8' },
+  'typography: text scale knob': { '--sf-text-scale': '1.5' },
+  'typography: display scale': { '--sf-text-display-base-min': '3.5', '--sf-text-display-base-max': '5' },
+  'typography: body font': { '--sf-font-body': 'Georgia, serif' },
+  'fluid: viewport endpoints': { '--sf-fluid-min-vw': '30', '--sf-fluid-max-vw': '70' },
+  'colors: brand source': { '--sf-color-primary-source-light': 'oklch(0.7 0.2 30)' },
+  'contrast: bias': { '--sf-contrast-bias': '0.3' },
+  'borders: radius scale': { '--sf-radius-scale': '3' },
+  'borders: width scale': { '--sf-border-scale': '3' },
+  'shadows: strength': { '--sf-shadow-strength': '2' },
+  'motion: scale': { '--sf-motion-scale': '3' },
+  'components: density': { '--sf-density': '0.5' },
+};
+
+const TOKENS = JSON.parse(
+  fs.readFileSync(path.join(ROOT, 'SLASHED-for-WP', 'data', 'inventory.json'), 'utf8'),
+).variables;
+
+const PROBE_PROPS = [
+  'paddingTop', 'marginTop', 'gap', 'fontSize', 'fontFamily', 'lineHeight',
+  'borderRadius', 'borderTopWidth', 'transitionDuration', 'boxShadow',
+  'color', 'backgroundColor', 'minHeight',
+];
+
+function emit(cases, { flat }) {
+  const args = [HARNESS, ...(flat ? ['--flat'] : [])];
+  return JSON.parse(execFileSync('php', args, { input: JSON.stringify(cases), encoding: 'utf8' }));
+}
+
+const server = http
+  .createServer((req, res) => {
+    const file = path.join(DIST, path.basename(req.url.split('?')[0]));
+    try {
+      res.writeHead(200, { 'Content-Type': 'text/css' });
+      res.end(fs.readFileSync(file));
+    } catch {
+      res.writeHead(404);
+      res.end();
+    }
+  });
+// Bind loopback explicitly: every consumer below is 127.0.0.1, and a bare
+// listen(0) would expose this fixture server on every interface. Passing a host
+// routes through Node's async bind path, so wait for the listening event —
+// server.address() is still null on the tick listen() returns.
+await new Promise((resolve) => server.listen(0, '127.0.0.1', resolve));
+const { port } = server.address();
+
+const browser = await chromium.launch();
+let failures = 0;
+
+// A real Chromium process is running from here on, so every exit path — including
+// the missing-bundle bail-out and any throw inside the measurement loop — has to
+// go through cleanup or it leaves an orphaned browser behind.
+async function shutdown() {
+  server.close();
+  await browser.close();
+}
+
+async function measure(page, bundle, overrideCSS) {
+  await page.setContent(
+    `<link rel="stylesheet" href="http://127.0.0.1:${port}/${bundle}">` +
+      (overrideCSS ? `<style>${overrideCSS}</style>` : '') +
+      '<div class="sf-stack"><button id="probe" class="sf-btn">probe</button></div>',
+  );
+  await page.waitForLoadState('load');
+  return page.evaluate(
+    ({ tokens, props }) => {
+      const rootStyle = getComputedStyle(document.documentElement);
+      const out = {};
+      for (const token of tokens) out[token] = rootStyle.getPropertyValue(token).trim();
+      const probeStyle = getComputedStyle(document.getElementById('probe'));
+      for (const prop of props) out[`@probe.${prop}`] = probeStyle[prop];
+      return out;
+    },
+    { tokens: TOKENS, props: PROBE_PROPS },
+  );
+}
+
+try {
+  for (const flat of [false, true]) {
+    const bundle = `slashed.optimal${flat ? '.flat' : ''}.min.css`;
+    if (!fs.existsSync(path.join(DIST, bundle))) {
+      console.error(`missing bundle: SLASHED-for-WP/dist/${bundle} — run \`npm run sync-dist\``);
+      await shutdown();
+      process.exit(1);
+    }
+
+    const css = emit(CASES, { flat });
+    const page = await browser.newPage({ viewport: { width: 1440, height: 900 } });
+    // The framework's transitions would otherwise still be interpolating when the
+    // probe element is measured (the stylesheet lands after first paint), making
+    // colour/size readings differ run to run. Reduced motion collapses them.
+    await page.emulateMedia({ reducedMotion: 'reduce' });
+    // Throwaway pass: the very first load fetches the bundle cold, which lands
+    // after first paint and skews the probe element's computed values. Every
+    // later pass reads it from cache, so take the baseline from a warm page.
+    await measure(page, bundle, null);
+    const baseline = await measure(page, bundle, null);
+
+    console.log(`\n===== ${bundle}${flat ? '  (flat mode: css_flat = true)' : ''}`);
+    for (const [label, overrideCSS] of Object.entries(css)) {
+      const now = await measure(page, bundle, overrideCSS);
+      const changed = Object.keys(baseline).filter((k) => baseline[k] !== now[k]);
+      const probes = changed.filter((k) => k.startsWith('@probe.'));
+      // The verdict is the live-token diff: it is exact. The computed properties
+      // are reported as a hint about what a user would actually see move.
+      const tokenCount = changed.length - probes.length;
+      const isControl = label === CONTROL_CASE;
+      const ok = isControl ? tokenCount === 0 : tokenCount > 0;
+      if (!ok) failures += 1;
+      console.log(
+        `${tokenCount === 0 ? 'DEAD' : 'OK  '}${ok ? ' ' : '!'}${label.padEnd(38)}` +
+          ` tokens=${String(tokenCount).padStart(3)}` +
+          `  probe=${probes.map((p) => p.slice(7)).join(',') || '-'}`,
+      );
+    }
+    await page.close();
+  }
+} finally {
+  await shutdown();
+}
+
+if (failures > 0) {
+  console.error(
+    `\n${failures} case(s) marked "!" did not behave as expected — a DEAD control` +
+      ' group means those configurator controls change nothing on the page.',
+  );
+  process.exit(1);
+}
+console.log('\nEvery control group reached the page in both bundle modes.');
diff --git a/tests/php-harness/emit-override-css.php b/tests/php-harness/emit-override-css.php
new file mode 100644
index 00000000..6976535a
--- /dev/null
+++ b/tests/php-harness/emit-override-css.php
@@ -0,0 +1,94 @@
+<?php
+/**
+ * stdout carries nothing but the JSON the probe parses, so PHP diagnostics go to
+ * stderr. Otherwise a single notice raised while loading or running the emitter
+ * interleaves with json_encode()'s output and the probe dies on an opaque
+ * JSON.parse error instead of reporting the actual PHP problem.
+ */
+ini_set( 'display_errors', 'stderr' );
+error_reporting( E_ALL );
+
+/**
+ * Standalone harness: runs the real Slashed_CSS_Generator emission path outside
+ * a WordPress bootstrap so tests/override-effect-probe.mjs can measure the
+ * exact CSS a site would serve for a given set of token overrides.
+ *
+ * The point of going through the real generator (rather than hand-writing
+ * ":root { --x: y }" in the probe) is that everything between the stored option
+ * and the page — value re-validation, the derived-token expansion for the scale
+ * knobs, and the @layer / unlayered wrapper choice — is part of what can make a
+ * configurator control silently do nothing.
+ *
+ * WordPress is stubbed the same way tests-php/bootstrap.php stubs it: an
+ * in-memory option store plus an identity apply_filters(). Slashed_Settings is
+ * loaded so the flat-bundle switch (Slashed_CSS_Loader::layers_enabled()) is
+ * exercised for real.
+ *
+ * Usage:
+ *   echo '{"label": {"--sf-space-ratio-min": "1.618"}}' \
+ *     | php tests/php-harness/emit-override-css.php [--flat]
+ *
+ * Reads a JSON object of { label: { "--sf-name": "value" } } on stdin, writes a
+ * JSON object of { label: cssString } to stdout.
+ */
+
+define( 'ABSPATH', __DIR__ . '/' );
+
+$GLOBALS['slashed_test_options'] = array();
+
+function get_option( $name, $default = false ) {
+	return array_key_exists( $name, $GLOBALS['slashed_test_options'] )
+		? $GLOBALS['slashed_test_options'][ $name ]
+		: $default;
+}
+
+function update_option( $name, $value ) {
+	$GLOBALS['slashed_test_options'][ $name ] = $value;
+	return true;
+}
+
+function delete_option( $name ) {
+	unset( $GLOBALS['slashed_test_options'][ $name ] );
+	return true;
+}
+
+function apply_filters( $tag, $value ) {
+	return $value;
+}
+
+function wp_parse_url( $url, $component = -1 ) {
+	return parse_url( $url, $component ); // phpcs:ignore WordPress.WP.AlternativeFunctions.parse_url_parse_url
+}
+
+// Slashed_CSS_Loader::layers_enabled() resolves the served bundle URL to decide
+// the layer mode, so point the plugin's path constants at the committed dist/ —
+// the harness then exercises the same resolution a real install performs.
+$plugin = dirname( __DIR__, 2 ) . '/SLASHED-for-WP/';
+define( 'SLASHED_PATH', $plugin );
+define( 'SLASHED_URL', 'https://example.test/wp-content/plugins/slashed/' );
+
+$includes = $plugin . 'includes/';
+require $includes . 'class-settings.php';
+require $includes . 'class-css-loader.php';
+require $includes . 'class-token-store.php';
+require $includes . 'class-css-generator.php';
+
+$cases = json_decode( file_get_contents( 'php://stdin' ), true );
+if ( ! is_array( $cases ) ) {
+	fwrite( STDERR, "Expected a JSON object of { label: overrides } on stdin.\n" );
+	exit( 1 );
+}
+
+$flat  = in_array( '--flat', array_slice( $argv, 1 ), true );
+$cache = new ReflectionProperty( 'Slashed_CSS_Generator', 'cache' );
+$cache->setAccessible( true );
+
+$out = array();
+foreach ( $cases as $label => $overrides ) {
+	$GLOBALS['slashed_test_options'] = array( Slashed_Settings::OPTION_KEY => array( 'css_flat' => $flat ) );
+	$cache->setValue( null, null );
+	Slashed_Token_Store::update_overrides( is_array( $overrides ) ? $overrides : array() );
+	$out[ $label ] = Slashed_CSS_Generator::get_override_css();
+}
+
+echo json_encode( $out, JSON_UNESCAPED_SLASHES );