roast-my-design-system 5.10.2 → 5.11.0

package/README.md

@@ -8,6 +8,8 @@
 
 A free CLI tool (and Claude Code skill) that roasts your repo's design system with real data, then generates the rules that keep your AI agent on-system.
 
+> **New in 5.11: the checker and the CI guard stop contradicting each other.** `roast --check` and [guard-my-design-system](https://github.com/gregkozakiewicz/guard-my-design-system) both answer "does this change fit the system", and they disagreed in seven places. A second hand-rolled `<Button>` passed the guard. A new radius, font size, shadow or typeface passed `--check` and was then stopped in CI. Both now measure the same things. And both leave alone the files that cannot be on-system: email, print, OG cards, PDF invoices, pixel renderers and SVG artwork. A skipped file is never called clean; the result says what was left unjudged and why.
+
 > **New in 5.10: it reads Tailwind v3 shadcn, and every colour space.** shadcn on Tailwind v3 stores colour tokens as bare HSL channels, for the opacity trick. So a textbook shadcn repo used to scan as "2 colours, none defined as CSS variables". It now reads those tokens. It finds the greys (an oklch palette used to report 0). And it spots twins across notations: a token written as hsl and a hardcoded copy written as rgb are the same colour, and now count as a near-identical pair. Checked before and after on 6 real shadcn repos.
 
 > **New in 5.9: the agent card knows which doors your rules actually reach.** The report now states, as plain fact, which tools can read the rules files you have. Claude Code reads CLAUDE.md. Codex reads AGENTS.md. Cursor reads AGENTS.md and `.cursor/rules`. Where a door is missing, the card shows the one-line fix: Claude Code skips AGENTS.md, and a CLAUDE.md containing the single line `@AGENTS.md` closes the gap. The scan also finds rules files nested in subfolders, which is how monorepos really do it (twenty carries 35 AGENTS.md files; a root-only look reported 1). It recognises GEMINI.md, `.windsurf/rules` and `.github/instructions` too.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "roast-my-design-system",
-  "version": "5.10.2",
+  "version": "5.11.0",
   "mcpName": "io.github.gregkozakiewicz/roast-my-design-system",
   "description": "Your AI can write the UI. This makes sure it writes your UI. A deterministic scanner scores your design system 0-100 against 34 public repos, reads React and web components (Stencil, Lit), hands you a copy-paste fix prompt for each top finding, writes rules for Claude, Cursor, Copilot and Windsurf with --apply, and runs as a local MCP server with --mcp.",
   "keywords": [

package/skills/roast-my-design-system/scripts/harvest/tokens.mjs

@@ -7,6 +7,9 @@
  * New in 2.0 — 1.0 only ever read a clean globals.css; this reads the mess.
  */
 import { readFileSync } from 'node:fs';
+import {
+  EMAIL_PRINT_RE, ARTWORK_NAME_RE, RENDER_TO_IMAGE_RE, OG_ROUTE_RE, RENDERER_PATH_RE, svgHeavy,
+} from '../lib/exempt.mjs';
 import { join } from 'node:path';
 
 // ---------- counters ----------
@@ -48,6 +51,14 @@ export const tripletToHsl = (v) => {
   const m = HSL_TRIPLET_RE.exec(v);
   return m ? `hsl(${m[1]} ${m[2]}% ${m[3]}%${m[4] ? ` / ${m[4]}` : ''})` : null;
 };
+// Loose hex in CODE (not in a style block, a class string or a stylesheet) is
+// ambiguous: #RGBA shorthand is legal CSS but vanishingly rare in code, while
+// #1042 as an order id, ticket or issue number is everyday. Read as a colour
+// it expands to #11004422 and the review accuses an order id of being a
+// hardcoded colour (found on the demo repo, 2026-09-07). In a colour context
+// all four lengths still count; only the loose pass skips 4-digit.
+const isIdentifierHex = (raw) => /^#[0-9a-f]{4}$/i.test(raw);
+
 // hsl(var(--primary)) is a reference to a colour, never a colour, and
 // oklch(0.35 0.08 ${hue}) is a template with a hole in it: neither may sit in
 // the palette as its own value.
@@ -122,8 +133,9 @@ function isStaticInline(block) {
 }
 
 // Render-to-image surfaces (satori OG cards, react-pdf invoices) have inline
-// styles as their ONLY styling mechanism — same honesty rule as email.
-const RENDER_TO_IMAGE_RE = /ImageResponse|from ['"]satori['"]|from ['"]@react-pdf|next\/og/;
+// styles as their ONLY styling mechanism, the same honesty rule as email. The
+// patterns live in lib/exempt.mjs so the report, roast --check and the guard
+// all skip the same files.
 
 /** Extract inline style objects: style={{ ... }} */
 function inlineStyleBlocks(src) {
@@ -199,6 +211,7 @@ export function extractStyling(src, { css = false } = {}) {
   // colour consts) — everything not already collected above
   const seen = new Set(out.colors.map((c) => c.index));
   for (const m of src.matchAll(HEX_RE)) {
+    if (isIdentifierHex(m[0])) continue;
     if (![...seen].some((i) => Math.abs(i - m.index) < 4)) out.colors.push({ value: normalizeHex(m[0]), index: m.index });
   }
   for (const m of src.matchAll(/!\s*important/gi)) out.important.push({ index: m.index });
@@ -287,15 +300,9 @@ export function harvestTokens(root, styleFiles, codeFiles) {
   // Email templates (and print styles) MUST inline their styling — that's
   // correct practice, not mess. Counting them would hand a sharp dev an easy
   // reason to discredit the whole report.
-  const EXEMPT_RE = /email|(^|[/.])print([/.]|$)/i;
-  // SVG artwork components (logos, badges, illustrated icons) carry hex that
-  // is drawing, not styling — same honesty rule as email templates.
-  const ARTWORK_RE = /(^|\/)[\w.-]*(icon|logo|badge|illustration|shield|artwork|graphic|background)[\w.-]*\.(tsx|jsx)$/i;
-  // A component that is mostly SVG markup (theme-preview mocks, decorative
-  // scenes) is drawing, not styling — regardless of its filename.
-  const svgHeavy = (src) => (src.match(/<(?:svg|path|rect|circle|ellipse|polygon|mask|defs)\b/g) ?? []).length >= 15;
-  // Canvas/scene renderers draw pixels; their colour literals are not UI styling.
-  const RENDERER_PATH_RE = /(^|\/)(renderers?|scene|canvas)\/|renderElement|DebugCanvas/i;
+  // Email, artwork, mostly-SVG files and pixel renderers: all imported from
+  // lib/exempt.mjs, the one list every checker reads.
+  const EXEMPT_RE = EMAIL_PRINT_RE, ARTWORK_RE = ARTWORK_NAME_RE;
   // Colour-picker palettes and design-field option lists are user-facing data.
   const PALETTE_FILE_RE = /(color-picker|colour-picker|palette|design-fields|swatch)/i;
 
@@ -357,7 +364,7 @@ export function harvestTokens(root, styleFiles, codeFiles) {
     // code: its colours are the picture's, not the product's palette. Until
     // 5.10.0 they were the only "strays" a clean shadcn repo had, and they
     // triggered the "every single one is hardcoded" banner on it.
-    const renderToImage = RENDER_TO_IMAGE_RE.test(src) || /(^|\/)api\/og\//.test(f);
+    const renderToImage = RENDER_TO_IMAGE_RE.test(src) || OG_ROUTE_RE.test(f);
     if (renderToImage) continue;
 
     // Tailwind classes
@@ -400,7 +407,10 @@ export function harvestTokens(root, styleFiles, codeFiles) {
     // — cheap approximation: any hex in a .ts/.js file counts as a colour in code.
     if (/\.(ts|js)$/.test(f)) {
       for (const m of src.matchAll(HEX_RE)) {
-        // avoid counting hashes that aren't colors (e.g. IDs): require 3/4/6/8 hex digits already enforced by regex
+        // 4-digit shorthand in code is an identifier far more often than a
+        // colour (#1042 = an order id, not #11004422): same rule as the MCP
+        // validator, so both measure with one ruler.
+        if (isIdentifierHex(m[0])) continue;
         colors.add(normalizeHex(m[0]), f);
       }
     }

package/skills/roast-my-design-system/scripts/lib/declarations.mjs

@@ -0,0 +1,53 @@
+/**
+ * The styling declarations beyond colour and spacing that both checkers judge:
+ * radius, font size, shadow and typeface.
+ *
+ * They live here rather than in either checker because keeping two copies is
+ * exactly how the engine and guard-my-design-system drifted apart in the first
+ * place. One set of patterns, one idea of what counts as a value, two scopes:
+ * the engine reads whole files, the guard reads added lines.
+ *
+ * The whole trimmed value is the unit of comparison, exactly as the harvest
+ * counts it, so "already in the system" means the same thing in both places.
+ */
+
+/** kind: the finding's name · re: how to spot it · learned: the harvest key */
+export const EXTRA_KINDS = [
+  { kind: 'radius', noun: 'border radius', plural: 'radii', re: /border-radius\s*:\s*([^;{}]+)/i, learned: 'radii' },
+  { kind: 'fontsize', noun: 'font size', plural: 'font sizes', re: /(?:^|[^-\w])font-size\s*:\s*([^;{}]+)/i, learned: 'fontSizes' },
+  { kind: 'shadow', noun: 'shadow', plural: 'shadows', re: /box-shadow\s*:\s*([^;{}]+)/i, learned: 'shadows' },
+];
+
+export const FONT_LINE_RE = /font-family\s*:\s*([^;{}]+)/i;
+
+// Disciplined values that are never sins: token use, resets, inheritance.
+export const BENIGN_VALUE_RE = /^(var\(--[\w-]+\)|inherit|initial|unset|none|normal|0)$/i;
+const FONT_BENIGN_RE = /^(var\(--[\w-]+\)|inherit)$/i;
+
+/** The first declaration of one kind on one line, or null. The guard's door. */
+export function extraValue(re, text) {
+  const m = re.exec(text);
+  if (!m) return null;
+  const v = m[1].trim().replace(/\s+/g, ' ');
+  return BENIGN_VALUE_RE.test(v) ? null : v;
+}
+
+/** Every such declaration in a whole stylesheet, with positions. The engine's door. */
+export function* extraDeclarations(text) {
+  for (const { kind, noun, plural, re, learned } of EXTRA_KINDS) {
+    for (const m of text.matchAll(new RegExp(re.source, 'gi'))) {
+      const v = m[1].trim().replace(/\s+/g, ' ');
+      if (BENIGN_VALUE_RE.test(v)) continue;
+      yield { kind, noun, plural, learned, value: v, index: m.index + m[0].indexOf(m[1]) };
+    }
+  }
+}
+
+/** Every font-family declaration worth judging, raw value and position. */
+export function* fontDeclarations(text) {
+  for (const m of text.matchAll(new RegExp(FONT_LINE_RE.source, 'gi'))) {
+    const raw = m[1].trim();
+    if (FONT_BENIGN_RE.test(raw)) continue;
+    yield { raw, index: m.index + m[0].indexOf(m[1]) };
+  }
+}

package/skills/roast-my-design-system/scripts/lib/exempt.mjs

@@ -0,0 +1,50 @@
+/**
+ * Honesty exemptions — the two places where styling genuinely cannot be
+ * on-system, so judging it would be crying wolf.
+ *
+ * Email and print: mail clients strip stylesheets and print has no cascade to
+ * inherit, so the styling has to be inline and hardcoded. That is the medium,
+ * not a lapse.
+ *
+ * Artwork: a file named Icon, Logo, Badge or Illustration carries the colours
+ * of the drawing itself, and a drawing is not interface. The name alone is not
+ * enough though, or every Badge component would walk free: the contents must
+ * actually draw SVG. A Badge that is plain styled UI gets judged like anything
+ * else. A file that is mostly SVG earns it on contents alone, whatever it is
+ * called.
+ *
+ * Render-to-image: an OG card or a PDF invoice is a picture drawn with code.
+ * satori and react-pdf accept nothing but inline styles, so there is no
+ * on-system way to write one.
+ *
+ * Renderers: a canvas or scene renderer draws pixels. Its colour literals are
+ * the picture, not the product's palette.
+ *
+ * Shared by the engine (whole files) and by guard-my-design-system (added
+ * lines), so both give the same answer about the same file.
+ */
+export const EMAIL_PRINT_RE = /email|(^|[/.])print([/.]|$)/i;
+export const ARTWORK_NAME_RE = /(^|\/)[\w.-]*(icon|logo|badge|illustration|shield|artwork|graphic|background)[\w.-]*\.(tsx|jsx)$/i;
+export const SVG_MARKUP_RE = /<(svg|path|rect|circle|ellipse|polygon|defs|mask)\b/i;
+export const RENDER_TO_IMAGE_RE = /ImageResponse|from ['"]satori['"]|from ['"]@react-pdf|next\/og/;
+export const OG_ROUTE_RE = /(^|\/)api\/og\//;
+export const RENDERER_PATH_RE = /(^|\/)(renderers?|scene|canvas)\/|renderElement|DebugCanvas/i;
+
+/** Mostly drawing rather than styling, whatever the file is called. */
+export const svgHeavy = (text) =>
+  (text.match(/<(?:svg|path|rect|circle|ellipse|polygon|mask|defs)\b/g) ?? []).length >= 15;
+
+/**
+ * Why this file is exempt from judgement, as a sentence, or null when it is
+ * fair game. Needs the text as well as the name: the artwork exemption is
+ * earned by drawing, not by being called Icon.
+ */
+export function exemptReason(file, text = '') {
+  if (!file) return null;
+  if (EMAIL_PRINT_RE.test(file)) return 'email and print styling has to be inline, because there is no cascade to inherit';
+  if (RENDERER_PATH_RE.test(file)) return 'a renderer draws pixels, so its colours are the picture rather than the interface';
+  if (OG_ROUTE_RE.test(file) || RENDER_TO_IMAGE_RE.test(text)) return 'a render-to-image surface accepts nothing but inline styling, so there is no on-system way to write one';
+  if (svgHeavy(text)) return 'the file is mostly drawing rather than styling';
+  if (ARTWORK_NAME_RE.test(file) && SVG_MARKUP_RE.test(text)) return 'the colours belong to the artwork, not to the interface';
+  return null;
+}

package/skills/roast-my-design-system/scripts/lib/guard-api.mjs

@@ -13,12 +13,27 @@ import { extname, join } from 'node:path';
 import { readFileSync } from 'node:fs';
 import { walkRepo } from '../harvest/walk.mjs';
 import { harvestTokens, extractStyling, normalizeHex, isGrey } from '../harvest/tokens.mjs';
+import { harvestComponents, definedComponents } from '../harvest/components.mjs';
 import { loadExclusions } from './exclusions.mjs';
 import { hexRgb } from './nearpairs.mjs';
 import { typefaceOf, GENERIC_FONTS } from './typefaces.mjs';
 
 export { extractStyling, normalizeHex, isGrey, hexRgb, typefaceOf, GENERIC_FONTS };
 
+// The components a piece of text defines. With the ledger below, a guard can
+// tell a second <Button> from an edit to the first one.
+export { definedComponents };
+
+// The files no checker should judge. Exported so a guard reads the same list
+// as the engine rather than keeping a copy that drifts.
+export { EMAIL_PRINT_RE, ARTWORK_NAME_RE, SVG_MARKUP_RE, exemptReason } from './exempt.mjs';
+
+// Radius, font size, shadow and typeface: the patterns, so both checkers agree
+// on what a declaration is and what counts as a disciplined value.
+export {
+  EXTRA_KINDS, FONT_LINE_RE, BENIGN_VALUE_RE, extraValue, extraDeclarations, fontDeclarations,
+} from './declarations.mjs';
+
 // Same classification walkRepo uses, exposed so a caller looking at one file
 // (a diff hunk) treats it the way the full scan would.
 const CODE_EXTS = new Set(['.tsx', '.jsx', '.ts', '.js', '.mjs', '.cjs']);
@@ -41,6 +56,7 @@ export const isStyleFile = (p) => STYLE_EXTS.has(extname(p));
  *   shadows,          // [{ value, count, files }] every box-shadow declared
  *   fontFamilies,     // [{ value, count, files }] every family declared
  *   tailwind,         // { colors, spacing, radii, textSizes, arbitrary }
+ *   components,       // [{ name, file, usageCount, isPage }] the ledger
  *   files,            // { styles: n, code: n } — how much was read
  * }
  */
@@ -74,6 +90,11 @@ export function learnSystem(repoRoot, { exclude = [] } = {}) {
     shadows: t.shadows,
     fontFamilies: t.fontFamilies,
     tailwind: t.tailwind,
+    // Trimmed to the four fields a guard can act on: what it is called, where
+    // it lives, how much the repo leans on it, and whether it is a page (pages
+    // are routes, not reusable parts, so two of a name is not a duplicate).
+    components: harvestComponents(repoRoot, files.code).components
+      .map(({ name, file, usageCount, isPage }) => ({ name, file, usageCount, isPage })),
     files: { styles: files.styles.length, code: files.code.length },
   };
 }

package/skills/roast-my-design-system/scripts/lib/version.mjs

@@ -1,4 +1,4 @@
 // Single version constant for the engine — imported by diagnose (report
 // footer) and rules (generated-by line). This is the bump spot that used to
 // live as a const inside diagnose/index.mjs.
-export const VERSION = '5.10.2';
+export const VERSION = '5.11.0';

package/skills/roast-my-design-system/scripts/mcp/engine.mjs

@@ -13,12 +13,17 @@
 import { extractStyling } from '../harvest/tokens.mjs';
 import { definedComponents } from '../harvest/components.mjs';
 import { hexRgb } from '../lib/nearpairs.mjs';
+import { exemptReason } from '../lib/exempt.mjs';
+import { extraDeclarations, fontDeclarations } from '../lib/declarations.mjs';
+import { typefaceOf, GENERIC_FONTS } from '../lib/typefaces.mjs';
 
 // What this engine measures — shipped with every result, clean or not.
 export const CHECKS = [
   'hardcoded colours vs the token set',
   'near-identical colour twins',
   'off-scale spacing',
+  'off-scale radii, font sizes and shadows',
+  'typefaces outside the system',
   'arbitrary bracket values',
   'static inline style blocks',
   '!important',
@@ -60,10 +65,16 @@ function nearestToken(value, k) {
  * Validate one piece of content against the repo's knowledge.
  * @param content { text, file? } — file name decides css-vs-code mode and
  *   lets the duplicate check excuse a component's own existing file
- * @returns { findings: [{ rule, severity, line, message, fix? }], checked }
+ * @returns { findings: [{ rule, severity, line, message, fix? }], checked,
+ *   exempt? } — exempt is a sentence saying why the file was not judged
  */
 export function validateContent(content, k) {
   const { text, file = null } = content;
+  // Some files cannot be on-system by their nature. Judging them is how a
+  // checker earns its reputation for crying wolf, and a checker people
+  // distrust gets switched off. Say nothing, and say why nothing was said.
+  const exempt = exemptReason(file, text);
+  if (exempt) return { findings: [], checked: CHECKS, exempt };
   const css = file ? CSS_FILE_RE.test(file) : looksLikeCss(text);
   const got = extractStyling(text, { css });
   const findings = [];
@@ -135,6 +146,57 @@ export function validateContent(content, k) {
       'If the value repeats it is a decision: name it as a token. If it does not, use the nearest scale step.');
   }
 
+  // ---------- the other declared scales, and the typeface ----------
+  // Stylesheets only. In code these live inside class strings, where the scale
+  // is Tailwind's and the arbitrary-bracket check already covers straying off
+  // it. The rule is the guard's rule: a value the repo already declares is
+  // consistency, not a sin, and only a genuinely new one is worth saying.
+  if (css) {
+    const localExtras = new Map(), localFaces = new Map();
+    for (const d of extraDeclarations(text)) {
+      const key = `${d.kind}|${d.value}`;
+      localExtras.set(key, (localExtras.get(key) ?? 0) + 1);
+    }
+    for (const f of fontDeclarations(text)) {
+      const face = typefaceOf(f.raw);
+      if (face) localFaces.set(face, (localFaces.get(face) ?? 0) + 1);
+    }
+    const SEEN = { radii: k.radiiSeen, fontSizes: k.fontSizesSeen, shadows: k.shadowsSeen };
+
+    for (const d of extraDeclarations(text)) {
+      const seen = SEEN[d.learned] ?? new Map();
+      if (discount(seen.get(d.value), localExtras, `${d.kind}|${d.value}`) > 0) continue;
+      const near = nearestDeclared(d.value, seen);
+      const others = seen.size - (seen.has(d.value) ? 1 : 0);
+      if (others) {
+        add(`off-scale-${d.kind}`, 'violation', d.index,
+          `New one-off ${d.noun} ${d.value}. The repo already declares ${others} other ${others === 1 ? d.noun : d.plural}.`,
+          near ? `Closest value this repo already uses: ${near.value} (${near.count}x).`
+            : `It matches none of them. If it is a real decision it is a token, not a one-off.`);
+      } else {
+        add(`off-scale-${d.kind}`, 'warning', d.index,
+          `${d.value} is the first ${d.noun} this repo declares.`,
+          `Nothing to compare it against yet. Put it in the token layer so the next ${d.noun} has a scale to join.`);
+      }
+    }
+
+    for (const f of fontDeclarations(text)) {
+      const face = typefaceOf(f.raw);
+      if (!face || GENERIC_FONTS.has(face.toLowerCase())) continue;
+      if (discount(k.faceCounts?.get(face), localFaces, face) > 0) continue;
+      const declared = [...(k.faceCounts?.keys() ?? [])].filter((x) => x !== face);
+      if (declared.length) {
+        add('off-system-typeface', 'violation', f.index,
+          `New typeface ${face}. The system already declares ${declared.join(', ')}.`,
+          `Use a family the system declares, or add ${face} to the token layer before anything uses it.`);
+      } else {
+        add('off-system-typeface', 'warning', f.index,
+          `${face} is the first typeface this repo declares.`,
+          'Declare it once, in the token layer, so everything else can inherit it.');
+      }
+    }
+  }
+
   // ---------- discipline ----------
   for (const b of got.inlineBlocks) {
     add('inline-style', 'violation', b.index,
@@ -174,6 +236,23 @@ function looksLikeCss(text) {
   return !/<[A-Za-z][\w.]*[\s/>]/.test(text) && /[.#:\w[\]-]+\s*\{[^}]*:/.test(text);
 }
 
+/** Nearest value the repo already declares, for a scale that has lengths in it. */
+function nearestDeclared(value, seen) {
+  const px = toPx(value);
+  if (px === null || !seen.size) return null;
+  let best = null;
+  for (const [v, count] of seen) {
+    // the file under review is inside the scan, so the value being judged is
+    // in this map too. Pointing at itself is not advice.
+    if (v === value) continue;
+    const p = toPx(v);
+    if (p === null) continue;
+    const d = Math.abs(p - px);
+    if (!best || d < best.d) best = { value: v, count, d };
+  }
+  return best;
+}
+
 function nearestRepoSpacing(value, k) {
   const px = toPx(value);
   if (px === null || !k.spacingSeen.size) return undefined;

package/skills/roast-my-design-system/scripts/mcp/knowledge.mjs

@@ -20,6 +20,7 @@ import { harvestContext } from '../harvest/context.mjs';
 import { loadExclusions } from '../lib/exclusions.mjs';
 import { resolveWorkspaces } from '../lib/workspaces.mjs';
 import { neverImportedComponents } from '../lib/neverimported.mjs';
+import { typefaceOf } from '../lib/typefaces.mjs';
 import { hexRgb } from '../lib/nearpairs.mjs';
 
 const MAX_DEPTH = 14; // same ruler as the harvest CLI
@@ -57,6 +58,18 @@ export function loadKnowledge(root) {
   // spacing the repo already uses: raw CSS values with counts, plus whether
   // the repo styles spacing through Tailwind at all (decides what "on-scale" means)
   const spacingSeen = new Map(tokens.spacing.map((s) => [s.value, s.count]));
+
+  // the other declared scales, same shape: value → how often the repo says it.
+  // Typefaces collapse to the face itself, so "Inter" and "Inter, sans-serif"
+  // are one voice rather than two.
+  const radiiSeen = new Map((tokens.radii ?? []).map((r) => [r.value, r.count]));
+  const fontSizesSeen = new Map((tokens.fontSizes ?? []).map((f) => [f.value, f.count]));
+  const shadowsSeen = new Map((tokens.shadows ?? []).map((s) => [s.value, s.count]));
+  const faceCounts = new Map();
+  for (const f of tokens.fontFamilies ?? []) {
+    const face = typefaceOf(f.value);
+    if (face) faceCounts.set(face, (faceCounts.get(face) ?? 0) + f.count);
+  }
   const twSpacingUse = (tokens.tailwind?.spacing ?? []).reduce((sum, s) => sum + s.count, 0);
   const usesTailwind = twSpacingUse >= 20;
 
@@ -98,6 +111,10 @@ export function loadKnowledge(root) {
     tokenColors,
     tokenColorRgb: tokenColors.map((v) => ({ value: v, rgb: hexRgb(v) })).filter((t) => t.rgb),
     spacingSeen,
+    radiiSeen,
+    fontSizesSeen,
+    shadowsSeen,
+    faceCounts,
     usesTailwind,
     byName,
     canonical,

package/skills/roast-my-design-system/scripts/mcp/tools.mjs

@@ -201,7 +201,8 @@ function toPxLocal(len) {
 export function validate(k, { code, file = null } = {}) {
   if (typeof code !== 'string' || !code.trim()) return invalidInput('Send the code you are about to save (and ideally its file path).');
   if (file != null && typeof file !== 'string') return invalidInput('file is optional, but when sent it must be a repo-relative path as a string.');
-  const { findings } = validateContent({ text: code, file }, k);
+  const { findings, exempt } = validateContent({ text: code, file }, k);
+  if (exempt) return `Not judged: ${file} is exempt because ${exempt}. Nothing here was checked.`;
   if (!findings.length) return cleanResultText();
   const L = [`${findings.length} finding${findings.length === 1 ? '' : 's'}:`];
   for (const f of findings.slice(0, 12)) {
@@ -238,16 +239,21 @@ export function reviewData(k) {
   if (!changed.length) return { text: 'No changed UI or style files in the working tree. Nothing to review.', total: 0 };
 
   const perFile = [];
-  let total = 0;
+  let total = 0, exemptCount = 0;
   for (const f of changed.slice(0, 40)) {
     let text;
     try { text = readFileSync(join(gitRoot, f), 'utf8'); } catch { continue; }
     // knowledge paths are scanned-root-relative; git paths are toplevel-relative
-    const { findings } = validateContent({ text, file: relative(realRoot, join(gitRoot, f)) }, k);
+    const { findings, exempt } = validateContent({ text, file: relative(realRoot, join(gitRoot, f)) }, k);
+    if (exempt) { exemptCount++; continue; }
     if (findings.length) { perFile.push({ f, findings }); total += findings.length; }
   }
+  // Skipped is not the same as clean, and the reader is owed the difference.
+  const exemptNote = exemptCount
+    ? ` ${exemptCount} file${exemptCount === 1 ? ' was' : 's were'} left unjudged: email, print, artwork or pictures drawn with code.`
+    : '';
   if (!total) {
-    return { text: `Reviewed ${changed.length} changed file${changed.length === 1 ? '' : 's'}. ${cleanResultText()}`, total: 0 };
+    return { text: `Reviewed ${changed.length} changed file${changed.length === 1 ? '' : 's'}. ${cleanResultText()}${exemptNote}`, total: 0 };
   }
   const L = [`DESIGN SYSTEM REVIEW · ${changed.length} changed file${changed.length === 1 ? '' : 's'}, ${total} finding${total === 1 ? '' : 's'}:`];
   for (const { f, findings } of perFile.slice(0, 10)) {
@@ -256,7 +262,7 @@ export function reviewData(k) {
     if (findings.length > 6) L.push(`  (+${findings.length - 6} more in this file)`);
   }
   if (perFile.length > 10) L.push(`(+${perFile.length - 10} more files with findings)`);
-  L.push(`Checked: ${CHECKS.join(', ')}. Fix the findings before finishing; rerun roast_review to confirm.`);
+  L.push(`Checked: ${CHECKS.join(', ')}.${exemptNote} Fix the findings before finishing; rerun roast_review to confirm.`);
   return { text: L.join('\n'), total };
 }