diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
index a65aafa3..c8f32bc6 100644
--- a/frontend/eslint.config.js
+++ b/frontend/eslint.config.js
@@ -48,6 +48,23 @@ export default tseslint.config(
         "error",
         { allowShortCircuit: true, allowTernary: true },
       ],
+      // R10 S2: keep the rem system from rotting. A px-frozen `text-[Npx]` font size does NOT scale
+      // with the Settings --font-scale slider while its rem neighbours do; use `text-2xs`/`text-3xs`
+      // or a `text-[Nrem]` arbitrary instead. Matches both plain strings and template-literal chunks;
+      // rem arbitraries (text-[0.75rem]) don't match (no "px"). Font-size `text-` only — not w-/h-/p-.
+      "no-restricted-syntax": [
+        "error",
+        {
+          selector: "Literal[value=/text-\\[\\d+px\\]/]",
+          message:
+            "px-frozen font size doesn't scale with --font-scale: use text-2xs/text-3xs or text-[Nrem], not text-[Npx] (R10 S2).",
+        },
+        {
+          selector: "TemplateElement[value.raw=/text-\\[\\d+px\\]/]",
+          message:
+            "px-frozen font size doesn't scale with --font-scale: use text-2xs/text-3xs or text-[Nrem], not text-[Npx] (R10 S2).",
+        },
+      ],
     },
   },
   prettier,
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 54404b6f..940cb88b 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -46,7 +46,11 @@
 /* Extra-small text steps in rem, so these labels scale with --font-scale like every other
    text (the ~124 px-frozen text-[10/11px] labels did NOT). Font-size ONLY — no paired
    --text-*--line-height — to match the `text-[Npx]` arbitraries they replace and avoid any
-   vertical-rhythm shift. */
+   vertical-rhythm shift.
+   Convention: the two COMMON small steps get names (below); the rare one-offs (12/13/8/9px)
+   stay as `text-[Nrem]` arbitraries rather than growing the token set — DON'T use `text-xs`
+   for 12px, it carries a line-height these labels never had. New small labels: reach for a
+   token first, an arbitrary only for a genuinely one-off size. */
 @theme {
   --text-2xs: 0.6875rem; /* 11px @ base — the most common frozen label */
   --text-3xs: 0.625rem; /* 10px @ base */