@medquantis/design-system 1.4.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -18,7 +18,7 @@ The single source of the MedQuantis visual identity: design tokens, shared CSS,
18
18
  | `icons/lucide.min.js` | A pinned Lucide build (version and hash in `icons/manifest.json`) |
19
19
  | `brand/` | Monogram, favicon set and wordmark: `wordmark-on-light` and `wordmark-on-navy`, live text for screen and `-print` with outlined text |
20
20
  | `guidelines/` | Brand, voice, colour, typography, chart, data and accessibility rules, and the app patterns of dense internal tools |
21
- | `kit-manifest.json`, `dist/kit/` | The homemade-claude-kit delivery-comms renderers (contract 2.1.0): the manifest declares ten modules, each a file in `dist/kit/` (see Using it from the delivery-comms kit) |
21
+ | `kit-manifest.json`, `dist/kit/` | The homemade-claude-kit delivery-comms renderers (contract 2.2.0): the manifest declares ten modules, each a file in `dist/kit/` (see Using it from the delivery-comms kit) |
22
22
  | `dist/DESIGN.md` | Tools and agents outside the kit: the tokens as [Google DESIGN.md](https://github.com/google-labs-code/design.md) front matter, then the guidelines as prose |
23
23
  | `dist/llms.txt`, `dist/llms-full.txt` | The guidelines and the token list for language models ([llmstxt.org](https://llmstxt.org/) format), generated from `guidelines/` and the tokens |
24
24
  | `plugins/medquantis-design-system/` | The Claude skill, as a Claude Code plugin and as a zip for claude.ai (see Claude skill) |
@@ -150,7 +150,7 @@ python3 <skill-dir>/scripts/design_system.py point @medquantis/design-system@1.2
150
150
 
151
151
  In the kit's words this is `ux-design-system point @medquantis/design-system@1.2.0`. It writes the pin to `docs/ux/package.json`, checks the package's `kit-manifest.json` through the kit resolver and prints the Dependabot entry (`directory: "/docs/ux"`) that turns later releases into pull requests. Change the pin only with `point`, never by hand, and never add a `docs/ux/tokens.css`. Each render writes `<output>.provenance.json`, which names the module each value came from.
152
152
 
153
- The kit modules of 1.2.0 need delivery-comms 2.1.0 or later: the manifest declares contract 2.1.0 and the `dark` module, and a 2.0 kit refuses the unknown `dark` module. A project on a 2.0 kit updates the kit before it points at 1.2.0, or stays on 1.1.0.
153
+ The kit modules of 1.2.0 need delivery-comms 2.1.0 or later: the manifest declares contract 2.1.0 and the `dark` module, and a 2.0 kit refuses the unknown `dark` module. A project on a 2.0 kit updates the kit before it points at 1.2.0, or stays on 1.1.0. From the release that adds the brand ground (owner ruling 22), the manifest declares contract 2.2.0 and the kit modules need delivery-comms 2.2.0 or later; a 2.1 kit refuses the newer contract.
154
154
 
155
155
  `kit-manifest.json`, at the top of the package, declares all ten modules of the contract, so the kit's base theme fills none of them:
156
156
 
package/dist/DESIGN.md CHANGED
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  name: MedQuantis
3
- description: The MedQuantis design system 1.4.0. Generated from tokens/ and guidelines/ by the design-system build. Do not edit. Names are the homemade-claude-kit role names where the kit has a role, else the tokens.css name without --mq-; the tables below map each to its --mq-* token.
3
+ description: The MedQuantis design system 1.6.0. Generated from tokens/ and guidelines/ by the design-system build. Do not edit. Names are the homemade-claude-kit role names where the kit has a role, else the tokens.css name without --mq-; the tables below map each to its --mq-* token.
4
4
  colors:
5
5
  primary: "{colors.accent}"
6
6
  ink: "#1a1a1a"
@@ -34,6 +34,8 @@ colors:
34
34
  border-strong: "#5d6f91"
35
35
  panel-start: "#0f2a5e"
36
36
  panel-end: "#0a2047"
37
+ brand-ground-start: "#0f2a5e"
38
+ brand-ground-end: "#0a2047"
37
39
  on-navy-title: "#ffffff"
38
40
  on-navy-secondary: rgba(255, 255, 255, 0.68)
39
41
  on-navy-second-level: "#c3cbdc"
@@ -54,6 +56,8 @@ colors:
54
56
  app-cat-blue: "#3a8ff5"
55
57
  app-cat-violet: "#5a2fbe"
56
58
  app-cat-teal: "#178a91"
59
+ app-cat-indigo: "#4a5aa8"
60
+ app-cat-rose: "#b71c5a"
57
61
  change-added: "#1c7e3f"
58
62
  change-modified: "#d78000"
59
63
  change-modified-text: "#a35f00"
@@ -140,7 +144,7 @@ spacing:
140
144
 
141
145
  # MedQuantis design
142
146
 
143
- Generated from tokens/ and guidelines/ by the build of @medquantis/design-system 1.4.0. Do not edit. Each section opens with a table that maps the front matter names to the --mq-* custom properties of tokens.css, the names the guideline text uses; the rules are the MedQuantis guidelines, section by section.
147
+ Generated from tokens/ and guidelines/ by the build of @medquantis/design-system 1.6.0. Do not edit. Each section opens with a table that maps the front matter names to the --mq-* custom properties of tokens.css, the names the guideline text uses; the rules are the MedQuantis guidelines, section by section.
144
148
 
145
149
  ## Overview
146
150
 
@@ -274,6 +278,8 @@ Markdown is written one line per paragraph or list item, never hard-wrapped at a
274
278
  | `colors.border-strong` | `--mq-border-strong` | `#5d6f91` |
275
279
  | `colors.panel-start` | `--mq-panel-start` | `#0f2a5e` |
276
280
  | `colors.panel-end` | `--mq-panel-end` | `#0a2047` |
281
+ | `colors.brand-ground-start` | `--mq-brand-ground-start` | `#0f2a5e` |
282
+ | `colors.brand-ground-end` | `--mq-brand-ground-end` | `#0a2047` |
277
283
  | `colors.on-navy-title` | `--mq-on-navy-title` | `#ffffff` |
278
284
  | `colors.on-navy-secondary` | `--mq-on-navy-secondary` | `rgba(255, 255, 255, 0.68)` |
279
285
  | `colors.on-navy-second-level` | `--mq-on-navy-second-level` | `#c3cbdc` |
@@ -294,6 +300,8 @@ Markdown is written one line per paragraph or list item, never hard-wrapped at a
294
300
  | `colors.app-cat-blue` | `--mq-app-cat-blue` | `#3a8ff5` |
295
301
  | `colors.app-cat-violet` | `--mq-app-cat-violet` | `#5a2fbe` |
296
302
  | `colors.app-cat-teal` | `--mq-app-cat-teal` | `#178a91` |
303
+ | `colors.app-cat-indigo` | `--mq-app-cat-indigo` | `#4a5aa8` |
304
+ | `colors.app-cat-rose` | `--mq-app-cat-rose` | `#b71c5a` |
297
305
  | `colors.change-added` | `--mq-change-added` | `#1c7e3f` |
298
306
  | `colors.change-modified` | `--mq-change-modified` | `#d78000` |
299
307
  | `colors.change-modified-text` | `--mq-change-modified-text` | `#a35f00` |
@@ -438,7 +446,7 @@ Every status colour comes with an icon or a word (WCAG 1.4.1):
438
446
  - a flag is a coloured word, and only on the rows that need attention, so normal rows stay quiet;
439
447
  - light badge backgrounds come from the 50 and 100 steps of the status scales in `dist/tailwind.css`, never a hand-picked tint.
440
448
 
441
- The red of the old Paracel theme survives only as `--mq-danger` (ADR-0003). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in charts (ADR-0008). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them (specialising).
449
+ The red of the old Paracel theme survives only as `--mq-danger` (ADR-0003). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in charts (ADR-0008, ADR-0010). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them (specialising).
442
450
 
443
451
  ### Colour: Chart colours
444
452
 
@@ -476,6 +484,8 @@ Every ratio below is the WCAG 2.x contrast with the dark values, on the dark can
476
484
  | `--mq-focus-ring-color` | `#9fb3e8`, the light navy | Focus ring on dark backgrounds | 8.71:1 on canvas |
477
485
  | `--mq-panel-start` | `#2f4c8f` | Light end of the navy panel gradient | Background, white 8.23:1 on the panel start |
478
486
  | `--mq-panel-end` | `#0f2a5e` | Dark end of the navy panel gradient | Background |
487
+ | `--mq-brand-ground-start` | `#0f2a5e`, the same in light | Light end of the brand ground: the cover, closing slide and section dividers of a dark deck (owner ruling 22) | Background |
488
+ | `--mq-brand-ground-end` | `#0a2047`, the same in light | Dark end of the brand ground (owner ruling 22) | Background |
479
489
  | `--mq-shadow-panel` | a 1 px outline, light navy at 35 %, no glow (owner ruling 13) | Navy panels, the report header and the navy KPI tile on dark | Edge of a panel |
480
490
  | `--mq-shadow-edge` | the same 1 px outline, light navy at 35 %; none in light | The monogram (`mq-monogram`), the navy KPI tile and a navy brand or app tile, which draw no shadow in light (owner ruling 14) | Edge of a navy mark |
481
491
  | `--mq-shadow-live` | a 3 px ring of the dark success green `#6fbf73` at 17 %; in light the success green at 17 % | Apps only: the halo of a live dot, the row in force on a timeline (app patterns) | Decorative |
@@ -486,6 +496,8 @@ Accent text on the pale fills reads `--mq-accent-highlight` in both themes (owne
486
496
 
487
497
  The retired `--mq-dim` and `--mq-accent-on-dark` follow the roles they alias on dark too: `#8f98aa` (tertiary) and `#b2c2ed` (the on-navy accent).
488
498
 
499
+ **The brand ground.** The cover, the closing slide and the section dividers of a deck sit on the deep navy of the MedQuantis title pages, a 160 degree gradient from `--mq-brand-ground-start` to `--mq-brand-ground-end`, never on the near-black canvas (owner ruling 22). A brand slide is always a dark slide: its text takes the dark roles, checked against the lighter stop (ink 12.62:1, muted 8.52:1, tertiary 4.78:1, the accent highlight 6.67:1). A slide built with the homemade-claude-kit takes it with `dark brand` on its root.
500
+
489
501
  **The navy panel on dark.** Navy itself fails on a dark canvas (`#0a2463` is 1.25:1 on `#11161f`), so on dark the brand shows as the lifted navy, the light navy and the panel gradient, with no new hue (ADR-0003). Navy panels, the report header and the navy KPI tile keep the 160 degree gradient between `--mq-panel-start` and `--mq-panel-end`, with the dark values above, and draw `--mq-shadow-panel`: a 1 px light-navy outline, never a glow (owner ruling 13). A navy tile on dark takes the panel gradient, never the lifted accent. Contrast on navy is still checked against the panel start, the lighter stop.
490
502
 
491
503
  The on-navy tier on the dark panel (owner ruling 19): two roles take dark values, the others keep their light values and are checked again on the lighter dark panel start.
@@ -564,7 +576,7 @@ Rules:
564
576
 
565
577
  ### Charts: App categorical palette (apps only)
566
578
 
567
- Six hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, ADR-0008). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
579
+ Eight hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, ADR-0008). The indigo and the rose were added for the parts of a rule row (owner ruling of 2026-11-15, ADR-0010). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
568
580
 
569
581
  | Token | Value | Contrast on surface | Allowed for |
570
582
  | :-- | :-- | :-- | :-- |
@@ -575,6 +587,8 @@ Six hues for interactive apps whose charts or lists show more categories than th
575
587
  | `--mq-app-cat-blue` | `#3a8ff5` | 3.27:1 | Marks and fills only |
576
588
  | `--mq-app-cat-violet` | `#5a2fbe` | 8.12:1 | Marks, fills and text |
577
589
  | `--mq-app-cat-teal` | `#178a91` | 4.13:1 | Marks and fills only |
590
+ | `--mq-app-cat-indigo` | `#4a5aa8` | 6.33:1 | Marks, fills and text |
591
+ | `--mq-app-cat-rose` | `#b71c5a` | 6.31:1 | Marks, fills and text |
578
592
 
579
593
  | Change type | Token | Reads |
580
594
  | :-- | :-- | :-- |
@@ -582,15 +596,24 @@ Six hues for interactive apps whose charts or lists show more categories than th
582
596
  | Modified | `--mq-change-modified`; its text `--mq-change-modified-text` | The orange; the orange text |
583
597
  | Removed | `--mq-change-removed` | The vermillion |
584
598
 
585
- Between the six hues and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors.
599
+ Between the six hues of ADR-0008 and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors. The indigo and the rose stay out of that set: the indigo sits 13.7 from the violet, so they are not added to a many-category chart beside it.
600
+
601
+ | Rule row part | Token |
602
+ | :-- | :-- |
603
+ | The condition (when the rule applies) | `--mq-app-cat-indigo` |
604
+ | What is paid | `--mq-app-cat-orange-text` |
605
+ | How much | `--mq-app-cat-rose` |
606
+ | The rule's own quoted text | `--mq-tertiary` |
607
+
608
+ The three part hues and the tertiary grey stay apart by CIEDE2000 24.0 under normal vision, 15.1 under protanopia, 9.8 under deuteranopia (rose and grey) and 8.9 under tritanopia (orange text and rose); the token test holds 15, 10, 9 and 8. The indigo and the rose share their lightness, so each part also carries its label.
586
609
 
587
610
  Rules:
588
611
 
589
612
  - A one-series chart stays navy (`--mq-chart-series-1`). Up to four series, the ordered palette applies in apps too; the categorical hues are for charts of five or more categories and for data categories.
590
613
  - Fix each hue to its category across every view of the app; never let a charting library rotate through the palette.
591
- - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue.
614
+ - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue. The indigo sits 8.5 from `--mq-info` and the rose 17.4 from `--mq-danger`, under the same rule.
592
615
  - Marks sit on the surface (`--mq-surface`), where every hue meets 3:1 and needs no outline. On the canvas the orange falls to 2.88:1, and on the recessed surface the orange and the blue fall below 3:1, so a chart in these hues sits in a white card.
593
- - Text in a hue meets 4.5:1: the green, the vermillion and the violet may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
616
+ - Text in a hue meets 4.5:1: the green, the vermillion, the violet, the indigo and the rose may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
594
617
  - Never colour alone: the green and the vermillion have almost the same lightness, so in greyscale they cannot be told apart. Every mark carries a direct label or a legend entry, and a change type its sign (+, −) or its word; label the green and the teal directly where they touch.
595
618
  - A change type keeps its hue wherever a change is listed (badge, dot, filter, count) and keeps its mark style on top: an added value with +, a removed value struck through.
596
619
 
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis values for the brand module of the homemade-claude-kit design contract 2.1.0,
3
+ * MedQuantis values for the brand module of the homemade-claude-kit design contract 2.2.0,
4
4
  * generated from tokens/kit/ by the design-system build. Do not edit. kit-manifest.json lists it.
5
5
  * For kit renderers only: the unprefixed names collide with app and Tailwind variables.
6
6
  */
package/dist/kit/core.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis values for the core module of the homemade-claude-kit design contract 2.1.0,
3
+ * MedQuantis values for the core module of the homemade-claude-kit design contract 2.2.0,
4
4
  * generated from tokens/kit/ by the design-system build. Do not edit. kit-manifest.json lists it.
5
5
  * For kit renderers only: the unprefixed names collide with app and Tailwind variables.
6
6
  */
package/dist/kit/dark.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis dark module of the homemade-claude-kit design contract 2.1.0. The roles are
3
+ * MedQuantis dark module of the homemade-claude-kit design contract 2.2.0. The roles are
4
4
  * generated from tokens/kit/ by the design-system build, resolved in the dark theme (ADR-0007),
5
5
  * on :root only; the kit's own dark layer remaps the light roles to them on a dark slide or page
6
6
  * and draws the dark, dark-key and dark-accent classes. Do not edit this file. kit-manifest.json
@@ -35,9 +35,11 @@
35
35
  --dark-print-bg: #11161f;
36
36
  --dark-key-base: #2f4c8f;
37
37
  --dark-accent-text: #9fb3e8;
38
+ --dark-brand-base: #0f2a5e;
38
39
  --dark-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.4);
39
40
  --dark-key-edge: 0px 0px 0px 1px rgba(159, 179, 232, 0.35);
40
41
  --dark-key-fill: linear-gradient(160deg, #2f4c8f 0%, #0f2a5e 100%);
42
+ --dark-brand-bg: linear-gradient(160deg, #0f2a5e 0%, #0a2047 100%);
41
43
  }
42
44
 
43
45
  /*
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis values for the dataviz module of the homemade-claude-kit design contract 2.1.0,
3
+ * MedQuantis values for the dataviz module of the homemade-claude-kit design contract 2.2.0,
4
4
  * generated from tokens/kit/ by the design-system build. Do not edit. kit-manifest.json lists it.
5
5
  * For kit renderers only: the unprefixed names collide with app and Tailwind variables.
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis document module of the homemade-claude-kit design contract 2.1.0. The roles are
3
+ * MedQuantis document module of the homemade-claude-kit design contract 2.2.0. The roles are
4
4
  * generated from tokens/kit/ by the design-system build; the class rules after them are copied
5
5
  * from css/kit/document.css, written by hand against contract roles. Do not edit this file.
6
6
  * kit-manifest.json lists it. For kit renderers only: the unprefixed names collide with app and
@@ -281,6 +281,8 @@ Every ratio below is the WCAG 2.x contrast with the dark values, on the dark can
281
281
  | `--mq-focus-ring-color` | `#9fb3e8`, the light navy | Focus ring on dark backgrounds | 8.71:1 on canvas |
282
282
  | `--mq-panel-start` | `#2f4c8f` | Light end of the navy panel gradient | Background, white 8.23:1 on the panel start |
283
283
  | `--mq-panel-end` | `#0f2a5e` | Dark end of the navy panel gradient | Background |
284
+ | `--mq-brand-ground-start` | `#0f2a5e`, the same in light | Light end of the brand ground: the cover, closing slide and section dividers of a dark deck (owner ruling 22) | Background |
285
+ | `--mq-brand-ground-end` | `#0a2047`, the same in light | Dark end of the brand ground (owner ruling 22) | Background |
284
286
  | `--mq-shadow-panel` | a 1 px outline, light navy at 35 %, no glow (owner ruling 13) | Navy panels, the report header and the navy KPI tile on dark | Edge of a panel |
285
287
  | `--mq-shadow-edge` | the same 1 px outline, light navy at 35 %; none in light | The monogram (`mq-monogram`), the navy KPI tile and a navy brand or app tile, which draw no shadow in light (owner ruling 14) | Edge of a navy mark |
286
288
  | `--mq-shadow-live` | a 3 px ring of the dark success green `#6fbf73` at 17 %; in light the success green at 17 % | Apps only: the halo of a live dot, the row in force on a timeline (app patterns) | Decorative |
@@ -291,6 +293,8 @@ Accent text on the pale fills reads `--mq-accent-highlight` in both themes (owne
291
293
 
292
294
  The retired `--mq-dim` and `--mq-accent-on-dark` follow the roles they alias on dark too: `#8f98aa` (tertiary) and `#b2c2ed` (the on-navy accent).
293
295
 
296
+ **The brand ground.** The cover, the closing slide and the section dividers of a deck sit on the deep navy of the MedQuantis title pages, a 160 degree gradient from `--mq-brand-ground-start` to `--mq-brand-ground-end`, never on the near-black canvas (owner ruling 22). A brand slide is always a dark slide: its text takes the dark roles, checked against the lighter stop (ink 12.62:1, muted 8.52:1, tertiary 4.78:1, the accent highlight 6.67:1). A slide built with the homemade-claude-kit takes it with `dark brand` on its root.
297
+
294
298
  **The navy panel on dark.** Navy itself fails on a dark canvas (`#0a2463` is 1.25:1 on `#11161f`), so on dark the brand shows as the lifted navy, the light navy and the panel gradient, with no new hue (ADR-0003). Navy panels, the report header and the navy KPI tile keep the 160 degree gradient between `--mq-panel-start` and `--mq-panel-end`, with the dark values above, and draw `--mq-shadow-panel`: a 1 px light-navy outline, never a glow (owner ruling 13). A navy tile on dark takes the panel gradient, never the lifted accent. Contrast on navy is still checked against the panel start, the lighter stop.
295
299
 
296
300
  The on-navy tier on the dark panel (owner ruling 19): two roles take dark values, the others keep their light values and are checked again on the lighter dark panel start.
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis print module of the homemade-claude-kit design contract 2.1.0. The roles are
3
+ * MedQuantis print module of the homemade-claude-kit design contract 2.2.0. The roles are
4
4
  * generated from tokens/kit/ by the design-system build; the class rules after them are copied
5
5
  * from css/kit/print.css, written by hand against contract roles. Do not edit this file.
6
6
  * kit-manifest.json lists it. For kit renderers only: the unprefixed names collide with app and
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis slide-frame module of the homemade-claude-kit design contract 2.1.0. The roles are
3
+ * MedQuantis slide-frame module of the homemade-claude-kit design contract 2.2.0. The roles are
4
4
  * generated from tokens/kit/ by the design-system build; the class rules after them are copied
5
5
  * from css/kit/slide-frame.css, written by hand against contract roles. Do not edit this file.
6
6
  * kit-manifest.json lists it. For kit renderers only: the unprefixed names collide with app and
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis values for the space-shape module of the homemade-claude-kit design contract 2.1.0,
3
+ * MedQuantis values for the space-shape module of the homemade-claude-kit design contract 2.2.0,
4
4
  * generated from tokens/kit/ by the design-system build. Do not edit. kit-manifest.json lists it.
5
5
  * For kit renderers only: the unprefixed names collide with app and Tailwind variables.
6
6
  */
package/dist/kit/type.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /*! @medquantis/design-system | © 2026 MedQuantis SA | MIT License, see LICENSE */
2
2
  /*
3
- * MedQuantis values for the type module of the homemade-claude-kit design contract 2.1.0,
3
+ * MedQuantis values for the type module of the homemade-claude-kit design contract 2.2.0,
4
4
  * generated from tokens/kit/ by the design-system build. Do not edit. kit-manifest.json lists it.
5
5
  * For kit renderers only: the unprefixed names collide with app and Tailwind variables.
6
6
  */
@@ -319,7 +319,7 @@ Every status colour comes with an icon or a word (WCAG 1.4.1):
319
319
  - a flag is a coloured word, and only on the rows that need attention, so normal rows stay quiet;
320
320
  - light badge backgrounds come from the 50 and 100 steps of the status scales in `dist/tailwind.css`, never a hand-picked tint.
321
321
 
322
- The red of the old Paracel theme survives only as `--mq-danger` (ADR-0003). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in charts (ADR-0008). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them (specialising).
322
+ The red of the old Paracel theme survives only as `--mq-danger` (ADR-0003). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in charts (ADR-0008, ADR-0010). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them (specialising).
323
323
 
324
324
  ## Chart colours
325
325
 
@@ -357,6 +357,8 @@ Every ratio below is the WCAG 2.x contrast with the dark values, on the dark can
357
357
  | `--mq-focus-ring-color` | `#9fb3e8`, the light navy | Focus ring on dark backgrounds | 8.71:1 on canvas |
358
358
  | `--mq-panel-start` | `#2f4c8f` | Light end of the navy panel gradient | Background, white 8.23:1 on the panel start |
359
359
  | `--mq-panel-end` | `#0f2a5e` | Dark end of the navy panel gradient | Background |
360
+ | `--mq-brand-ground-start` | `#0f2a5e`, the same in light | Light end of the brand ground: the cover, closing slide and section dividers of a dark deck (owner ruling 22) | Background |
361
+ | `--mq-brand-ground-end` | `#0a2047`, the same in light | Dark end of the brand ground (owner ruling 22) | Background |
360
362
  | `--mq-shadow-panel` | a 1 px outline, light navy at 35 %, no glow (owner ruling 13) | Navy panels, the report header and the navy KPI tile on dark | Edge of a panel |
361
363
  | `--mq-shadow-edge` | the same 1 px outline, light navy at 35 %; none in light | The monogram (`mq-monogram`), the navy KPI tile and a navy brand or app tile, which draw no shadow in light (owner ruling 14) | Edge of a navy mark |
362
364
  | `--mq-shadow-live` | a 3 px ring of the dark success green `#6fbf73` at 17 %; in light the success green at 17 % | Apps only: the halo of a live dot, the row in force on a timeline (app patterns) | Decorative |
@@ -367,6 +369,8 @@ Accent text on the pale fills reads `--mq-accent-highlight` in both themes (owne
367
369
 
368
370
  The retired `--mq-dim` and `--mq-accent-on-dark` follow the roles they alias on dark too: `#8f98aa` (tertiary) and `#b2c2ed` (the on-navy accent).
369
371
 
372
+ **The brand ground.** The cover, the closing slide and the section dividers of a deck sit on the deep navy of the MedQuantis title pages, a 160 degree gradient from `--mq-brand-ground-start` to `--mq-brand-ground-end`, never on the near-black canvas (owner ruling 22). A brand slide is always a dark slide: its text takes the dark roles, checked against the lighter stop (ink 12.62:1, muted 8.52:1, tertiary 4.78:1, the accent highlight 6.67:1). A slide built with the homemade-claude-kit takes it with `dark brand` on its root.
373
+
370
374
  **The navy panel on dark.** Navy itself fails on a dark canvas (`#0a2463` is 1.25:1 on `#11161f`), so on dark the brand shows as the lifted navy, the light navy and the panel gradient, with no new hue (ADR-0003). Navy panels, the report header and the navy KPI tile keep the 160 degree gradient between `--mq-panel-start` and `--mq-panel-end`, with the dark values above, and draw `--mq-shadow-panel`: a 1 px light-navy outline, never a glow (owner ruling 13). A navy tile on dark takes the panel gradient, never the lifted accent. Contrast on navy is still checked against the panel start, the lighter stop.
371
375
 
372
376
  The on-navy tier on the dark panel (owner ruling 19): two roles take dark values, the others keep their light values and are checked again on the lighter dark panel start.
@@ -633,7 +637,7 @@ Rules:
633
637
 
634
638
  ## App categorical palette (apps only)
635
639
 
636
- Six hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, ADR-0008). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
640
+ Eight hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, ADR-0008). The indigo and the rose were added for the parts of a rule row (owner ruling of 2026-11-15, ADR-0010). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
637
641
 
638
642
  | Token | Value | Contrast on surface | Allowed for |
639
643
  | :-- | :-- | :-- | :-- |
@@ -644,6 +648,8 @@ Six hues for interactive apps whose charts or lists show more categories than th
644
648
  | `--mq-app-cat-blue` | `#3a8ff5` | 3.27:1 | Marks and fills only |
645
649
  | `--mq-app-cat-violet` | `#5a2fbe` | 8.12:1 | Marks, fills and text |
646
650
  | `--mq-app-cat-teal` | `#178a91` | 4.13:1 | Marks and fills only |
651
+ | `--mq-app-cat-indigo` | `#4a5aa8` | 6.33:1 | Marks, fills and text |
652
+ | `--mq-app-cat-rose` | `#b71c5a` | 6.31:1 | Marks, fills and text |
647
653
 
648
654
  | Change type | Token | Reads |
649
655
  | :-- | :-- | :-- |
@@ -651,15 +657,24 @@ Six hues for interactive apps whose charts or lists show more categories than th
651
657
  | Modified | `--mq-change-modified`; its text `--mq-change-modified-text` | The orange; the orange text |
652
658
  | Removed | `--mq-change-removed` | The vermillion |
653
659
 
654
- Between the six hues and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors.
660
+ Between the six hues of ADR-0008 and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors. The indigo and the rose stay out of that set: the indigo sits 13.7 from the violet, so they are not added to a many-category chart beside it.
661
+
662
+ | Rule row part | Token |
663
+ | :-- | :-- |
664
+ | The condition (when the rule applies) | `--mq-app-cat-indigo` |
665
+ | What is paid | `--mq-app-cat-orange-text` |
666
+ | How much | `--mq-app-cat-rose` |
667
+ | The rule's own quoted text | `--mq-tertiary` |
668
+
669
+ The three part hues and the tertiary grey stay apart by CIEDE2000 24.0 under normal vision, 15.1 under protanopia, 9.8 under deuteranopia (rose and grey) and 8.9 under tritanopia (orange text and rose); the token test holds 15, 10, 9 and 8. The indigo and the rose share their lightness, so each part also carries its label.
655
670
 
656
671
  Rules:
657
672
 
658
673
  - A one-series chart stays navy (`--mq-chart-series-1`). Up to four series, the ordered palette applies in apps too; the categorical hues are for charts of five or more categories and for data categories.
659
674
  - Fix each hue to its category across every view of the app; never let a charting library rotate through the palette.
660
- - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue.
675
+ - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue. The indigo sits 8.5 from `--mq-info` and the rose 17.4 from `--mq-danger`, under the same rule.
661
676
  - Marks sit on the surface (`--mq-surface`), where every hue meets 3:1 and needs no outline. On the canvas the orange falls to 2.88:1, and on the recessed surface the orange and the blue fall below 3:1, so a chart in these hues sits in a white card.
662
- - Text in a hue meets 4.5:1: the green, the vermillion and the violet may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
677
+ - Text in a hue meets 4.5:1: the green, the vermillion, the violet, the indigo and the rose may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
663
678
  - Never colour alone: the green and the vermillion have almost the same lightness, so in greyscale they cannot be told apart. Every mark carries a direct label or a legend entry, and a change type its sign (+, −) or its word; label the green and the teal directly where they touch.
664
679
  - A change type keeps its hue wherever a change is listed (badge, dot, filter, count) and keeps its mark style on top: an added value with +, a removed value struck through.
665
680
 
@@ -1159,7 +1174,7 @@ Every local one-off (a component or a token a consumer adds under its own prefix
1159
1174
 
1160
1175
  # Tokens
1161
1176
 
1162
- Every token of release 1.4.0, generated from dist/tokens.json. Consumers use the semantic names; the `--mq-core-*` names exist so semantic tokens can point at them. A deprecated token names its replacement.
1177
+ Every token of release 1.6.0, generated from dist/tokens.json. Consumers use the semantic names; the `--mq-core-*` names exist so semantic tokens can point at them. A deprecated token names its replacement.
1163
1178
 
1164
1179
  ## Semantic tokens
1165
1180
 
@@ -1191,6 +1206,8 @@ Every token of release 1.4.0, generated from dist/tokens.json. Consumers use the
1191
1206
  | `--mq-border-strong` | `#5d6f91` | Outline of outlined and dashed state marks in documents (badges, legend swatches), 3:1 or more on canvas and surface for WCAG 1.4.11 (increment 07 component need, ADR-0004: states by mark style). |
1192
1207
  | `--mq-panel-start` | `#0f2a5e` | Light end of the navy panel gradient; the worst case for text on navy. |
1193
1208
  | `--mq-panel-end` | `#0a2047` | Dark end of the navy panel gradient. |
1209
+ | `--mq-brand-ground-start` | `#0f2a5e` | Owner ruling 22, 2026-11-09: light end of the brand ground, the deep navy of a dark deck's cover, closing slide and section dividers, the same in both themes. |
1210
+ | `--mq-brand-ground-end` | `#0a2047` | Owner ruling 22, 2026-11-09: dark end of the brand ground, the same in both themes. |
1194
1211
  | `--mq-on-navy-title` | `#ffffff` | Owner ruling 2, 2026-10-09: titles, figures and icons on navy. |
1195
1212
  | `--mq-on-navy-secondary` | `rgba(255, 255, 255, 0.68)` | Owner ruling 2, 2026-10-09: secondary text and labels on navy. |
1196
1213
  | `--mq-on-navy-second-level` | `#c3cbdc` | Owner ruling 2, 2026-10-09: second-level text on navy. |
@@ -1215,6 +1232,8 @@ Every token of release 1.4.0, generated from dist/tokens.json. Consumers use the
1215
1232
  | `--mq-app-cat-blue` | `#3a8ff5` | App categorical hue for marks and fills on the surface only (3.27:1), never text (ADR-0008). |
1216
1233
  | `--mq-app-cat-violet` | `#5a2fbe` | App categorical hue: marks, fills and text (ADR-0008). |
1217
1234
  | `--mq-app-cat-teal` | `#178a91` | App categorical hue for marks and fills on the surface only (4.13:1), never text (ADR-0008). |
1235
+ | `--mq-app-cat-indigo` | `#4a5aa8` | App categorical hue: marks, fills and text, 6.33:1 on the surface; a data category, never the info status (ADR-0010). |
1236
+ | `--mq-app-cat-rose` | `#b71c5a` | App categorical hue: marks, fills and text, 6.31:1 on the surface; a data category, never the danger status (ADR-0010). |
1218
1237
  | `--mq-change-added` | `#1c7e3f` | Change type added, in apps only, always with its sign or its word: marks, fills and text (ADR-0008). |
1219
1238
  | `--mq-change-modified` | `#d78000` | Change type modified, in apps only, always with its word: marks and fills; its text reads change-modified-text (ADR-0008). |
1220
1239
  | `--mq-change-modified-text` | `#a35f00` | Text of the change type modified (counts, labels), in apps only (ADR-0008). |
@@ -1323,6 +1342,8 @@ Every token of release 1.4.0, generated from dist/tokens.json. Consumers use the
1323
1342
  | `--mq-core-app-blue` | `#3a8ff5` | App categorical blue, marks and fills only, 3.27:1 on white (ADR-0008). |
1324
1343
  | `--mq-core-app-violet` | `#5a2fbe` | App categorical violet (ADR-0008). |
1325
1344
  | `--mq-core-app-teal` | `#178a91` | App categorical teal, marks and fills only, 4.13:1 on white (ADR-0008). |
1345
+ | `--mq-core-app-indigo` | `#4a5aa8` | App categorical indigo, a data category in interactive apps only, never the info status; marks, fills and text, 6.33:1 on white (ADR-0010). |
1346
+ | `--mq-core-app-rose` | `#b71c5a` | App categorical rose, a data category in interactive apps only, never the danger status; marks, fills and text, 6.31:1 on white (ADR-0010). |
1326
1347
  | `--mq-core-font-family-outfit` | `Outfit, system-ui, -apple-system, 'Segoe UI', sans-serif` | Outfit, the sans for headings, labels and app UI (Owner ruling 10, 2026-10-09). |
1327
1348
  | `--mq-core-font-family-newsreader` | `Newsreader, Georgia, 'Times New Roman', serif` | Newsreader, the only serif; Georgia and Times New Roman are fallbacks only (Owner ruling 10, 2026-10-09). |
1328
1349
  | `--mq-core-font-family-geist-mono` | `'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace` | Geist Mono for figures and codes (Owner ruling 10, 2026-10-09). |
package/dist/llms.txt CHANGED
@@ -8,33 +8,33 @@ The links below point at the exact release on the jsDelivr CDN; pin that version
8
8
 
9
9
  ## Guidelines
10
10
 
11
- - [Principles](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/principles.md): The principles that decide the cases the other files do not cover
12
- - [Brand](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/brand.md): Name, tagline, legal line, wordmark, monogram, favicon, icons
13
- - [Voice](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/voice.md): Tone, words to prefer and avoid, languages, terminology in French, German, Italian and English
14
- - [Writing](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/writing.md): No em or en dash, titles, sentences and lists, French typography
15
- - [Colour](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/colour.md): Semantic colour tokens, the medium split, navy panels, states by mark style, status colours in apps, the dark theme
16
- - [Typography](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/typography.md): Families, weights, roles, sizes and line heights
17
- - [Layout](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/layout.md): Media, report skeleton, widths and spacing, radius, components, tables, app patterns, print
18
- - [Charts](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/charts.md): The ordered palette, highlight on grey, sequential and diverging use, marks, legends
19
- - [Data patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/data-patterns.md): Numbers, amounts, dates, null versus zero, confidential and illustrative data
20
- - [Accessibility](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/accessibility.md): WCAG 2.2 AA, contrast pairs, focus, targets, motion, structure
21
- - [App patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/app-patterns.md): Apps only: the app shell, and the review, decision and history patterns of dense internal tools
22
- - [Specialising the design system](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/specialising.md): Framework neutrality, the four rules, the promotion tests, the one-off log
11
+ - [Principles](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/principles.md): The principles that decide the cases the other files do not cover
12
+ - [Brand](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/brand.md): Name, tagline, legal line, wordmark, monogram, favicon, icons
13
+ - [Voice](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/voice.md): Tone, words to prefer and avoid, languages, terminology in French, German, Italian and English
14
+ - [Writing](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/writing.md): No em or en dash, titles, sentences and lists, French typography
15
+ - [Colour](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/colour.md): Semantic colour tokens, the medium split, navy panels, states by mark style, status colours in apps, the dark theme
16
+ - [Typography](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/typography.md): Families, weights, roles, sizes and line heights
17
+ - [Layout](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/layout.md): Media, report skeleton, widths and spacing, radius, components, tables, app patterns, print
18
+ - [Charts](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/charts.md): The ordered palette, highlight on grey, sequential and diverging use, marks, legends
19
+ - [Data patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/data-patterns.md): Numbers, amounts, dates, null versus zero, confidential and illustrative data
20
+ - [Accessibility](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/accessibility.md): WCAG 2.2 AA, contrast pairs, focus, targets, motion, structure
21
+ - [App patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/app-patterns.md): Apps only: the app shell, and the review, decision and history patterns of dense internal tools
22
+ - [Specialising the design system](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/specialising.md): Framework neutrality, the four rules, the promotion tests, the one-off log
23
23
 
24
24
  ## Tokens and CSS
25
25
 
26
- - [tokens.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/dist/tokens.css): every token as a `--mq-*` custom property; load it first
27
- - [tokens.json](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/dist/tokens.json): every token with its resolved value and description
28
- - [tailwind.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/dist/tailwind.css): Tailwind 4 theme with 50 to 950 scales, for apps
29
- - [base.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/css/base.css): typography roles for documents
30
- - [components.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/css/components.css): the shared `mq-` document components
31
- - [slide.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/css/slide.css): the 1280 by 720 slide canvas
32
- - [print.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/css/print.css): A4 pages with exact colour printing
33
- - [app.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/css/app.css): status badges, for interactive apps only
34
- - [fonts.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/fonts/fonts.css): self-hosted Outfit, Newsreader and Geist Mono
26
+ - [tokens.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/dist/tokens.css): every token as a `--mq-*` custom property; load it first
27
+ - [tokens.json](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/dist/tokens.json): every token with its resolved value and description
28
+ - [tailwind.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/dist/tailwind.css): Tailwind 4 theme with 50 to 950 scales, for apps
29
+ - [base.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/css/base.css): typography roles for documents
30
+ - [components.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/css/components.css): the shared `mq-` document components
31
+ - [slide.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/css/slide.css): the 1280 by 720 slide canvas
32
+ - [print.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/css/print.css): A4 pages with exact colour printing
33
+ - [app.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/css/app.css): status badges, for interactive apps only
34
+ - [fonts.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/fonts/fonts.css): self-hosted Outfit, Newsreader and Geist Mono
35
35
 
36
36
  ## Optional
37
37
 
38
- - [llms-full.txt](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/dist/llms-full.txt): every guideline in full and every token with its value
39
- - [kit-contract.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/dist/kit-contract.css): unprefixed names for homemade-claude-kit renderers only, never loaded in an app
40
- - [Guidelines index](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.4.0/guidelines/README.md): the file list and where each legacy rule went
38
+ - [llms-full.txt](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/dist/llms-full.txt): every guideline in full and every token with its value
39
+ - [kit-contract.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/dist/kit-contract.css): unprefixed names for homemade-claude-kit renderers only, never loaded in an app
40
+ - [Guidelines index](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.6.0/guidelines/README.md): the file list and where each legacy rule went
package/dist/tailwind.css CHANGED
@@ -105,6 +105,8 @@
105
105
  --color-border-strong: var(--mq-border-strong);
106
106
  --color-panel-start: var(--mq-panel-start);
107
107
  --color-panel-end: var(--mq-panel-end);
108
+ --color-brand-ground-start: var(--mq-brand-ground-start);
109
+ --color-brand-ground-end: var(--mq-brand-ground-end);
108
110
  --color-on-navy-title: var(--mq-on-navy-title);
109
111
  --color-on-navy-secondary: var(--mq-on-navy-secondary);
110
112
  --color-on-navy-second-level: var(--mq-on-navy-second-level);
@@ -122,6 +124,8 @@
122
124
  --color-app-cat-blue: var(--mq-app-cat-blue);
123
125
  --color-app-cat-violet: var(--mq-app-cat-violet);
124
126
  --color-app-cat-teal: var(--mq-app-cat-teal);
127
+ --color-app-cat-indigo: var(--mq-app-cat-indigo);
128
+ --color-app-cat-rose: var(--mq-app-cat-rose);
125
129
  --color-change-added: var(--mq-change-added);
126
130
  --color-change-modified: var(--mq-change-modified);
127
131
  --color-change-modified-text: var(--mq-change-modified-text);
package/dist/tokens.css CHANGED
@@ -43,6 +43,8 @@
43
43
  --mq-core-app-blue: #3a8ff5; /** App categorical blue, marks and fills only, 3.27:1 on white (ADR-0008). */
44
44
  --mq-core-app-violet: #5a2fbe; /** App categorical violet (ADR-0008). */
45
45
  --mq-core-app-teal: #178a91; /** App categorical teal, marks and fills only, 4.13:1 on white (ADR-0008). */
46
+ --mq-core-app-indigo: #4a5aa8; /** App categorical indigo, a data category in interactive apps only, never the info status; marks, fills and text, 6.33:1 on white (ADR-0010). */
47
+ --mq-core-app-rose: #b71c5a; /** App categorical rose, a data category in interactive apps only, never the danger status; marks, fills and text, 6.31:1 on white (ADR-0010). */
46
48
  --mq-core-font-family-outfit: Outfit, system-ui, -apple-system, 'Segoe UI', sans-serif; /** Outfit, the sans for headings, labels and app UI (Owner ruling 10, 2026-10-09). */
47
49
  --mq-core-font-family-newsreader: Newsreader, Georgia, 'Times New Roman', serif; /** Newsreader, the only serif; Georgia and Times New Roman are fallbacks only (Owner ruling 10, 2026-10-09). */
48
50
  --mq-core-font-family-geist-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace; /** Geist Mono for figures and codes (Owner ruling 10, 2026-10-09). */
@@ -121,6 +123,8 @@
121
123
  --mq-border-strong: #5d6f91; /** Outline of outlined and dashed state marks in documents (badges, legend swatches), 3:1 or more on canvas and surface for WCAG 1.4.11 (increment 07 component need, ADR-0004: states by mark style). */
122
124
  --mq-panel-start: #0f2a5e; /** Light end of the navy panel gradient; the worst case for text on navy. */
123
125
  --mq-panel-end: #0a2047; /** Dark end of the navy panel gradient. */
126
+ --mq-brand-ground-start: #0f2a5e; /** Owner ruling 22, 2026-11-09: light end of the brand ground, the deep navy of a dark deck's cover, closing slide and section dividers, the same in both themes. */
127
+ --mq-brand-ground-end: #0a2047; /** Owner ruling 22, 2026-11-09: dark end of the brand ground, the same in both themes. */
124
128
  --mq-on-navy-title: #ffffff; /** Owner ruling 2, 2026-10-09: titles, figures and icons on navy. */
125
129
  --mq-on-navy-secondary: rgba(255, 255, 255, 0.68); /** Owner ruling 2, 2026-10-09: secondary text and labels on navy. */
126
130
  --mq-on-navy-second-level: #c3cbdc; /** Owner ruling 2, 2026-10-09: second-level text on navy. */
@@ -145,6 +149,8 @@
145
149
  --mq-app-cat-blue: #3a8ff5; /** App categorical hue for marks and fills on the surface only (3.27:1), never text (ADR-0008). */
146
150
  --mq-app-cat-violet: #5a2fbe; /** App categorical hue: marks, fills and text (ADR-0008). */
147
151
  --mq-app-cat-teal: #178a91; /** App categorical hue for marks and fills on the surface only (4.13:1), never text (ADR-0008). */
152
+ --mq-app-cat-indigo: #4a5aa8; /** App categorical hue: marks, fills and text, 6.33:1 on the surface; a data category, never the info status (ADR-0010). */
153
+ --mq-app-cat-rose: #b71c5a; /** App categorical hue: marks, fills and text, 6.31:1 on the surface; a data category, never the danger status (ADR-0010). */
148
154
  --mq-change-added: #1c7e3f; /** Change type added, in apps only, always with its sign or its word: marks, fills and text (ADR-0008). */
149
155
  --mq-change-modified: #d78000; /** Change type modified, in apps only, always with its word: marks and fills; its text reads change-modified-text (ADR-0008). */
150
156
  --mq-change-modified-text: #a35f00; /** Text of the change type modified (counts, labels), in apps only (ADR-0008). */
package/dist/tokens.json CHANGED
@@ -389,6 +389,26 @@
389
389
  ],
390
390
  "description": "App categorical teal, marks and fills only, 4.13:1 on white (ADR-0008)."
391
391
  },
392
+ "--mq-core-app-indigo": {
393
+ "value": "#4a5aa8",
394
+ "type": "color",
395
+ "path": [
396
+ "core",
397
+ "color",
398
+ "app-indigo"
399
+ ],
400
+ "description": "App categorical indigo, a data category in interactive apps only, never the info status; marks, fills and text, 6.33:1 on white (ADR-0010)."
401
+ },
402
+ "--mq-core-app-rose": {
403
+ "value": "#b71c5a",
404
+ "type": "color",
405
+ "path": [
406
+ "core",
407
+ "color",
408
+ "app-rose"
409
+ ],
410
+ "description": "App categorical rose, a data category in interactive apps only, never the danger status; marks, fills and text, 6.31:1 on white (ADR-0010)."
411
+ },
392
412
  "--mq-core-font-family-outfit": {
393
413
  "value": "Outfit, system-ui, -apple-system, 'Segoe UI', sans-serif",
394
414
  "type": "fontFamily",
@@ -1198,6 +1218,26 @@
1198
1218
  ],
1199
1219
  "description": "Dark end of the navy panel gradient."
1200
1220
  },
1221
+ "--mq-brand-ground-start": {
1222
+ "value": "#0f2a5e",
1223
+ "type": "color",
1224
+ "path": [
1225
+ "semantic",
1226
+ "color",
1227
+ "brand-ground-start"
1228
+ ],
1229
+ "description": "Owner ruling 22, 2026-11-09: light end of the brand ground, the deep navy of a dark deck's cover, closing slide and section dividers, the same in both themes."
1230
+ },
1231
+ "--mq-brand-ground-end": {
1232
+ "value": "#0a2047",
1233
+ "type": "color",
1234
+ "path": [
1235
+ "semantic",
1236
+ "color",
1237
+ "brand-ground-end"
1238
+ ],
1239
+ "description": "Owner ruling 22, 2026-11-09: dark end of the brand ground, the same in both themes."
1240
+ },
1201
1241
  "--mq-on-navy-title": {
1202
1242
  "value": "#ffffff",
1203
1243
  "type": "color",
@@ -1460,6 +1500,28 @@
1460
1500
  ],
1461
1501
  "description": "App categorical hue for marks and fills on the surface only (4.13:1), never text (ADR-0008)."
1462
1502
  },
1503
+ "--mq-app-cat-indigo": {
1504
+ "value": "#4a5aa8",
1505
+ "type": "color",
1506
+ "path": [
1507
+ "semantic",
1508
+ "color",
1509
+ "app-cat",
1510
+ "indigo"
1511
+ ],
1512
+ "description": "App categorical hue: marks, fills and text, 6.33:1 on the surface; a data category, never the info status (ADR-0010)."
1513
+ },
1514
+ "--mq-app-cat-rose": {
1515
+ "value": "#b71c5a",
1516
+ "type": "color",
1517
+ "path": [
1518
+ "semantic",
1519
+ "color",
1520
+ "app-cat",
1521
+ "rose"
1522
+ ],
1523
+ "description": "App categorical hue: marks, fills and text, 6.31:1 on the surface; a data category, never the danger status (ADR-0010)."
1524
+ },
1463
1525
  "--mq-change-added": {
1464
1526
  "value": "#1c7e3f",
1465
1527
  "type": "color",
@@ -37,7 +37,7 @@ Rules:
37
37
 
38
38
  ## App categorical palette (apps only)
39
39
 
40
- Six hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, [ADR-0008](../docs/architecture/decisions/adr-0008-apps-have-a-categorical-palette.md)). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
40
+ Eight hues for interactive apps whose charts or lists show more categories than the four ordered series can carry, and three change types built on them (owner rulings 20 and 21, [ADR-0008](../docs/architecture/decisions/adr-0008-apps-have-a-categorical-palette.md)). The indigo and the rose were added for the parts of a rule row (owner ruling of 2026-11-15, [ADR-0010](../docs/architecture/decisions/adr-0010-apps-gain-indigo-and-rose-categorical-hues.md)). They are light only until their dark values are ruled, and they never appear in documents, which keep the ordered palette.
41
41
 
42
42
  | Token | Value | Contrast on surface | Allowed for |
43
43
  | :-- | :-- | :-- | :-- |
@@ -48,6 +48,8 @@ Six hues for interactive apps whose charts or lists show more categories than th
48
48
  | `--mq-app-cat-blue` | `#3a8ff5` | 3.27:1 | Marks and fills only |
49
49
  | `--mq-app-cat-violet` | `#5a2fbe` | 8.12:1 | Marks, fills and text |
50
50
  | `--mq-app-cat-teal` | `#178a91` | 4.13:1 | Marks and fills only |
51
+ | `--mq-app-cat-indigo` | `#4a5aa8` | 6.33:1 | Marks, fills and text |
52
+ | `--mq-app-cat-rose` | `#b71c5a` | 6.31:1 | Marks, fills and text |
51
53
 
52
54
  | Change type | Token | Reads |
53
55
  | :-- | :-- | :-- |
@@ -55,15 +57,24 @@ Six hues for interactive apps whose charts or lists show more categories than th
55
57
  | Modified | `--mq-change-modified`; its text `--mq-change-modified-text` | The orange; the orange text |
56
58
  | Removed | `--mq-change-removed` | The vermillion |
57
59
 
58
- Between the six hues and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors.
60
+ Between the six hues of ADR-0008 and navy series 1, the smallest CIEDE2000 distance is 17.4 under normal vision, 11.9 under protanopia, 12.9 under deuteranopia and 8.4 under tritanopia (green and teal); the token test holds those floors. The indigo and the rose stay out of that set: the indigo sits 13.7 from the violet, so they are not added to a many-category chart beside it.
61
+
62
+ | Rule row part | Token |
63
+ | :-- | :-- |
64
+ | The condition (when the rule applies) | `--mq-app-cat-indigo` |
65
+ | What is paid | `--mq-app-cat-orange-text` |
66
+ | How much | `--mq-app-cat-rose` |
67
+ | The rule's own quoted text | `--mq-tertiary` |
68
+
69
+ The three part hues and the tertiary grey stay apart by CIEDE2000 24.0 under normal vision, 15.1 under protanopia, 9.8 under deuteranopia (rose and grey) and 8.9 under tritanopia (orange text and rose); the token test holds 15, 10, 9 and 8. The indigo and the rose share their lightness, so each part also carries its label.
59
70
 
60
71
  Rules:
61
72
 
62
73
  - A one-series chart stays navy (`--mq-chart-series-1`). Up to four series, the ordered palette applies in apps too; the categorical hues are for charts of five or more categories and for data categories.
63
74
  - Fix each hue to its category across every view of the app; never let a charting library rotate through the palette.
64
- - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue.
75
+ - No series uses a status token. The vermillion is a data category ("removed from the list"), not an error: `--mq-danger` stays for errors. The green, the orange, the orange text and the vermillion sit CIEDE2000 3.3, 2.2, 2.8 and 7.9 from `--mq-success`, `--mq-warning-fill`, `--mq-warning` and `--mq-danger`, so code tells them apart by token name and the screen by the word or sign each carries, never by hue. The indigo sits 8.5 from `--mq-info` and the rose 17.4 from `--mq-danger`, under the same rule.
65
76
  - Marks sit on the surface (`--mq-surface`), where every hue meets 3:1 and needs no outline. On the canvas the orange falls to 2.88:1, and on the recessed surface the orange and the blue fall below 3:1, so a chart in these hues sits in a white card.
66
- - Text in a hue meets 4.5:1: the green, the vermillion and the violet may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
77
+ - Text in a hue meets 4.5:1: the green, the vermillion, the violet, the indigo and the rose may be text, orange text reads `--mq-app-cat-orange-text`, and the blue and the teal are never text.
67
78
  - Never colour alone: the green and the vermillion have almost the same lightness, so in greyscale they cannot be told apart. Every mark carries a direct label or a legend entry, and a change type its sign (+, −) or its word; label the green and the teal directly where they touch.
68
79
  - A change type keeps its hue wherever a change is listed (badge, dot, filter, count) and keeps its mark style on top: an added value with +, a removed value struck through.
69
80
 
@@ -96,7 +96,7 @@ Every status colour comes with an icon or a word (WCAG 1.4.1):
96
96
  - a flag is a coloured word, and only on the rows that need attention, so normal rows stay quiet;
97
97
  - light badge backgrounds come from the 50 and 100 steps of the status scales in `dist/tailwind.css`, never a hand-picked tint.
98
98
 
99
- The red of the old Paracel theme survives only as `--mq-danger` ([ADR-0003](../docs/architecture/decisions/adr-0003-navy-is-the-single-brand-accent.md)). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in [charts](charts.md) ([ADR-0008](../docs/architecture/decisions/adr-0008-apps-have-a-categorical-palette.md)). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them ([specialising](specialising.md)).
99
+ The red of the old Paracel theme survives only as `--mq-danger` ([ADR-0003](../docs/architecture/decisions/adr-0003-navy-is-the-single-brand-accent.md)). The app categorical palette and the change types (`--mq-app-cat-*`, `--mq-change-*`) are data categories, never statuses; their values and rules are in [charts](charts.md) ([ADR-0008](../docs/architecture/decisions/adr-0008-apps-have-a-categorical-palette.md), [ADR-0010](../docs/architecture/decisions/adr-0010-apps-gain-indigo-and-rose-categorical-hues.md)). Other app-specific hues, such as the annotation colours of regulatory text, stay local in the app under its own prefix until a second consumer needs them ([specialising](specialising.md)).
100
100
 
101
101
  ## Chart colours
102
102
 
@@ -134,6 +134,8 @@ Every ratio below is the WCAG 2.x contrast with the dark values, on the dark can
134
134
  | `--mq-focus-ring-color` | `#9fb3e8`, the light navy | Focus ring on dark backgrounds | 8.71:1 on canvas |
135
135
  | `--mq-panel-start` | `#2f4c8f` | Light end of the navy panel gradient | Background, white 8.23:1 on the panel start |
136
136
  | `--mq-panel-end` | `#0f2a5e` | Dark end of the navy panel gradient | Background |
137
+ | `--mq-brand-ground-start` | `#0f2a5e`, the same in light | Light end of the brand ground: the cover, closing slide and section dividers of a dark deck (owner ruling 22) | Background |
138
+ | `--mq-brand-ground-end` | `#0a2047`, the same in light | Dark end of the brand ground (owner ruling 22) | Background |
137
139
  | `--mq-shadow-panel` | a 1 px outline, light navy at 35 %, no glow (owner ruling 13) | Navy panels, the report header and the navy KPI tile on dark | Edge of a panel |
138
140
  | `--mq-shadow-edge` | the same 1 px outline, light navy at 35 %; none in light | The monogram (`mq-monogram`), the navy KPI tile and a navy brand or app tile, which draw no shadow in light (owner ruling 14) | Edge of a navy mark |
139
141
  | `--mq-shadow-live` | a 3 px ring of the dark success green `#6fbf73` at 17 %; in light the success green at 17 % | Apps only: the halo of a live dot, the row in force on a timeline ([app patterns](app-patterns.md)) | Decorative |
@@ -144,6 +146,8 @@ Accent text on the pale fills reads `--mq-accent-highlight` in both themes (owne
144
146
 
145
147
  The retired `--mq-dim` and `--mq-accent-on-dark` follow the roles they alias on dark too: `#8f98aa` (tertiary) and `#b2c2ed` (the on-navy accent).
146
148
 
149
+ **The brand ground.** The cover, the closing slide and the section dividers of a deck sit on the deep navy of the MedQuantis title pages, a 160 degree gradient from `--mq-brand-ground-start` to `--mq-brand-ground-end`, never on the near-black canvas (owner ruling 22). A brand slide is always a dark slide: its text takes the dark roles, checked against the lighter stop (ink 12.62:1, muted 8.52:1, tertiary 4.78:1, the accent highlight 6.67:1). A slide built with the homemade-claude-kit takes it with `dark brand` on its root.
150
+
147
151
  **The navy panel on dark.** Navy itself fails on a dark canvas (`#0a2463` is 1.25:1 on `#11161f`), so on dark the brand shows as the lifted navy, the light navy and the panel gradient, with no new hue ([ADR-0003](../docs/architecture/decisions/adr-0003-navy-is-the-single-brand-accent.md)). Navy panels, the report header and the navy KPI tile keep the 160 degree gradient between `--mq-panel-start` and `--mq-panel-end`, with the dark values above, and draw `--mq-shadow-panel`: a 1 px light-navy outline, never a glow (owner ruling 13). A navy tile on dark takes the panel gradient, never the lifted accent. Contrast on navy is still checked against the panel start, the lighter stop.
148
152
 
149
153
  The on-navy tier on the dark panel (owner ruling 19): two roles take dark values, the others keep their light values and are checked again on the lighter dark panel start.
package/kit-manifest.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "contractVersion": "2.1.0",
2
+ "contractVersion": "2.2.0",
3
3
  "provides": {
4
4
  "core": "./kit/core.css",
5
5
  "dataviz": "./kit/dataviz.css",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@medquantis/design-system",
3
- "version": "1.4.0",
3
+ "version": "1.6.0",
4
4
  "description": "MedQuantis design tokens, shared CSS, assets, guidelines and Claude skill.",
5
5
  "type": "module",
6
6
  "repository": {
@@ -74,8 +74,8 @@
74
74
  "@playwright/test": "1.64.1",
75
75
  "ajv": "8.20.0",
76
76
  "lucide": "1.59.0",
77
- "postcss": "8.5.30",
78
- "style-dictionary": "5.7.0",
77
+ "postcss": "8.5.32",
78
+ "style-dictionary": "5.8.0",
79
79
  "stylelint": "17.16.0",
80
80
  "stylelint-declaration-strict-value": "1.12.1",
81
81
  "stylelint-value-no-unknown-custom-properties": "6.1.1",