@godxjp/ui 28.12.0 → 29.0.0

package/agent/index.json

@@ -1,21 +1,21 @@
 {
   "counts": {
     "anti-ai-tells": 26,
-    "components": 170,
-    "patterns": 19,
-    "rules": 47,
-    "tokens": 1685,
+    "components": 171,
+    "patterns": 20,
+    "rules": 50,
+    "tokens": 2070,
     "vocabulary": 14
   },
   "files": [
     {
       "file": "components-index.json",
-      "note": "45 KB — name + group + tagline for all 170. FETCH THIS FIRST, then fetch only the components you chose.",
+      "note": "45 KB — name + group + tagline for all 171. FETCH THIS FIRST, then fetch only the components you chose.",
       "url": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components-index.json"
     },
     {
       "file": "components/<Name>.json",
-      "note": "One file per component (1 KB–33 KB, median 6 KB), each carrying its importPath. This is the selective route: read the index, then fetch only what you need instead of the 1.1 MB blob.",
+      "note": "One file per component (1 KB–34 KB, median 6 KB), each carrying its importPath. This is the selective route: read the index, then fetch only what you need instead of the 1.2 MB blob.",
       "url": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components/<Name>.json"
     },
     {
@@ -48,9 +48,19 @@
   "note": "Pin to the tag that matches the @godxjp/ui version you installed. A catalog newer than your package describes props you do not have; older, and it hides props you do.",
   "read": {
     "live": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/index.json",
-    "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v28.12.0/agent/index.json"
+    "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v29.0.0/agent/index.json"
   },
-  "source": "mcp/src/data — the same data @godxjp/ui-mcp serves",
+  "source": "mcp/src/data — the same data @godxjp/ui-mcp serves — plus the foundation and semantic token tiers, read from src/tokens/*.css",
   "start": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/START-HERE.md",
-  "version": "28.12.0"
+  "tokenTiers": {
+    "component": "per-part knobs, --{component}-{part}-{property}; usually leave these alone",
+    "counts": {
+      "component": 1756,
+      "foundation": 211,
+      "semantic": 103
+    },
+    "foundation": "the seeds a consumer is invited to set — --primary, --background, --radius",
+    "semantic": "named roles that follow the seeds — --ring, --text-link, --overlay-background"
+  },
+  "version": "29.0.0"
 }

package/agent/llms.txt

@@ -1,10 +1,10 @@
 # @godxjp/ui
 
-> A Japanese-enterprise React design system: 170 components, 1685 design tokens,
-> 47 cardinal rules. This file is the entry point for AI agents. Catalog version 28.12.0.
+> A Japanese-enterprise React design system: 171 components, 2070 design tokens,
+> 50 cardinal rules. This file is the entry point for AI agents. Catalog version 29.0.0.
 
 If your client can run a process, do not read these files — run the MCP server instead
-(`npx @godxjp/ui-mcp@28.12.0`). It is searchable and version-locked. These files exist for agents
+(`npx @godxjp/ui-mcp@29.0.0`). It is searchable and version-locked. These files exist for agents
 that can only fetch URLs.
 
 ## Start
@@ -14,19 +14,19 @@ that can only fetch URLs.
 
 ## Catalog
 
-- [patterns-index.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/patterns-index.json): 19 whole-task patterns (name, tagline, tags). Start here when the task is a TASK — "build a settings page" — then fetch `patterns/<name>.json` for complete code.
-- [components-index.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components-index.json): 45 KB — all 170 components as name, group, tagline, plus `absorbed`: the names that do NOT exist and map to it (`Combobox` → `Select`).
-- [components/&lt;Name&gt;.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components/Select.json): one file per component (1 KB–33 KB, median 6 KB). Read the index, then fetch only the ones you chose — this is the selective route, and the reason you do not need the blob.
-- [components.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components.json): 1.1 MB — every entry in one file. Most URL fetchers truncate a response this size without saying so; prefer the per-component files.
-- [tokens.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json): every design token with its value and the reason it exists.
+- [patterns-index.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/patterns-index.json): 20 whole-task patterns (name, tagline, tags). Start here when the task is a TASK — "build a settings page" — then fetch `patterns/<name>.json` for complete code.
+- [components-index.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components-index.json): 45 KB — all 171 components as name, group, tagline, plus `absorbed`: the names that do NOT exist and map to it (`Combobox` → `Select`).
+- [components/&lt;Name&gt;.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components/Select.json): one file per component (1 KB–34 KB, median 6 KB). Read the index, then fetch only the ones you chose — this is the selective route, and the reason you do not need the blob.
+- [components.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/components.json): 1.2 MB — every entry in one file. Most URL fetchers truncate a response this size without saying so; prefer the per-component files.
+- [tokens.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/tokens.json): every design token with its value, the reason it exists, and its `tier` — 211 `foundation` seeds (`--primary`, `--background`, `--radius`: set these when you are handed a brand), 103 `semantic` roles, 1756 `component` knobs.
 - [vocabulary.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/vocabulary.json): the controlled prop vocabulary — which prop name means what, across every component.
-- [rules.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/rules.json): 47 cardinal rules.
+- [rules.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/rules.json): 50 cardinal rules.
 - [anti-ai-tells.json](https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/anti-ai-tells.json): 26 shapes that make generated UI look generated, each with its fix.
 
 ## Pinning
 
 Every URL above tracks `main`. To pin to the release a project actually installed, swap `main` for
-the tag: `.../godx-jp/godxjp-ui/v28.12.0/agent/...`. A catalog that does not match the installed
+the tag: `.../godx-jp/godxjp-ui/v29.0.0/agent/...`. A catalog that does not match the installed
 package describes props that are absent, or hides props that are present, and says nothing either way.
 
 Pinned catalogs only exist for releases whose tag actually contains `agent/`. If `…/v<version>/agent/index.json` returns 404, that release predates this catalog: read `…/main/…` instead and compare `index.json` → `version` against the package you have, so you at least know which way it drifted.

package/agent/patterns/tenant-brand-color.json

@@ -0,0 +1,28 @@
+{
+  "aliases": [
+    "tenanttheme",
+    "customer-brand-color",
+    "runtime-theme",
+    "brand-color"
+  ],
+  "code": "// ─────────────────────────────────────────────────────────────────────────\n// A CUSTOMER's brand colour, at runtime, on ONE region. gh#861 / gh#868.\n//\n// The colour arrives as DATA (a hex an admin picked in your settings screen),\n// not as a stylesheet you author. AppSettingPicker `brand` is an ENUM PRESET\n// (brand|crm|logistics|partner|slate|dxs) and cannot take an arbitrary hex.\n//\n// ❌ DON'T hand-roll the conversion or the label. Two consumer repos each wrote\n//    their own 18-line hexToHslChannels and their own contrast rule; a wrong\n//    label makes nothing red — the text is just hard to read, for end users only.\n// ❌ DON'T set --primary alone. It does not travel alone: --primary-foreground\n//    does NOT follow it, and --ring is bound at :root where it FREEZES.\n// ✅ DO ask the package for the declarations.\n\nimport { tenantTheme, contrastRatio, hexToHsl } from \"@godxjp/ui/app\";\n\nconst brand = tenantTheme(tenant.primary_color);      // \"#0071bd\" · 3- or 6-digit\n\n<div data-tenant={tenant.slug} style={brand.vars}>    // a REGION, not <html>\n  <Topbar … />\n  <Button>Open app</Button>                            {/* rest, hover AND pressed follow */}\n</div>\n\n// brand.vars is exactly eight declarations:\n//   --primary  --primary-foreground  --ring  --primary-hover  --primary-active\n//   --text-link  --text-brand  --text-primary        ← the brand as INK (gh#887)\n// An unusable hex yields EMPTY vars, so the region falls back to your own theme\n// instead of breaking the page (same contract ColorPicker already has).\n\n// THE LABEL IS CHOSEN BY CONTRAST, and the ratio is reported so you can check it.\n// WCAG 2.2 SC 1.4.3, normal text, 4.5:1. White/black pivot at relative luminance\n// 0.179; both candidates measure 4.58:1 there, so the winner ALWAYS clears AA.\n//   #FFD400 → #000000 at 14.67:1   (\"always white\" would have been 1.29:1)\n//   #0A1F44 → #ffffff at 16.25:1\nbrand.foreground  // \"#ffffff\"\nbrand.contrast    // 5.13\nbrand.meetsAA     // true\n\n// ALREADY COMPUTED THE PAIR SERVER-SIDE? Pass it. It is used AS GIVEN — never\n// silently replaced — and the result still reports what it achieves.\nconst supplied = tenantTheme(hex, { foreground: tenant.theme_tokens.foreground });\nif (!supplied.meetsAA) {\n  // supplied.contrast is the number. The API says NO instead of returning white.\n}\n\n// NESTED TENANTS on one page: call it per region. Each region carries its own\n// pair, so nothing freezes from the region above it.\n\n// THE BRAND AS INK IS ALSO FLOORED (gh#887) — it used not to be, and that is the\n// half of the contract a consumer used to have to write. --primary is guaranteed\n// against --primary-foreground: a FILL and its label. Nothing guaranteed the same\n// colour as TEXT on a page surface, and a sidebar active item, a NavList item, a\n// MegaMenu trigger, an Anchor link, `Text link` and `Button variant=\"link\"` all do\n// exactly that. Measured on /showcase/theme-lab: #FFD400 gave 1.18–2.06:1.\n// So the three inks come back as LITERALS, each walked away from the surface until\n// the painted pixel clears 4.5:1 and no further — a seed whose ramp step already\n// clears is untouched. No call site of yours changes; the roles were always read.\n//   #FFD400  link ink 1.73:1 → 4.56:1     #E2564A  3.80:1 → 4.53:1\n//   #7C3AED / #2563EB / #0A1F44           byte-identical, they already cleared\n\n// WHICH SURFACE? The DARKEST one the ink lands on — the default is --accent\n// (#ebe9e5), not --background, because an ink clamped on the canvas measures\n// 3.78:1 the moment the row under it is hovered. Pass your own when the region is\n// darker than the package light theme, and ALWAYS for a region inside a dark theme\n// (--accent there is #3c3a34) or the ink is walked the wrong way:\nconst darkRegion = tenantTheme(tenant.primary_color, { surface: \"#3c3a34\" });\n\n// Still your call whether the raw seed is usable as ink somewhere the library does\n// not paint — contrastRatio is the same arithmetic, exported:\nif ((contrastRatio(tenant.primary_color, \"#ffffff\") ?? 0) >= 4.5) {\n  // …the seed ITSELF, unclamped, on a white page\n}\n\n// The raw conversion, if you need it on its own (the inverse of hslToHex):\nhexToHsl(\"#0071bd\");   // \"204.13 100% 37.06%\"\n\n// Worked screen: /showcase/tenant-brand-color · docs/CUSTOMER-THEMING.md\n// Why there is no <TenantTheme> component: docs/COMPOSITION-VS-COMPONENT.md §3.2\n",
+  "name": "tenant-brand-color",
+  "tagline": "Wear a CUSTOMER's own hex at runtime, scoped to one region — tenantTheme(hex) returns the token declarations plus the WCAG 2.2 AA label, so you never hand-roll hex→HSL or guess a foreground. There is no <TenantTheme> component and there should not be one.",
+  "tags": [
+    "theme",
+    "tenant",
+    "multi-tenant",
+    "brand",
+    "color",
+    "colour",
+    "contrast",
+    "wcag",
+    "a11y",
+    "runtime",
+    "scoped",
+    "hex",
+    "hsl",
+    "white-label",
+    "launcher"
+  ]
+}

package/agent/patterns-index.json

@@ -319,5 +319,32 @@
       "account",
       "chip"
     ]
+  },
+  {
+    "aliases": [
+      "tenanttheme",
+      "customer-brand-color",
+      "runtime-theme",
+      "brand-color"
+    ],
+    "name": "tenant-brand-color",
+    "tagline": "Wear a CUSTOMER's own hex at runtime, scoped to one region — tenantTheme(hex) returns the token declarations plus the WCAG 2.2 AA label, so you never hand-roll hex→HSL or guess a foreground. There is no <TenantTheme> component and there should not be one.",
+    "tags": [
+      "theme",
+      "tenant",
+      "multi-tenant",
+      "brand",
+      "color",
+      "colour",
+      "contrast",
+      "wcag",
+      "a11y",
+      "runtime",
+      "scoped",
+      "hex",
+      "hsl",
+      "white-label",
+      "launcher"
+    ]
   }
 ]

package/agent/patterns.json

@@ -338,5 +338,33 @@
       "account",
       "chip"
     ]
+  },
+  {
+    "aliases": [
+      "tenanttheme",
+      "customer-brand-color",
+      "runtime-theme",
+      "brand-color"
+    ],
+    "code": "// ─────────────────────────────────────────────────────────────────────────\n// A CUSTOMER's brand colour, at runtime, on ONE region. gh#861 / gh#868.\n//\n// The colour arrives as DATA (a hex an admin picked in your settings screen),\n// not as a stylesheet you author. AppSettingPicker `brand` is an ENUM PRESET\n// (brand|crm|logistics|partner|slate|dxs) and cannot take an arbitrary hex.\n//\n// ❌ DON'T hand-roll the conversion or the label. Two consumer repos each wrote\n//    their own 18-line hexToHslChannels and their own contrast rule; a wrong\n//    label makes nothing red — the text is just hard to read, for end users only.\n// ❌ DON'T set --primary alone. It does not travel alone: --primary-foreground\n//    does NOT follow it, and --ring is bound at :root where it FREEZES.\n// ✅ DO ask the package for the declarations.\n\nimport { tenantTheme, contrastRatio, hexToHsl } from \"@godxjp/ui/app\";\n\nconst brand = tenantTheme(tenant.primary_color);      // \"#0071bd\" · 3- or 6-digit\n\n<div data-tenant={tenant.slug} style={brand.vars}>    // a REGION, not <html>\n  <Topbar … />\n  <Button>Open app</Button>                            {/* rest, hover AND pressed follow */}\n</div>\n\n// brand.vars is exactly eight declarations:\n//   --primary  --primary-foreground  --ring  --primary-hover  --primary-active\n//   --text-link  --text-brand  --text-primary        ← the brand as INK (gh#887)\n// An unusable hex yields EMPTY vars, so the region falls back to your own theme\n// instead of breaking the page (same contract ColorPicker already has).\n\n// THE LABEL IS CHOSEN BY CONTRAST, and the ratio is reported so you can check it.\n// WCAG 2.2 SC 1.4.3, normal text, 4.5:1. White/black pivot at relative luminance\n// 0.179; both candidates measure 4.58:1 there, so the winner ALWAYS clears AA.\n//   #FFD400 → #000000 at 14.67:1   (\"always white\" would have been 1.29:1)\n//   #0A1F44 → #ffffff at 16.25:1\nbrand.foreground  // \"#ffffff\"\nbrand.contrast    // 5.13\nbrand.meetsAA     // true\n\n// ALREADY COMPUTED THE PAIR SERVER-SIDE? Pass it. It is used AS GIVEN — never\n// silently replaced — and the result still reports what it achieves.\nconst supplied = tenantTheme(hex, { foreground: tenant.theme_tokens.foreground });\nif (!supplied.meetsAA) {\n  // supplied.contrast is the number. The API says NO instead of returning white.\n}\n\n// NESTED TENANTS on one page: call it per region. Each region carries its own\n// pair, so nothing freezes from the region above it.\n\n// THE BRAND AS INK IS ALSO FLOORED (gh#887) — it used not to be, and that is the\n// half of the contract a consumer used to have to write. --primary is guaranteed\n// against --primary-foreground: a FILL and its label. Nothing guaranteed the same\n// colour as TEXT on a page surface, and a sidebar active item, a NavList item, a\n// MegaMenu trigger, an Anchor link, `Text link` and `Button variant=\"link\"` all do\n// exactly that. Measured on /showcase/theme-lab: #FFD400 gave 1.18–2.06:1.\n// So the three inks come back as LITERALS, each walked away from the surface until\n// the painted pixel clears 4.5:1 and no further — a seed whose ramp step already\n// clears is untouched. No call site of yours changes; the roles were always read.\n//   #FFD400  link ink 1.73:1 → 4.56:1     #E2564A  3.80:1 → 4.53:1\n//   #7C3AED / #2563EB / #0A1F44           byte-identical, they already cleared\n\n// WHICH SURFACE? The DARKEST one the ink lands on — the default is --accent\n// (#ebe9e5), not --background, because an ink clamped on the canvas measures\n// 3.78:1 the moment the row under it is hovered. Pass your own when the region is\n// darker than the package light theme, and ALWAYS for a region inside a dark theme\n// (--accent there is #3c3a34) or the ink is walked the wrong way:\nconst darkRegion = tenantTheme(tenant.primary_color, { surface: \"#3c3a34\" });\n\n// Still your call whether the raw seed is usable as ink somewhere the library does\n// not paint — contrastRatio is the same arithmetic, exported:\nif ((contrastRatio(tenant.primary_color, \"#ffffff\") ?? 0) >= 4.5) {\n  // …the seed ITSELF, unclamped, on a white page\n}\n\n// The raw conversion, if you need it on its own (the inverse of hslToHex):\nhexToHsl(\"#0071bd\");   // \"204.13 100% 37.06%\"\n\n// Worked screen: /showcase/tenant-brand-color · docs/CUSTOMER-THEMING.md\n// Why there is no <TenantTheme> component: docs/COMPOSITION-VS-COMPONENT.md §3.2\n",
+    "name": "tenant-brand-color",
+    "tagline": "Wear a CUSTOMER's own hex at runtime, scoped to one region — tenantTheme(hex) returns the token declarations plus the WCAG 2.2 AA label, so you never hand-roll hex→HSL or guess a foreground. There is no <TenantTheme> component and there should not be one.",
+    "tags": [
+      "theme",
+      "tenant",
+      "multi-tenant",
+      "brand",
+      "color",
+      "colour",
+      "contrast",
+      "wcag",
+      "a11y",
+      "runtime",
+      "scoped",
+      "hex",
+      "hsl",
+      "white-label",
+      "launcher"
+    ]
   }
 ]

package/agent/rules.json

@@ -233,5 +233,20 @@
     "body": "Every rule this package ships is inside a cascade layer, and layer order beats specificity outright. Two consequences. (1) INSIDE the package: `@layer components` is EARLIER than Tailwind's `utilities`, so a utility a component emits on its own element (`<table class=\"text-sm\">`) silently outranks the component rule meant to own that property — no selector can win. A responsive re-point that must beat such a utility goes in `@layer godxjp-ui-responsive`, declared after Tailwind in `styles/base.css` and therefore LAST; it is reserved for `@container`/`@media` re-points, never static rules.",
     "number": 47,
     "title": "The layer contract — cascade layers, not specificity"
+  },
+  {
+    "body": "A colour token holds EITHER bare HSL components (`--card: 60 33% 99%`, read as `hsl(var(--card))`) OR a complete CSS colour (`--card-tint: hsl(var(--primary) / 4%)`, read as `var(--card-tint)`). The NAME does not tell you which, and neither does the tier: `--menu-item-hover-background` / `--tree-node-hover-background` / `--table-row-hover-background` take a complete colour while `--segmented-item-hover-background` / `--topbar-item-hover-background` take components — five knobs for the same hover fill, all defaulting to `--accent`. Measured: 346 published tokens hold a colour, 96 components / 249 complete, and 3 say which. SET THE WRONG FORM AND NOTHING SAYS SO: the declaration is invalid at computed-value time, the property takes its own INITIAL value (`transparent` for a background) and the call-site fallback is NOT used — so the surface shows what is behind it and reads exactly like a knob that does not work (a table header measured 1.03:1 this way). The tell in DevTools: the custom property holds what you wrote and the painted property is `rgba(0, 0, 0, 0)`. To check a knob: `grep -rho 'hsl(var(--NAME\\|var(--NAME' node_modules/@godxjp/ui/dist` — `hsl(var(--NAME` means components, bare `var(--NAME` means complete. Grep `dist` whole: some knobs are read from a component's JS, not its CSS. SUB-TRAP: a components role may carry an alpha (`--card: 0 0% 100% / 42%` is how a glass theme works) but 83 declarations across 15 roles apply their OWN alpha (`hsl(var(--accent) / 0.7)`), and a second `/` is a parse error → transparent. `--primary`, `--muted`, `--destructive`, `--warning`, `--success`, `--info`, `--accent`, `--foreground`, `--muted-foreground`, `--table-row-tone-color`, `--background`, `--destructive-foreground`, `--secondary`, `--accent-foreground`, `--ring` all have at least one such reader; `--card` and `--popover` have none. docs/CUSTOMER-THEMING.md \"Building a COMPLEX theme\" §1.",
+    "number": 48,
+    "title": "Two token value forms — read the call site before you set a colour"
+  },
+  {
+    "body": "Hover, active, selected, checked, pressed and focus are their own tokens: 95 published (`node -e \"const t=require('./node_modules/@godxjp/ui/agent/tokens.json'); console.log(t.filter(x => /-(hover|active|selected|checked|pressed|focus)(-|$)/.test(x.name)).length)\"`), 62 of which paint a colour, an edge or an elevation. A theme that re-materialises a surface and sets only its RESTING fill ships every other state broken, and each defect is reported from a screenshot rather than by a gate: a sidebar row at dark-violet-on-violet (`--sidebar-item-active-foreground` defaults to the live `--primary-active`, src/styles/shell-layout.css:2289-2291), a Segmented hover with a dark fill under dark text (`--segmented-item-hover-background` set without `--segmented-item-hover-color`), a Topbar hover block. `--focus-ring-color` is on that list and a ring that fails 3:1 on its new ground is a WCAG 2.2 SC 1.4.11 defect, not a polish item. THE METHOD: for every component you re-theme, list its tokens (`get_component`, or `grep -- \"--<component>-\" node_modules/@godxjp/ui/dist/tokens/components/`) and set the state rows at the same time as the resting row. A state knob left at its default resolves against the LIVE role at the painting element — the correct default, and exactly why it can be wrong for you once `--accent` is no longer pale.",
+    "number": 49,
+    "title": "Interaction states are 95 separate tokens — resting state is not one of them"
+  },
+  {
+    "body": "`src/styles/base.css:261` sets `color: hsl(var(--foreground))` on `body`, which is above every scope a consumer can make, so that `var()` substitutes against the ROOT's `--foreground` exactly once and every element below inherits the already-resolved colour. A plain `<div>` carrying a theme's tokens therefore retints every SURFACE and no TEXT: measured, a title whose own computed `--foreground` was the theme's near-white still painted `rgb(36, 35, 30)`, 1.34:1 on real pixels, with every element reporting it was inside the scope (gh#881). It is the §3 freeze rule applied to a PROPERTY instead of a token, and worse there — a token can be given a knob and `color` on `body` cannot. FIX, React: wrap the region in `ThemeScope` (`@godxjp/ui/app`), which re-states `color` on its own element (src/lib/overlay-portal.tsx:270, `display: contents` so the box goes and the inheritance stays) AND on the body-level host it creates for portalled overlays (:203) — the other half, since a Dialog portals to `document.body` and would otherwise wear the root's theme. FIX, stylesheet-only scope: declare `color: hsl(var(--foreground))` on your own selector alongside the tokens; that is your element, not a selector into this package, so cardinal rule \"a consumer sets tokens, never selectors\" permits it — but it does NOT reach portalled overlays. docs/TOKEN-RESOLUTION.md §5 rule 7.",
+    "number": 50,
+    "title": "A scoped theme must state its own `color`"
   }
 ]