@adia-ai/web-components 0.8.46 → 0.8.48

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.
Files changed (39) hide show
  1. package/CHANGELOG.md +43 -0
  2. package/components/card/card.css +25 -2
  3. package/components/chart/chart.a2ui.json +1 -1
  4. package/components/chart/chart.d.ts +1 -1
  5. package/components/chart/chart.yaml +6 -3
  6. package/components/link/link.css +3 -2
  7. package/components/nav/nav.css +7 -3
  8. package/components/nav-group/nav-group.css +38 -41
  9. package/components/nav-item/nav-item.css +11 -5
  10. package/components/preview/preview.class.js +12 -2
  11. package/components/richtext/richtext.css +2 -2
  12. package/components/table/table.a2ui.json +5 -2
  13. package/components/table/table.class.js +36 -1
  14. package/components/table/table.d.ts +2 -2
  15. package/components/table/table.yaml +17 -1
  16. package/components/table-footer/table-footer.a2ui.json +20 -2
  17. package/components/table-footer/table-footer.class.js +94 -8
  18. package/components/table-footer/table-footer.d.ts +6 -2
  19. package/components/table-footer/table-footer.yaml +57 -6
  20. package/components/table-toolbar/table-toolbar.a2ui.json +35 -2
  21. package/components/table-toolbar/table-toolbar.class.js +117 -9
  22. package/components/table-toolbar/table-toolbar.css +104 -3
  23. package/components/table-toolbar/table-toolbar.d.ts +10 -2
  24. package/components/table-toolbar/table-toolbar.examples.md +47 -45
  25. package/components/table-toolbar/table-toolbar.yaml +97 -9
  26. package/core/anchor.js +21 -1
  27. package/custom-elements.json +50 -5
  28. package/dist/host.min.css +1 -1
  29. package/dist/host.sheet.js +1 -1
  30. package/dist/theme-provider.min.js +8 -8
  31. package/dist/themes.min.css +1 -1
  32. package/dist/themes.sheet.js +1 -1
  33. package/dist/web-components.min.css +1 -1
  34. package/dist/web-components.min.js +52 -52
  35. package/dist/web-components.sheet.js +1 -1
  36. package/package.json +1 -1
  37. package/styles/colors/material-static.css +298 -234
  38. package/styles/themes.css +2676 -0
  39. package/styles/type/elements.css +1 -0
@@ -12,16 +12,56 @@
12
12
  `--a-brand-*` staying computed/AdiaUI-only, contract Gap §2),
13
13
  ~700 static OKLCH literals, `light-dark()` per role.
14
14
 
15
- TRADEOFF, ACCEPTED EXPLICITLY (operator confirmed, 2026-07-14):
16
- AdiaUI's 8-theme live-retheming system (themes.css ocean, forest,
17
- sunset, lavender, rose, slate, midnight) worked by overriding the
18
- `@property` hue/chroma knobs these static values now replace for
19
- the 7 semantic families + neutral. Those theme overrides become
20
- dead code for color (still functional for --a-brand-hue, --a-radius-k,
21
- --a-density, --a-shadow-intensity, which stay parametric — see
22
- parameters.css/primitives-brand.css, untouched). Only `[theme="default"]`'s
23
- color values still apply, and only because they're what this file
24
- already bakes in as the sole palette.
15
+ TRADEOFF AS OF 2026-07-14 (operator confirmed that day) — STALE, SEE
16
+ CORRECTION BELOW (gh#1852): at the time this header was written,
17
+ AdiaUI's then-8-theme live-retheming system (themes.css ocean,
18
+ forest, sunset, lavender, rose, slate, midnight) worked by overriding
19
+ the `@property` hue/chroma knobs these static values replaced, so
20
+ those theme overrides were genuinely dead for color that day.
21
+
22
+ CORRECTION (gh#1852, 2026-08-22): themes.css was rewritten since —
23
+ 12 themes now (atlas/signal/terrarium/ledger/arcade/meridian/solstice/
24
+ glacier/ember/botanica/vector/velour), overriding the raw
25
+ `--md-sys-color-{neutral,primary,secondary,tertiary}-{NN}` ramp stops
26
+ THIS FILE ALSO DECLARES, directly — not the retired `@property` knobs.
27
+ That is NOT dead code: `@layer reset, tokens, ..., context, overrides`
28
+ (host.css) puts `context` (where [theme="x"] rules live) after
29
+ `tokens` (this file's :root block) in the cascade-layer order, and
30
+ layer order always wins over selector specificity — so a themed
31
+ ancestor's raw-stop override wins there. Verified empirically
32
+ (Playwright, file:// harness) — `--md-sys-color-primary-600` measured
33
+ `oklch(0.5493 0.1051 226.08)` at :root vs `oklch(0.5493 0.0946
34
+ 216.96)` under `[theme="atlas"]`, the atlas-rotated hue, not the
35
+ default.
36
+
37
+ CORRECTION #2 (gh#1863, 2026-08-22) — the "every semantic role...
38
+ re-resolves through it at each descendant, by ordinary CSS
39
+ custom-property inheritance" claim directly above was WRONG for a
40
+ descendant-scoped `[theme]` and has been removed; the raw-stop
41
+ measurement above never actually tested an alias. Per CSS
42
+ custom-property semantics, `var()` inside a property's value
43
+ substitutes at computed-value time on the element where THAT property
44
+ is declared — every alias in this file is declared once, at `:root`,
45
+ so it substitutes using `:root`'s own raw stops and that computed
46
+ value is what inherits downward as a plain value, not a live
47
+ reference. `[theme]` on `:root`/`<html>` itself works (root is also
48
+ the alias's declaration site, so the raw-stop override and the alias
49
+ substitution happen at the same element) — but `[theme]` on a
50
+ DESCENDANT (the documented, shipped `<theme-provider theme="X">`
51
+ nested-scoping shape, components/theme-provider/) only rotates the
52
+ raw stop there; every alias stayed pinned to the default theme,
53
+ silently, because no rule redeclares the alias itself at that
54
+ descendant. Confirmed both ways (Playwright, file:// harness,
55
+ `--md-sys-color-primary` vs `-primary-600` under root- and
56
+ descendant-scoped `[theme="atlas"]`) and closed by generating a
57
+ themed redeclaration of every alias into each of themes.css's 12
58
+ `[theme="X"]` blocks (`scripts/build/generate-theme-aliases.mjs`,
59
+ `npm run check:theme-scoped-alias` — the regression gate).
60
+ info/success/warning/danger are correctly left unthemed (deliberate —
61
+ status meaning stays constant across themes, themes.css's own
62
+ header). Only `--a-brand-hue`/`-radius-k`/`-density`/
63
+ `-shadow-intensity` were ever the OTHER stated-live knobs; that part
64
+ of the original 2026-07-14 claim stands.
25
65
 
26
66
  NOT touched by this replacement: `--a-brand-*` (no adia.css palette
27
67
  to source from), `--a-link*`/`--a-focus-*`/`--a-data-*` (no direct
@@ -71,41 +111,58 @@
71
111
  --md-sys-color-neutral-500-900: oklch(0.598 0.0316 225.06 / 90%);
72
112
  --md-sys-color-neutral-500-950: oklch(0.598 0.0316 225.06 / 95%);
73
113
  /* Neutral — semantic roles */
74
- --md-sys-color-neutral: light-dark(var(--md-sys-color-neutral-600), var(--md-sys-color-neutral-600));
114
+ /* gh#1852: `neutral`/-hover/-active and the on-neutral* text roles below were
115
+ wrapped in light-dark() with two IDENTICAL legs — a no-op that read as an
116
+ unfinished mode split. Investigated per role, not blanket: this solid tone
117
+ is a fill meant to render the SAME regardless of scheme (a swatch/badge/
118
+ chip identity, unlike -dim/-bright/-low/-high directly below and
119
+ on-neutral-container above, which DO diverge because they sit on the
120
+ mode-adaptive surface). Its paired on-neutral* text roles must then also
121
+ stay flat — the text sits on that same fixed-tone fill either way. Dropped
122
+ the pointless light-dark() wrapper; kept the plain var(). Same rationale
123
+ repeats per palette family below (primary/secondary/tertiary/info/
124
+ success/warning/danger) — not re-derived per family, the fill-identity
125
+ argument is the family-agnostic mechanism. */
126
+ --md-sys-color-neutral: var(--md-sys-color-neutral-600);
75
127
  --md-sys-color-neutral-dim: light-dark(var(--md-sys-color-neutral-650), var(--md-sys-color-neutral-700));
76
128
  --md-sys-color-neutral-bright: light-dark(var(--md-sys-color-neutral-350), var(--md-sys-color-neutral-400));
77
129
  --md-sys-color-neutral-low: light-dark(var(--md-sys-color-neutral-350), var(--md-sys-color-neutral-700));
78
130
  --md-sys-color-neutral-high: light-dark(var(--md-sys-color-neutral-650), var(--md-sys-color-neutral-400));
79
- --md-sys-color-neutral-hover: light-dark(var(--md-sys-color-neutral-650), var(--md-sys-color-neutral-650));
80
- --md-sys-color-neutral-active: light-dark(var(--md-sys-color-neutral-700), var(--md-sys-color-neutral-700));
81
- --md-sys-color-neutral-disabled: light-dark(var(--md-sys-color-neutral-500-600), var(--md-sys-color-neutral-500-600));
82
- --md-sys-color-neutral-on-neutral: light-dark(var(--md-sys-color-neutral-050), var(--md-sys-color-neutral-050));
83
- --md-sys-color-neutral-on-neutral-variant: light-dark(var(--md-sys-color-neutral-200), var(--md-sys-color-neutral-200));
131
+ --md-sys-color-neutral-hover: var(--md-sys-color-neutral-650);
132
+ --md-sys-color-neutral-active: var(--md-sys-color-neutral-700);
133
+ /* gh#1852: -disabled / outline-* / container-* / scrim-* families below (this one and
134
+ every palette's) resolve through the `-500-NNN` ALPHA primitives (same 500
135
+ stop, varying opacity) — alpha composites differently over the light vs.
136
+ dark surface underneath it automatically, so an identical light-dark() leg
137
+ was never doing anything; dropped it in favor of the plain var(). */
138
+ --md-sys-color-neutral-disabled: var(--md-sys-color-neutral-500-600);
139
+ --md-sys-color-neutral-on-neutral: var(--md-sys-color-neutral-050);
140
+ --md-sys-color-neutral-on-neutral-variant: var(--md-sys-color-neutral-200);
84
141
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
85
142
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
86
143
  composited on the page bg); dark leg = the 200 stop, on-neutral-variant's own
87
144
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
88
145
  --md-sys-color-neutral-on-neutral-container: light-dark(var(--md-sys-color-neutral-950), var(--md-sys-color-neutral-200));
89
- --md-sys-color-neutral-on-neutral-hover: light-dark(var(--md-sys-color-neutral-050), var(--md-sys-color-neutral-050));
90
- --md-sys-color-neutral-on-neutral-active: light-dark(var(--md-sys-color-neutral-050), var(--md-sys-color-neutral-050));
91
- --md-sys-color-neutral-on-neutral-disabled: light-dark(var(--md-sys-color-neutral-500-400), var(--md-sys-color-neutral-500-400));
146
+ --md-sys-color-neutral-on-neutral-hover: var(--md-sys-color-neutral-050);
147
+ --md-sys-color-neutral-on-neutral-active: var(--md-sys-color-neutral-050);
148
+ --md-sys-color-neutral-on-neutral-disabled: var(--md-sys-color-neutral-500-400);
92
149
  --md-sys-color-neutral-on-surface: light-dark(var(--md-sys-color-neutral-950), var(--md-sys-color-neutral-050));
93
150
  --md-sys-color-neutral-on-surface-variant: light-dark(var(--md-sys-color-neutral-750), var(--md-sys-color-neutral-250));
94
151
  --md-sys-color-neutral-on-surface-hover: light-dark(var(--md-sys-color-neutral-950), var(--md-sys-color-neutral-050));
95
152
  --md-sys-color-neutral-on-surface-active: light-dark(var(--md-sys-color-neutral-950), var(--md-sys-color-neutral-050));
96
- --md-sys-color-neutral-on-surface-disabled: light-dark(var(--md-sys-color-neutral-500-400), var(--md-sys-color-neutral-500-400));
153
+ --md-sys-color-neutral-on-surface-disabled: var(--md-sys-color-neutral-500-400);
97
154
  --md-sys-color-neutral-placeholder: light-dark(var(--md-sys-color-neutral-650), var(--md-sys-color-neutral-350));
98
- --md-sys-color-neutral-outline: light-dark(var(--md-sys-color-neutral-500-600), var(--md-sys-color-neutral-500-600));
99
- --md-sys-color-neutral-outline-variant: light-dark(var(--md-sys-color-neutral-500-300), var(--md-sys-color-neutral-500-300));
100
- --md-sys-color-neutral-outline-hover: light-dark(var(--md-sys-color-neutral-500-700), var(--md-sys-color-neutral-500-700));
101
- --md-sys-color-neutral-outline-active: light-dark(var(--md-sys-color-neutral-500-800), var(--md-sys-color-neutral-500-800));
102
- --md-sys-color-neutral-outline-disabled: light-dark(var(--md-sys-color-neutral-500-400), var(--md-sys-color-neutral-500-400));
103
- --md-sys-color-neutral-container: light-dark(var(--md-sys-color-neutral-500-200), var(--md-sys-color-neutral-500-200));
104
- --md-sys-color-neutral-container-low: light-dark(var(--md-sys-color-neutral-500-100), var(--md-sys-color-neutral-500-100));
105
- --md-sys-color-neutral-container-high: light-dark(var(--md-sys-color-neutral-500-300), var(--md-sys-color-neutral-500-300));
106
- --md-sys-color-neutral-container-hover: light-dark(var(--md-sys-color-neutral-500-300), var(--md-sys-color-neutral-500-300));
107
- --md-sys-color-neutral-container-active: light-dark(var(--md-sys-color-neutral-500-400), var(--md-sys-color-neutral-500-400));
108
- --md-sys-color-neutral-container-disabled: light-dark(var(--md-sys-color-neutral-500-100), var(--md-sys-color-neutral-500-100));
155
+ --md-sys-color-neutral-outline: var(--md-sys-color-neutral-500-600);
156
+ --md-sys-color-neutral-outline-variant: var(--md-sys-color-neutral-500-300);
157
+ --md-sys-color-neutral-outline-hover: var(--md-sys-color-neutral-500-700);
158
+ --md-sys-color-neutral-outline-active: var(--md-sys-color-neutral-500-800);
159
+ --md-sys-color-neutral-outline-disabled: var(--md-sys-color-neutral-500-400);
160
+ --md-sys-color-neutral-container: var(--md-sys-color-neutral-500-200);
161
+ --md-sys-color-neutral-container-low: var(--md-sys-color-neutral-500-100);
162
+ --md-sys-color-neutral-container-high: var(--md-sys-color-neutral-500-300);
163
+ --md-sys-color-neutral-container-hover: var(--md-sys-color-neutral-500-300);
164
+ --md-sys-color-neutral-container-active: var(--md-sys-color-neutral-500-400);
165
+ --md-sys-color-neutral-container-disabled: var(--md-sys-color-neutral-500-100);
109
166
  --md-sys-color-neutral-inverse-surface: light-dark(var(--md-sys-color-neutral-900), var(--md-sys-color-neutral-100));
110
167
  --md-sys-color-neutral-inverse-on-surface: light-dark(var(--md-sys-color-neutral-050), var(--md-sys-color-neutral-950));
111
168
  --md-sys-color-neutral-background: light-dark(var(--md-sys-color-neutral-100), var(--md-sys-color-neutral-900));
@@ -122,13 +179,13 @@
122
179
  --md-sys-color-neutral-surface-high: light-dark(var(--md-sys-color-neutral-150), var(--md-sys-color-neutral-850));
123
180
  --md-sys-color-neutral-surface-higher: light-dark(var(--md-sys-color-neutral-175), var(--md-sys-color-neutral-825));
124
181
  --md-sys-color-neutral-surface-highest: light-dark(var(--md-sys-color-neutral-200), var(--md-sys-color-neutral-800));
125
- --md-sys-color-neutral-scrim-weakest: light-dark(var(--md-sys-color-neutral-500-050), var(--md-sys-color-neutral-500-050));
126
- --md-sys-color-neutral-scrim-weaker: light-dark(var(--md-sys-color-neutral-500-100), var(--md-sys-color-neutral-500-100));
127
- --md-sys-color-neutral-scrim-weak: light-dark(var(--md-sys-color-neutral-500-200), var(--md-sys-color-neutral-500-200));
128
- --md-sys-color-neutral-scrim: light-dark(var(--md-sys-color-neutral-500-300), var(--md-sys-color-neutral-500-300));
129
- --md-sys-color-neutral-scrim-strong: light-dark(var(--md-sys-color-neutral-500-400), var(--md-sys-color-neutral-500-400));
130
- --md-sys-color-neutral-scrim-stronger: light-dark(var(--md-sys-color-neutral-500-500), var(--md-sys-color-neutral-500-500));
131
- --md-sys-color-neutral-scrim-strongest: light-dark(var(--md-sys-color-neutral-500-600), var(--md-sys-color-neutral-500-600));
182
+ --md-sys-color-neutral-scrim-weakest: var(--md-sys-color-neutral-500-050);
183
+ --md-sys-color-neutral-scrim-weaker: var(--md-sys-color-neutral-500-100);
184
+ --md-sys-color-neutral-scrim-weak: var(--md-sys-color-neutral-500-200);
185
+ --md-sys-color-neutral-scrim: var(--md-sys-color-neutral-500-300);
186
+ --md-sys-color-neutral-scrim-strong: var(--md-sys-color-neutral-500-400);
187
+ --md-sys-color-neutral-scrim-stronger: var(--md-sys-color-neutral-500-500);
188
+ --md-sys-color-neutral-scrim-strongest: var(--md-sys-color-neutral-500-600);
132
189
 
133
190
  /* Primary — flat mode-independent primitives */
134
191
  --md-sys-color-primary-100: oklch(0.9609 0.006 223.46);
@@ -168,41 +225,42 @@
168
225
  --md-sys-color-primary-500-900: oklch(0.6498 0.1222 224.12 / 90%);
169
226
  --md-sys-color-primary-500-950: oklch(0.6498 0.1222 224.12 / 95%);
170
227
  /* Primary — semantic roles */
171
- --md-sys-color-primary: light-dark(var(--md-sys-color-primary-600), var(--md-sys-color-primary-600));
228
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
229
+ --md-sys-color-primary: var(--md-sys-color-primary-600);
172
230
  --md-sys-color-primary-dim: light-dark(var(--md-sys-color-primary-650), var(--md-sys-color-primary-700));
173
231
  --md-sys-color-primary-bright: light-dark(var(--md-sys-color-primary-350), var(--md-sys-color-primary-400));
174
232
  --md-sys-color-primary-low: light-dark(var(--md-sys-color-primary-350), var(--md-sys-color-primary-700));
175
233
  --md-sys-color-primary-high: light-dark(var(--md-sys-color-primary-650), var(--md-sys-color-primary-400));
176
- --md-sys-color-primary-hover: light-dark(var(--md-sys-color-primary-650), var(--md-sys-color-primary-650));
177
- --md-sys-color-primary-active: light-dark(var(--md-sys-color-primary-700), var(--md-sys-color-primary-700));
178
- --md-sys-color-primary-disabled: light-dark(var(--md-sys-color-primary-500-600), var(--md-sys-color-primary-500-600));
179
- --md-sys-color-primary-on-primary: light-dark(var(--md-sys-color-primary-050), var(--md-sys-color-primary-050));
180
- --md-sys-color-primary-on-primary-variant: light-dark(var(--md-sys-color-primary-200), var(--md-sys-color-primary-200));
234
+ --md-sys-color-primary-hover: var(--md-sys-color-primary-650);
235
+ --md-sys-color-primary-active: var(--md-sys-color-primary-700);
236
+ --md-sys-color-primary-disabled: var(--md-sys-color-primary-500-600);
237
+ --md-sys-color-primary-on-primary: var(--md-sys-color-primary-050);
238
+ --md-sys-color-primary-on-primary-variant: var(--md-sys-color-primary-200);
181
239
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
182
240
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
183
241
  composited on the page bg); dark leg = the 200 stop, on-primary-variant's own
184
242
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
185
243
  --md-sys-color-primary-on-primary-container: light-dark(var(--md-sys-color-primary-950), var(--md-sys-color-primary-200));
186
- --md-sys-color-primary-on-primary-hover: light-dark(var(--md-sys-color-primary-050), var(--md-sys-color-primary-050));
187
- --md-sys-color-primary-on-primary-active: light-dark(var(--md-sys-color-primary-050), var(--md-sys-color-primary-050));
188
- --md-sys-color-primary-on-primary-disabled: light-dark(var(--md-sys-color-primary-500-400), var(--md-sys-color-primary-500-400));
244
+ --md-sys-color-primary-on-primary-hover: var(--md-sys-color-primary-050);
245
+ --md-sys-color-primary-on-primary-active: var(--md-sys-color-primary-050);
246
+ --md-sys-color-primary-on-primary-disabled: var(--md-sys-color-primary-500-400);
189
247
  --md-sys-color-primary-on-surface: light-dark(var(--md-sys-color-primary-950), var(--md-sys-color-primary-050));
190
248
  --md-sys-color-primary-on-surface-variant: light-dark(var(--md-sys-color-primary-750), var(--md-sys-color-primary-250));
191
249
  --md-sys-color-primary-on-surface-hover: light-dark(var(--md-sys-color-primary-950), var(--md-sys-color-primary-050));
192
250
  --md-sys-color-primary-on-surface-active: light-dark(var(--md-sys-color-primary-950), var(--md-sys-color-primary-050));
193
- --md-sys-color-primary-on-surface-disabled: light-dark(var(--md-sys-color-primary-500-400), var(--md-sys-color-primary-500-400));
251
+ --md-sys-color-primary-on-surface-disabled: var(--md-sys-color-primary-500-400);
194
252
  --md-sys-color-primary-placeholder: light-dark(var(--md-sys-color-primary-650), var(--md-sys-color-primary-350));
195
- --md-sys-color-primary-outline: light-dark(var(--md-sys-color-primary-500-600), var(--md-sys-color-primary-500-600));
196
- --md-sys-color-primary-outline-variant: light-dark(var(--md-sys-color-primary-500-300), var(--md-sys-color-primary-500-300));
197
- --md-sys-color-primary-outline-hover: light-dark(var(--md-sys-color-primary-500-700), var(--md-sys-color-primary-500-700));
198
- --md-sys-color-primary-outline-active: light-dark(var(--md-sys-color-primary-500-800), var(--md-sys-color-primary-500-800));
199
- --md-sys-color-primary-outline-disabled: light-dark(var(--md-sys-color-primary-500-400), var(--md-sys-color-primary-500-400));
200
- --md-sys-color-primary-container: light-dark(var(--md-sys-color-primary-500-200), var(--md-sys-color-primary-500-200));
201
- --md-sys-color-primary-container-low: light-dark(var(--md-sys-color-primary-500-100), var(--md-sys-color-primary-500-100));
202
- --md-sys-color-primary-container-high: light-dark(var(--md-sys-color-primary-500-300), var(--md-sys-color-primary-500-300));
203
- --md-sys-color-primary-container-hover: light-dark(var(--md-sys-color-primary-500-300), var(--md-sys-color-primary-500-300));
204
- --md-sys-color-primary-container-active: light-dark(var(--md-sys-color-primary-500-400), var(--md-sys-color-primary-500-400));
205
- --md-sys-color-primary-container-disabled: light-dark(var(--md-sys-color-primary-500-100), var(--md-sys-color-primary-500-100));
253
+ --md-sys-color-primary-outline: var(--md-sys-color-primary-500-600);
254
+ --md-sys-color-primary-outline-variant: var(--md-sys-color-primary-500-300);
255
+ --md-sys-color-primary-outline-hover: var(--md-sys-color-primary-500-700);
256
+ --md-sys-color-primary-outline-active: var(--md-sys-color-primary-500-800);
257
+ --md-sys-color-primary-outline-disabled: var(--md-sys-color-primary-500-400);
258
+ --md-sys-color-primary-container: var(--md-sys-color-primary-500-200);
259
+ --md-sys-color-primary-container-low: var(--md-sys-color-primary-500-100);
260
+ --md-sys-color-primary-container-high: var(--md-sys-color-primary-500-300);
261
+ --md-sys-color-primary-container-hover: var(--md-sys-color-primary-500-300);
262
+ --md-sys-color-primary-container-active: var(--md-sys-color-primary-500-400);
263
+ --md-sys-color-primary-container-disabled: var(--md-sys-color-primary-500-100);
206
264
  --md-sys-color-primary-inverse-surface: light-dark(var(--md-sys-color-primary-900), var(--md-sys-color-primary-100));
207
265
  --md-sys-color-primary-inverse-on-surface: light-dark(var(--md-sys-color-primary-050), var(--md-sys-color-primary-950));
208
266
  --md-sys-color-primary-background: light-dark(var(--md-sys-color-primary-100), var(--md-sys-color-primary-900));
@@ -219,13 +277,13 @@
219
277
  --md-sys-color-primary-surface-high: light-dark(var(--md-sys-color-primary-150), var(--md-sys-color-primary-850));
220
278
  --md-sys-color-primary-surface-higher: light-dark(var(--md-sys-color-primary-175), var(--md-sys-color-primary-825));
221
279
  --md-sys-color-primary-surface-highest: light-dark(var(--md-sys-color-primary-200), var(--md-sys-color-primary-800));
222
- --md-sys-color-primary-scrim-weakest: light-dark(var(--md-sys-color-primary-500-050), var(--md-sys-color-primary-500-050));
223
- --md-sys-color-primary-scrim-weaker: light-dark(var(--md-sys-color-primary-500-100), var(--md-sys-color-primary-500-100));
224
- --md-sys-color-primary-scrim-weak: light-dark(var(--md-sys-color-primary-500-200), var(--md-sys-color-primary-500-200));
225
- --md-sys-color-primary-scrim: light-dark(var(--md-sys-color-primary-500-300), var(--md-sys-color-primary-500-300));
226
- --md-sys-color-primary-scrim-strong: light-dark(var(--md-sys-color-primary-500-400), var(--md-sys-color-primary-500-400));
227
- --md-sys-color-primary-scrim-stronger: light-dark(var(--md-sys-color-primary-500-500), var(--md-sys-color-primary-500-500));
228
- --md-sys-color-primary-scrim-strongest: light-dark(var(--md-sys-color-primary-500-600), var(--md-sys-color-primary-500-600));
280
+ --md-sys-color-primary-scrim-weakest: var(--md-sys-color-primary-500-050);
281
+ --md-sys-color-primary-scrim-weaker: var(--md-sys-color-primary-500-100);
282
+ --md-sys-color-primary-scrim-weak: var(--md-sys-color-primary-500-200);
283
+ --md-sys-color-primary-scrim: var(--md-sys-color-primary-500-300);
284
+ --md-sys-color-primary-scrim-strong: var(--md-sys-color-primary-500-400);
285
+ --md-sys-color-primary-scrim-stronger: var(--md-sys-color-primary-500-500);
286
+ --md-sys-color-primary-scrim-strongest: var(--md-sys-color-primary-500-600);
229
287
 
230
288
  /* Secondary — flat mode-independent primitives */
231
289
  --md-sys-color-secondary-100: oklch(0.9626 0.0021 197.12);
@@ -265,41 +323,42 @@
265
323
  --md-sys-color-secondary-500-900: oklch(0.6683 0.0985 204.61 / 90%);
266
324
  --md-sys-color-secondary-500-950: oklch(0.6683 0.0985 204.61 / 95%);
267
325
  /* Secondary — semantic roles */
268
- --md-sys-color-secondary: light-dark(var(--md-sys-color-secondary-650), var(--md-sys-color-secondary-650));
326
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
327
+ --md-sys-color-secondary: var(--md-sys-color-secondary-650);
269
328
  --md-sys-color-secondary-dim: light-dark(var(--md-sys-color-secondary-650), var(--md-sys-color-secondary-700));
270
329
  --md-sys-color-secondary-bright: light-dark(var(--md-sys-color-secondary-350), var(--md-sys-color-secondary-400));
271
330
  --md-sys-color-secondary-low: light-dark(var(--md-sys-color-secondary-350), var(--md-sys-color-secondary-700));
272
331
  --md-sys-color-secondary-high: light-dark(var(--md-sys-color-secondary-650), var(--md-sys-color-secondary-400));
273
- --md-sys-color-secondary-hover: light-dark(var(--md-sys-color-secondary-700), var(--md-sys-color-secondary-700));
274
- --md-sys-color-secondary-active: light-dark(var(--md-sys-color-secondary-750), var(--md-sys-color-secondary-750));
275
- --md-sys-color-secondary-disabled: light-dark(var(--md-sys-color-secondary-500-600), var(--md-sys-color-secondary-500-600));
276
- --md-sys-color-secondary-on-secondary: light-dark(var(--md-sys-color-secondary-050), var(--md-sys-color-secondary-050));
277
- --md-sys-color-secondary-on-secondary-variant: light-dark(var(--md-sys-color-secondary-200), var(--md-sys-color-secondary-200));
332
+ --md-sys-color-secondary-hover: var(--md-sys-color-secondary-700);
333
+ --md-sys-color-secondary-active: var(--md-sys-color-secondary-750);
334
+ --md-sys-color-secondary-disabled: var(--md-sys-color-secondary-500-600);
335
+ --md-sys-color-secondary-on-secondary: var(--md-sys-color-secondary-050);
336
+ --md-sys-color-secondary-on-secondary-variant: var(--md-sys-color-secondary-200);
278
337
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
279
338
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
280
339
  composited on the page bg); dark leg = the 200 stop, on-secondary-variant's own
281
340
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
282
341
  --md-sys-color-secondary-on-secondary-container: light-dark(var(--md-sys-color-secondary-950), var(--md-sys-color-secondary-200));
283
- --md-sys-color-secondary-on-secondary-hover: light-dark(var(--md-sys-color-secondary-050), var(--md-sys-color-secondary-050));
284
- --md-sys-color-secondary-on-secondary-active: light-dark(var(--md-sys-color-secondary-050), var(--md-sys-color-secondary-050));
285
- --md-sys-color-secondary-on-secondary-disabled: light-dark(var(--md-sys-color-secondary-500-400), var(--md-sys-color-secondary-500-400));
342
+ --md-sys-color-secondary-on-secondary-hover: var(--md-sys-color-secondary-050);
343
+ --md-sys-color-secondary-on-secondary-active: var(--md-sys-color-secondary-050);
344
+ --md-sys-color-secondary-on-secondary-disabled: var(--md-sys-color-secondary-500-400);
286
345
  --md-sys-color-secondary-on-surface: light-dark(var(--md-sys-color-secondary-950), var(--md-sys-color-secondary-050));
287
346
  --md-sys-color-secondary-on-surface-variant: light-dark(var(--md-sys-color-secondary-750), var(--md-sys-color-secondary-250));
288
347
  --md-sys-color-secondary-on-surface-hover: light-dark(var(--md-sys-color-secondary-950), var(--md-sys-color-secondary-050));
289
348
  --md-sys-color-secondary-on-surface-active: light-dark(var(--md-sys-color-secondary-950), var(--md-sys-color-secondary-050));
290
- --md-sys-color-secondary-on-surface-disabled: light-dark(var(--md-sys-color-secondary-500-400), var(--md-sys-color-secondary-500-400));
349
+ --md-sys-color-secondary-on-surface-disabled: var(--md-sys-color-secondary-500-400);
291
350
  --md-sys-color-secondary-placeholder: light-dark(var(--md-sys-color-secondary-650), var(--md-sys-color-secondary-350));
292
- --md-sys-color-secondary-outline: light-dark(var(--md-sys-color-secondary-500-600), var(--md-sys-color-secondary-500-600));
293
- --md-sys-color-secondary-outline-variant: light-dark(var(--md-sys-color-secondary-500-300), var(--md-sys-color-secondary-500-300));
294
- --md-sys-color-secondary-outline-hover: light-dark(var(--md-sys-color-secondary-500-700), var(--md-sys-color-secondary-500-700));
295
- --md-sys-color-secondary-outline-active: light-dark(var(--md-sys-color-secondary-500-800), var(--md-sys-color-secondary-500-800));
296
- --md-sys-color-secondary-outline-disabled: light-dark(var(--md-sys-color-secondary-500-400), var(--md-sys-color-secondary-500-400));
297
- --md-sys-color-secondary-container: light-dark(var(--md-sys-color-secondary-500-200), var(--md-sys-color-secondary-500-200));
298
- --md-sys-color-secondary-container-low: light-dark(var(--md-sys-color-secondary-500-100), var(--md-sys-color-secondary-500-100));
299
- --md-sys-color-secondary-container-high: light-dark(var(--md-sys-color-secondary-500-300), var(--md-sys-color-secondary-500-300));
300
- --md-sys-color-secondary-container-hover: light-dark(var(--md-sys-color-secondary-500-300), var(--md-sys-color-secondary-500-300));
301
- --md-sys-color-secondary-container-active: light-dark(var(--md-sys-color-secondary-500-400), var(--md-sys-color-secondary-500-400));
302
- --md-sys-color-secondary-container-disabled: light-dark(var(--md-sys-color-secondary-500-100), var(--md-sys-color-secondary-500-100));
351
+ --md-sys-color-secondary-outline: var(--md-sys-color-secondary-500-600);
352
+ --md-sys-color-secondary-outline-variant: var(--md-sys-color-secondary-500-300);
353
+ --md-sys-color-secondary-outline-hover: var(--md-sys-color-secondary-500-700);
354
+ --md-sys-color-secondary-outline-active: var(--md-sys-color-secondary-500-800);
355
+ --md-sys-color-secondary-outline-disabled: var(--md-sys-color-secondary-500-400);
356
+ --md-sys-color-secondary-container: var(--md-sys-color-secondary-500-200);
357
+ --md-sys-color-secondary-container-low: var(--md-sys-color-secondary-500-100);
358
+ --md-sys-color-secondary-container-high: var(--md-sys-color-secondary-500-300);
359
+ --md-sys-color-secondary-container-hover: var(--md-sys-color-secondary-500-300);
360
+ --md-sys-color-secondary-container-active: var(--md-sys-color-secondary-500-400);
361
+ --md-sys-color-secondary-container-disabled: var(--md-sys-color-secondary-500-100);
303
362
  --md-sys-color-secondary-inverse-surface: light-dark(var(--md-sys-color-secondary-900), var(--md-sys-color-secondary-100));
304
363
  --md-sys-color-secondary-inverse-on-surface: light-dark(var(--md-sys-color-secondary-050), var(--md-sys-color-secondary-950));
305
364
  --md-sys-color-secondary-background: light-dark(var(--md-sys-color-secondary-100), var(--md-sys-color-secondary-900));
@@ -316,13 +375,13 @@
316
375
  --md-sys-color-secondary-surface-high: light-dark(var(--md-sys-color-secondary-150), var(--md-sys-color-secondary-850));
317
376
  --md-sys-color-secondary-surface-higher: light-dark(var(--md-sys-color-secondary-175), var(--md-sys-color-secondary-825));
318
377
  --md-sys-color-secondary-surface-highest: light-dark(var(--md-sys-color-secondary-200), var(--md-sys-color-secondary-800));
319
- --md-sys-color-secondary-scrim-weakest: light-dark(var(--md-sys-color-secondary-500-050), var(--md-sys-color-secondary-500-050));
320
- --md-sys-color-secondary-scrim-weaker: light-dark(var(--md-sys-color-secondary-500-100), var(--md-sys-color-secondary-500-100));
321
- --md-sys-color-secondary-scrim-weak: light-dark(var(--md-sys-color-secondary-500-200), var(--md-sys-color-secondary-500-200));
322
- --md-sys-color-secondary-scrim: light-dark(var(--md-sys-color-secondary-500-300), var(--md-sys-color-secondary-500-300));
323
- --md-sys-color-secondary-scrim-strong: light-dark(var(--md-sys-color-secondary-500-400), var(--md-sys-color-secondary-500-400));
324
- --md-sys-color-secondary-scrim-stronger: light-dark(var(--md-sys-color-secondary-500-500), var(--md-sys-color-secondary-500-500));
325
- --md-sys-color-secondary-scrim-strongest: light-dark(var(--md-sys-color-secondary-500-600), var(--md-sys-color-secondary-500-600));
378
+ --md-sys-color-secondary-scrim-weakest: var(--md-sys-color-secondary-500-050);
379
+ --md-sys-color-secondary-scrim-weaker: var(--md-sys-color-secondary-500-100);
380
+ --md-sys-color-secondary-scrim-weak: var(--md-sys-color-secondary-500-200);
381
+ --md-sys-color-secondary-scrim: var(--md-sys-color-secondary-500-300);
382
+ --md-sys-color-secondary-scrim-strong: var(--md-sys-color-secondary-500-400);
383
+ --md-sys-color-secondary-scrim-stronger: var(--md-sys-color-secondary-500-500);
384
+ --md-sys-color-secondary-scrim-strongest: var(--md-sys-color-secondary-500-600);
326
385
 
327
386
  /* Tertiary — flat mode-independent primitives */
328
387
  --md-sys-color-tertiary-100: oklch(0.9549 0.0029 264.54);
@@ -362,41 +421,42 @@
362
421
  --md-sys-color-tertiary-500-900: oklch(0.5993 0.2006 285.17 / 90%);
363
422
  --md-sys-color-tertiary-500-950: oklch(0.5993 0.2006 285.17 / 95%);
364
423
  /* Tertiary — semantic roles */
365
- --md-sys-color-tertiary: light-dark(var(--md-sys-color-tertiary-600), var(--md-sys-color-tertiary-600));
424
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
425
+ --md-sys-color-tertiary: var(--md-sys-color-tertiary-600);
366
426
  --md-sys-color-tertiary-dim: light-dark(var(--md-sys-color-tertiary-650), var(--md-sys-color-tertiary-700));
367
427
  --md-sys-color-tertiary-bright: light-dark(var(--md-sys-color-tertiary-350), var(--md-sys-color-tertiary-400));
368
428
  --md-sys-color-tertiary-low: light-dark(var(--md-sys-color-tertiary-350), var(--md-sys-color-tertiary-700));
369
429
  --md-sys-color-tertiary-high: light-dark(var(--md-sys-color-tertiary-650), var(--md-sys-color-tertiary-400));
370
- --md-sys-color-tertiary-hover: light-dark(var(--md-sys-color-tertiary-650), var(--md-sys-color-tertiary-650));
371
- --md-sys-color-tertiary-active: light-dark(var(--md-sys-color-tertiary-700), var(--md-sys-color-tertiary-700));
372
- --md-sys-color-tertiary-disabled: light-dark(var(--md-sys-color-tertiary-500-600), var(--md-sys-color-tertiary-500-600));
373
- --md-sys-color-tertiary-on-tertiary: light-dark(var(--md-sys-color-tertiary-050), var(--md-sys-color-tertiary-050));
374
- --md-sys-color-tertiary-on-tertiary-variant: light-dark(var(--md-sys-color-tertiary-200), var(--md-sys-color-tertiary-200));
430
+ --md-sys-color-tertiary-hover: var(--md-sys-color-tertiary-650);
431
+ --md-sys-color-tertiary-active: var(--md-sys-color-tertiary-700);
432
+ --md-sys-color-tertiary-disabled: var(--md-sys-color-tertiary-500-600);
433
+ --md-sys-color-tertiary-on-tertiary: var(--md-sys-color-tertiary-050);
434
+ --md-sys-color-tertiary-on-tertiary-variant: var(--md-sys-color-tertiary-200);
375
435
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
376
436
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
377
437
  composited on the page bg); dark leg = the 200 stop, on-tertiary-variant's own
378
438
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
379
439
  --md-sys-color-tertiary-on-tertiary-container: light-dark(var(--md-sys-color-tertiary-950), var(--md-sys-color-tertiary-200));
380
- --md-sys-color-tertiary-on-tertiary-hover: light-dark(var(--md-sys-color-tertiary-050), var(--md-sys-color-tertiary-050));
381
- --md-sys-color-tertiary-on-tertiary-active: light-dark(var(--md-sys-color-tertiary-050), var(--md-sys-color-tertiary-050));
382
- --md-sys-color-tertiary-on-tertiary-disabled: light-dark(var(--md-sys-color-tertiary-500-400), var(--md-sys-color-tertiary-500-400));
440
+ --md-sys-color-tertiary-on-tertiary-hover: var(--md-sys-color-tertiary-050);
441
+ --md-sys-color-tertiary-on-tertiary-active: var(--md-sys-color-tertiary-050);
442
+ --md-sys-color-tertiary-on-tertiary-disabled: var(--md-sys-color-tertiary-500-400);
383
443
  --md-sys-color-tertiary-on-surface: light-dark(var(--md-sys-color-tertiary-950), var(--md-sys-color-tertiary-050));
384
444
  --md-sys-color-tertiary-on-surface-variant: light-dark(var(--md-sys-color-tertiary-750), var(--md-sys-color-tertiary-250));
385
445
  --md-sys-color-tertiary-on-surface-hover: light-dark(var(--md-sys-color-tertiary-950), var(--md-sys-color-tertiary-050));
386
446
  --md-sys-color-tertiary-on-surface-active: light-dark(var(--md-sys-color-tertiary-950), var(--md-sys-color-tertiary-050));
387
- --md-sys-color-tertiary-on-surface-disabled: light-dark(var(--md-sys-color-tertiary-500-400), var(--md-sys-color-tertiary-500-400));
447
+ --md-sys-color-tertiary-on-surface-disabled: var(--md-sys-color-tertiary-500-400);
388
448
  --md-sys-color-tertiary-placeholder: light-dark(var(--md-sys-color-tertiary-650), var(--md-sys-color-tertiary-350));
389
- --md-sys-color-tertiary-outline: light-dark(var(--md-sys-color-tertiary-500-600), var(--md-sys-color-tertiary-500-600));
390
- --md-sys-color-tertiary-outline-variant: light-dark(var(--md-sys-color-tertiary-500-300), var(--md-sys-color-tertiary-500-300));
391
- --md-sys-color-tertiary-outline-hover: light-dark(var(--md-sys-color-tertiary-500-700), var(--md-sys-color-tertiary-500-700));
392
- --md-sys-color-tertiary-outline-active: light-dark(var(--md-sys-color-tertiary-500-800), var(--md-sys-color-tertiary-500-800));
393
- --md-sys-color-tertiary-outline-disabled: light-dark(var(--md-sys-color-tertiary-500-400), var(--md-sys-color-tertiary-500-400));
394
- --md-sys-color-tertiary-container: light-dark(var(--md-sys-color-tertiary-500-200), var(--md-sys-color-tertiary-500-200));
395
- --md-sys-color-tertiary-container-low: light-dark(var(--md-sys-color-tertiary-500-100), var(--md-sys-color-tertiary-500-100));
396
- --md-sys-color-tertiary-container-high: light-dark(var(--md-sys-color-tertiary-500-300), var(--md-sys-color-tertiary-500-300));
397
- --md-sys-color-tertiary-container-hover: light-dark(var(--md-sys-color-tertiary-500-300), var(--md-sys-color-tertiary-500-300));
398
- --md-sys-color-tertiary-container-active: light-dark(var(--md-sys-color-tertiary-500-400), var(--md-sys-color-tertiary-500-400));
399
- --md-sys-color-tertiary-container-disabled: light-dark(var(--md-sys-color-tertiary-500-100), var(--md-sys-color-tertiary-500-100));
449
+ --md-sys-color-tertiary-outline: var(--md-sys-color-tertiary-500-600);
450
+ --md-sys-color-tertiary-outline-variant: var(--md-sys-color-tertiary-500-300);
451
+ --md-sys-color-tertiary-outline-hover: var(--md-sys-color-tertiary-500-700);
452
+ --md-sys-color-tertiary-outline-active: var(--md-sys-color-tertiary-500-800);
453
+ --md-sys-color-tertiary-outline-disabled: var(--md-sys-color-tertiary-500-400);
454
+ --md-sys-color-tertiary-container: var(--md-sys-color-tertiary-500-200);
455
+ --md-sys-color-tertiary-container-low: var(--md-sys-color-tertiary-500-100);
456
+ --md-sys-color-tertiary-container-high: var(--md-sys-color-tertiary-500-300);
457
+ --md-sys-color-tertiary-container-hover: var(--md-sys-color-tertiary-500-300);
458
+ --md-sys-color-tertiary-container-active: var(--md-sys-color-tertiary-500-400);
459
+ --md-sys-color-tertiary-container-disabled: var(--md-sys-color-tertiary-500-100);
400
460
  --md-sys-color-tertiary-inverse-surface: light-dark(var(--md-sys-color-tertiary-900), var(--md-sys-color-tertiary-100));
401
461
  --md-sys-color-tertiary-inverse-on-surface: light-dark(var(--md-sys-color-tertiary-050), var(--md-sys-color-tertiary-950));
402
462
  --md-sys-color-tertiary-background: light-dark(var(--md-sys-color-tertiary-100), var(--md-sys-color-tertiary-900));
@@ -413,13 +473,13 @@
413
473
  --md-sys-color-tertiary-surface-high: light-dark(var(--md-sys-color-tertiary-150), var(--md-sys-color-tertiary-850));
414
474
  --md-sys-color-tertiary-surface-higher: light-dark(var(--md-sys-color-tertiary-175), var(--md-sys-color-tertiary-825));
415
475
  --md-sys-color-tertiary-surface-highest: light-dark(var(--md-sys-color-tertiary-200), var(--md-sys-color-tertiary-800));
416
- --md-sys-color-tertiary-scrim-weakest: light-dark(var(--md-sys-color-tertiary-500-050), var(--md-sys-color-tertiary-500-050));
417
- --md-sys-color-tertiary-scrim-weaker: light-dark(var(--md-sys-color-tertiary-500-100), var(--md-sys-color-tertiary-500-100));
418
- --md-sys-color-tertiary-scrim-weak: light-dark(var(--md-sys-color-tertiary-500-200), var(--md-sys-color-tertiary-500-200));
419
- --md-sys-color-tertiary-scrim: light-dark(var(--md-sys-color-tertiary-500-300), var(--md-sys-color-tertiary-500-300));
420
- --md-sys-color-tertiary-scrim-strong: light-dark(var(--md-sys-color-tertiary-500-400), var(--md-sys-color-tertiary-500-400));
421
- --md-sys-color-tertiary-scrim-stronger: light-dark(var(--md-sys-color-tertiary-500-500), var(--md-sys-color-tertiary-500-500));
422
- --md-sys-color-tertiary-scrim-strongest: light-dark(var(--md-sys-color-tertiary-500-600), var(--md-sys-color-tertiary-500-600));
476
+ --md-sys-color-tertiary-scrim-weakest: var(--md-sys-color-tertiary-500-050);
477
+ --md-sys-color-tertiary-scrim-weaker: var(--md-sys-color-tertiary-500-100);
478
+ --md-sys-color-tertiary-scrim-weak: var(--md-sys-color-tertiary-500-200);
479
+ --md-sys-color-tertiary-scrim: var(--md-sys-color-tertiary-500-300);
480
+ --md-sys-color-tertiary-scrim-strong: var(--md-sys-color-tertiary-500-400);
481
+ --md-sys-color-tertiary-scrim-stronger: var(--md-sys-color-tertiary-500-500);
482
+ --md-sys-color-tertiary-scrim-strongest: var(--md-sys-color-tertiary-500-600);
423
483
 
424
484
  /* Info — flat mode-independent primitives */
425
485
  --md-sys-color-info-100: oklch(0.9549 0.0029 264.54);
@@ -459,41 +519,42 @@
459
519
  --md-sys-color-info-500-900: oklch(0.5984 0.1736 265.15 / 90%);
460
520
  --md-sys-color-info-500-950: oklch(0.5984 0.1736 265.15 / 95%);
461
521
  /* Info — semantic roles */
462
- --md-sys-color-info: light-dark(var(--md-sys-color-info-600), var(--md-sys-color-info-600));
522
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
523
+ --md-sys-color-info: var(--md-sys-color-info-600);
463
524
  --md-sys-color-info-dim: light-dark(var(--md-sys-color-info-650), var(--md-sys-color-info-700));
464
525
  --md-sys-color-info-bright: light-dark(var(--md-sys-color-info-350), var(--md-sys-color-info-400));
465
526
  --md-sys-color-info-low: light-dark(var(--md-sys-color-info-350), var(--md-sys-color-info-700));
466
527
  --md-sys-color-info-high: light-dark(var(--md-sys-color-info-650), var(--md-sys-color-info-400));
467
- --md-sys-color-info-hover: light-dark(var(--md-sys-color-info-650), var(--md-sys-color-info-650));
468
- --md-sys-color-info-active: light-dark(var(--md-sys-color-info-700), var(--md-sys-color-info-700));
469
- --md-sys-color-info-disabled: light-dark(var(--md-sys-color-info-500-600), var(--md-sys-color-info-500-600));
470
- --md-sys-color-info-on-info: light-dark(var(--md-sys-color-info-050), var(--md-sys-color-info-050));
471
- --md-sys-color-info-on-info-variant: light-dark(var(--md-sys-color-info-200), var(--md-sys-color-info-200));
528
+ --md-sys-color-info-hover: var(--md-sys-color-info-650);
529
+ --md-sys-color-info-active: var(--md-sys-color-info-700);
530
+ --md-sys-color-info-disabled: var(--md-sys-color-info-500-600);
531
+ --md-sys-color-info-on-info: var(--md-sys-color-info-050);
532
+ --md-sys-color-info-on-info-variant: var(--md-sys-color-info-200);
472
533
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
473
534
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
474
535
  composited on the page bg); dark leg = the 200 stop, on-info-variant's own
475
536
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
476
537
  --md-sys-color-info-on-info-container: light-dark(var(--md-sys-color-info-950), var(--md-sys-color-info-200));
477
- --md-sys-color-info-on-info-hover: light-dark(var(--md-sys-color-info-050), var(--md-sys-color-info-050));
478
- --md-sys-color-info-on-info-active: light-dark(var(--md-sys-color-info-050), var(--md-sys-color-info-050));
479
- --md-sys-color-info-on-info-disabled: light-dark(var(--md-sys-color-info-500-400), var(--md-sys-color-info-500-400));
538
+ --md-sys-color-info-on-info-hover: var(--md-sys-color-info-050);
539
+ --md-sys-color-info-on-info-active: var(--md-sys-color-info-050);
540
+ --md-sys-color-info-on-info-disabled: var(--md-sys-color-info-500-400);
480
541
  --md-sys-color-info-on-surface: light-dark(var(--md-sys-color-info-950), var(--md-sys-color-info-050));
481
542
  --md-sys-color-info-on-surface-variant: light-dark(var(--md-sys-color-info-750), var(--md-sys-color-info-250));
482
543
  --md-sys-color-info-on-surface-hover: light-dark(var(--md-sys-color-info-950), var(--md-sys-color-info-050));
483
544
  --md-sys-color-info-on-surface-active: light-dark(var(--md-sys-color-info-950), var(--md-sys-color-info-050));
484
- --md-sys-color-info-on-surface-disabled: light-dark(var(--md-sys-color-info-500-400), var(--md-sys-color-info-500-400));
545
+ --md-sys-color-info-on-surface-disabled: var(--md-sys-color-info-500-400);
485
546
  --md-sys-color-info-placeholder: light-dark(var(--md-sys-color-info-650), var(--md-sys-color-info-350));
486
- --md-sys-color-info-outline: light-dark(var(--md-sys-color-info-500-600), var(--md-sys-color-info-500-600));
487
- --md-sys-color-info-outline-variant: light-dark(var(--md-sys-color-info-500-300), var(--md-sys-color-info-500-300));
488
- --md-sys-color-info-outline-hover: light-dark(var(--md-sys-color-info-500-700), var(--md-sys-color-info-500-700));
489
- --md-sys-color-info-outline-active: light-dark(var(--md-sys-color-info-500-800), var(--md-sys-color-info-500-800));
490
- --md-sys-color-info-outline-disabled: light-dark(var(--md-sys-color-info-500-400), var(--md-sys-color-info-500-400));
491
- --md-sys-color-info-container: light-dark(var(--md-sys-color-info-500-200), var(--md-sys-color-info-500-200));
492
- --md-sys-color-info-container-low: light-dark(var(--md-sys-color-info-500-100), var(--md-sys-color-info-500-100));
493
- --md-sys-color-info-container-high: light-dark(var(--md-sys-color-info-500-300), var(--md-sys-color-info-500-300));
494
- --md-sys-color-info-container-hover: light-dark(var(--md-sys-color-info-500-300), var(--md-sys-color-info-500-300));
495
- --md-sys-color-info-container-active: light-dark(var(--md-sys-color-info-500-400), var(--md-sys-color-info-500-400));
496
- --md-sys-color-info-container-disabled: light-dark(var(--md-sys-color-info-500-100), var(--md-sys-color-info-500-100));
547
+ --md-sys-color-info-outline: var(--md-sys-color-info-500-600);
548
+ --md-sys-color-info-outline-variant: var(--md-sys-color-info-500-300);
549
+ --md-sys-color-info-outline-hover: var(--md-sys-color-info-500-700);
550
+ --md-sys-color-info-outline-active: var(--md-sys-color-info-500-800);
551
+ --md-sys-color-info-outline-disabled: var(--md-sys-color-info-500-400);
552
+ --md-sys-color-info-container: var(--md-sys-color-info-500-200);
553
+ --md-sys-color-info-container-low: var(--md-sys-color-info-500-100);
554
+ --md-sys-color-info-container-high: var(--md-sys-color-info-500-300);
555
+ --md-sys-color-info-container-hover: var(--md-sys-color-info-500-300);
556
+ --md-sys-color-info-container-active: var(--md-sys-color-info-500-400);
557
+ --md-sys-color-info-container-disabled: var(--md-sys-color-info-500-100);
497
558
  --md-sys-color-info-inverse-surface: light-dark(var(--md-sys-color-info-900), var(--md-sys-color-info-100));
498
559
  --md-sys-color-info-inverse-on-surface: light-dark(var(--md-sys-color-info-050), var(--md-sys-color-info-950));
499
560
  --md-sys-color-info-background: light-dark(var(--md-sys-color-info-100), var(--md-sys-color-info-900));
@@ -510,13 +571,13 @@
510
571
  --md-sys-color-info-surface-high: light-dark(var(--md-sys-color-info-150), var(--md-sys-color-info-850));
511
572
  --md-sys-color-info-surface-higher: light-dark(var(--md-sys-color-info-175), var(--md-sys-color-info-825));
512
573
  --md-sys-color-info-surface-highest: light-dark(var(--md-sys-color-info-200), var(--md-sys-color-info-800));
513
- --md-sys-color-info-scrim-weakest: light-dark(var(--md-sys-color-info-500-050), var(--md-sys-color-info-500-050));
514
- --md-sys-color-info-scrim-weaker: light-dark(var(--md-sys-color-info-500-100), var(--md-sys-color-info-500-100));
515
- --md-sys-color-info-scrim-weak: light-dark(var(--md-sys-color-info-500-200), var(--md-sys-color-info-500-200));
516
- --md-sys-color-info-scrim: light-dark(var(--md-sys-color-info-500-300), var(--md-sys-color-info-500-300));
517
- --md-sys-color-info-scrim-strong: light-dark(var(--md-sys-color-info-500-400), var(--md-sys-color-info-500-400));
518
- --md-sys-color-info-scrim-stronger: light-dark(var(--md-sys-color-info-500-500), var(--md-sys-color-info-500-500));
519
- --md-sys-color-info-scrim-strongest: light-dark(var(--md-sys-color-info-500-600), var(--md-sys-color-info-500-600));
574
+ --md-sys-color-info-scrim-weakest: var(--md-sys-color-info-500-050);
575
+ --md-sys-color-info-scrim-weaker: var(--md-sys-color-info-500-100);
576
+ --md-sys-color-info-scrim-weak: var(--md-sys-color-info-500-200);
577
+ --md-sys-color-info-scrim: var(--md-sys-color-info-500-300);
578
+ --md-sys-color-info-scrim-strong: var(--md-sys-color-info-500-400);
579
+ --md-sys-color-info-scrim-stronger: var(--md-sys-color-info-500-500);
580
+ --md-sys-color-info-scrim-strongest: var(--md-sys-color-info-500-600);
520
581
 
521
582
  /* Success — flat mode-independent primitives */
522
583
  --md-sys-color-success-100: oklch(0.9561 0.0034 145.55);
@@ -556,41 +617,42 @@
556
617
  --md-sys-color-success-500-900: oklch(0.5987 0.1161 150.34 / 90%);
557
618
  --md-sys-color-success-500-950: oklch(0.5987 0.1161 150.34 / 95%);
558
619
  /* Success — semantic roles */
559
- --md-sys-color-success: light-dark(var(--md-sys-color-success-600), var(--md-sys-color-success-600));
620
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
621
+ --md-sys-color-success: var(--md-sys-color-success-600);
560
622
  --md-sys-color-success-dim: light-dark(var(--md-sys-color-success-650), var(--md-sys-color-success-700));
561
623
  --md-sys-color-success-bright: light-dark(var(--md-sys-color-success-350), var(--md-sys-color-success-400));
562
624
  --md-sys-color-success-low: light-dark(var(--md-sys-color-success-350), var(--md-sys-color-success-700));
563
625
  --md-sys-color-success-high: light-dark(var(--md-sys-color-success-650), var(--md-sys-color-success-400));
564
- --md-sys-color-success-hover: light-dark(var(--md-sys-color-success-650), var(--md-sys-color-success-650));
565
- --md-sys-color-success-active: light-dark(var(--md-sys-color-success-700), var(--md-sys-color-success-700));
566
- --md-sys-color-success-disabled: light-dark(var(--md-sys-color-success-500-600), var(--md-sys-color-success-500-600));
567
- --md-sys-color-success-on-success: light-dark(var(--md-sys-color-success-050), var(--md-sys-color-success-050));
568
- --md-sys-color-success-on-success-variant: light-dark(var(--md-sys-color-success-200), var(--md-sys-color-success-200));
626
+ --md-sys-color-success-hover: var(--md-sys-color-success-650);
627
+ --md-sys-color-success-active: var(--md-sys-color-success-700);
628
+ --md-sys-color-success-disabled: var(--md-sys-color-success-500-600);
629
+ --md-sys-color-success-on-success: var(--md-sys-color-success-050);
630
+ --md-sys-color-success-on-success-variant: var(--md-sys-color-success-200);
569
631
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
570
632
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
571
633
  composited on the page bg); dark leg = the 200 stop, on-success-variant's own
572
634
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
573
635
  --md-sys-color-success-on-success-container: light-dark(var(--md-sys-color-success-950), var(--md-sys-color-success-200));
574
- --md-sys-color-success-on-success-hover: light-dark(var(--md-sys-color-success-050), var(--md-sys-color-success-050));
575
- --md-sys-color-success-on-success-active: light-dark(var(--md-sys-color-success-050), var(--md-sys-color-success-050));
576
- --md-sys-color-success-on-success-disabled: light-dark(var(--md-sys-color-success-500-400), var(--md-sys-color-success-500-400));
636
+ --md-sys-color-success-on-success-hover: var(--md-sys-color-success-050);
637
+ --md-sys-color-success-on-success-active: var(--md-sys-color-success-050);
638
+ --md-sys-color-success-on-success-disabled: var(--md-sys-color-success-500-400);
577
639
  --md-sys-color-success-on-surface: light-dark(var(--md-sys-color-success-950), var(--md-sys-color-success-050));
578
640
  --md-sys-color-success-on-surface-variant: light-dark(var(--md-sys-color-success-750), var(--md-sys-color-success-250));
579
641
  --md-sys-color-success-on-surface-hover: light-dark(var(--md-sys-color-success-950), var(--md-sys-color-success-050));
580
642
  --md-sys-color-success-on-surface-active: light-dark(var(--md-sys-color-success-950), var(--md-sys-color-success-050));
581
- --md-sys-color-success-on-surface-disabled: light-dark(var(--md-sys-color-success-500-400), var(--md-sys-color-success-500-400));
643
+ --md-sys-color-success-on-surface-disabled: var(--md-sys-color-success-500-400);
582
644
  --md-sys-color-success-placeholder: light-dark(var(--md-sys-color-success-650), var(--md-sys-color-success-350));
583
- --md-sys-color-success-outline: light-dark(var(--md-sys-color-success-500-600), var(--md-sys-color-success-500-600));
584
- --md-sys-color-success-outline-variant: light-dark(var(--md-sys-color-success-500-300), var(--md-sys-color-success-500-300));
585
- --md-sys-color-success-outline-hover: light-dark(var(--md-sys-color-success-500-700), var(--md-sys-color-success-500-700));
586
- --md-sys-color-success-outline-active: light-dark(var(--md-sys-color-success-500-800), var(--md-sys-color-success-500-800));
587
- --md-sys-color-success-outline-disabled: light-dark(var(--md-sys-color-success-500-400), var(--md-sys-color-success-500-400));
588
- --md-sys-color-success-container: light-dark(var(--md-sys-color-success-500-200), var(--md-sys-color-success-500-200));
589
- --md-sys-color-success-container-low: light-dark(var(--md-sys-color-success-500-100), var(--md-sys-color-success-500-100));
590
- --md-sys-color-success-container-high: light-dark(var(--md-sys-color-success-500-300), var(--md-sys-color-success-500-300));
591
- --md-sys-color-success-container-hover: light-dark(var(--md-sys-color-success-500-300), var(--md-sys-color-success-500-300));
592
- --md-sys-color-success-container-active: light-dark(var(--md-sys-color-success-500-400), var(--md-sys-color-success-500-400));
593
- --md-sys-color-success-container-disabled: light-dark(var(--md-sys-color-success-500-100), var(--md-sys-color-success-500-100));
645
+ --md-sys-color-success-outline: var(--md-sys-color-success-500-600);
646
+ --md-sys-color-success-outline-variant: var(--md-sys-color-success-500-300);
647
+ --md-sys-color-success-outline-hover: var(--md-sys-color-success-500-700);
648
+ --md-sys-color-success-outline-active: var(--md-sys-color-success-500-800);
649
+ --md-sys-color-success-outline-disabled: var(--md-sys-color-success-500-400);
650
+ --md-sys-color-success-container: var(--md-sys-color-success-500-200);
651
+ --md-sys-color-success-container-low: var(--md-sys-color-success-500-100);
652
+ --md-sys-color-success-container-high: var(--md-sys-color-success-500-300);
653
+ --md-sys-color-success-container-hover: var(--md-sys-color-success-500-300);
654
+ --md-sys-color-success-container-active: var(--md-sys-color-success-500-400);
655
+ --md-sys-color-success-container-disabled: var(--md-sys-color-success-500-100);
594
656
  --md-sys-color-success-inverse-surface: light-dark(var(--md-sys-color-success-900), var(--md-sys-color-success-100));
595
657
  --md-sys-color-success-inverse-on-surface: light-dark(var(--md-sys-color-success-050), var(--md-sys-color-success-950));
596
658
  --md-sys-color-success-background: light-dark(var(--md-sys-color-success-100), var(--md-sys-color-success-900));
@@ -607,13 +669,13 @@
607
669
  --md-sys-color-success-surface-high: light-dark(var(--md-sys-color-success-150), var(--md-sys-color-success-850));
608
670
  --md-sys-color-success-surface-higher: light-dark(var(--md-sys-color-success-175), var(--md-sys-color-success-825));
609
671
  --md-sys-color-success-surface-highest: light-dark(var(--md-sys-color-success-200), var(--md-sys-color-success-800));
610
- --md-sys-color-success-scrim-weakest: light-dark(var(--md-sys-color-success-500-050), var(--md-sys-color-success-500-050));
611
- --md-sys-color-success-scrim-weaker: light-dark(var(--md-sys-color-success-500-100), var(--md-sys-color-success-500-100));
612
- --md-sys-color-success-scrim-weak: light-dark(var(--md-sys-color-success-500-200), var(--md-sys-color-success-500-200));
613
- --md-sys-color-success-scrim: light-dark(var(--md-sys-color-success-500-300), var(--md-sys-color-success-500-300));
614
- --md-sys-color-success-scrim-strong: light-dark(var(--md-sys-color-success-500-400), var(--md-sys-color-success-500-400));
615
- --md-sys-color-success-scrim-stronger: light-dark(var(--md-sys-color-success-500-500), var(--md-sys-color-success-500-500));
616
- --md-sys-color-success-scrim-strongest: light-dark(var(--md-sys-color-success-500-600), var(--md-sys-color-success-500-600));
672
+ --md-sys-color-success-scrim-weakest: var(--md-sys-color-success-500-050);
673
+ --md-sys-color-success-scrim-weaker: var(--md-sys-color-success-500-100);
674
+ --md-sys-color-success-scrim-weak: var(--md-sys-color-success-500-200);
675
+ --md-sys-color-success-scrim: var(--md-sys-color-success-500-300);
676
+ --md-sys-color-success-scrim-strong: var(--md-sys-color-success-500-400);
677
+ --md-sys-color-success-scrim-stronger: var(--md-sys-color-success-500-500);
678
+ --md-sys-color-success-scrim-strongest: var(--md-sys-color-success-500-600);
617
679
 
618
680
  /* Warning — flat mode-independent primitives */
619
681
  --md-sys-color-warning-100: oklch(0.9766 0.0017 67.8);
@@ -653,41 +715,42 @@
653
715
  --md-sys-color-warning-500-900: oklch(0.791 0.1581 75.1 / 90%);
654
716
  --md-sys-color-warning-500-950: oklch(0.791 0.1581 75.1 / 95%);
655
717
  /* Warning — semantic roles */
656
- --md-sys-color-warning: light-dark(var(--md-sys-color-warning-700), var(--md-sys-color-warning-700));
718
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
719
+ --md-sys-color-warning: var(--md-sys-color-warning-700);
657
720
  --md-sys-color-warning-dim: light-dark(var(--md-sys-color-warning-650), var(--md-sys-color-warning-700));
658
721
  --md-sys-color-warning-bright: light-dark(var(--md-sys-color-warning-350), var(--md-sys-color-warning-400));
659
722
  --md-sys-color-warning-low: light-dark(var(--md-sys-color-warning-350), var(--md-sys-color-warning-700));
660
723
  --md-sys-color-warning-high: light-dark(var(--md-sys-color-warning-650), var(--md-sys-color-warning-400));
661
- --md-sys-color-warning-hover: light-dark(var(--md-sys-color-warning-750), var(--md-sys-color-warning-750));
662
- --md-sys-color-warning-active: light-dark(var(--md-sys-color-warning-800), var(--md-sys-color-warning-800));
663
- --md-sys-color-warning-disabled: light-dark(var(--md-sys-color-warning-500-600), var(--md-sys-color-warning-500-600));
664
- --md-sys-color-warning-on-warning: light-dark(var(--md-sys-color-warning-050), var(--md-sys-color-warning-050));
665
- --md-sys-color-warning-on-warning-variant: light-dark(var(--md-sys-color-warning-200), var(--md-sys-color-warning-200));
724
+ --md-sys-color-warning-hover: var(--md-sys-color-warning-750);
725
+ --md-sys-color-warning-active: var(--md-sys-color-warning-800);
726
+ --md-sys-color-warning-disabled: var(--md-sys-color-warning-500-600);
727
+ --md-sys-color-warning-on-warning: var(--md-sys-color-warning-050);
728
+ --md-sys-color-warning-on-warning-variant: var(--md-sys-color-warning-200);
666
729
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
667
730
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
668
731
  composited on the page bg); dark leg = the 200 stop, on-warning-variant's own
669
732
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
670
733
  --md-sys-color-warning-on-warning-container: light-dark(var(--md-sys-color-warning-950), var(--md-sys-color-warning-200));
671
- --md-sys-color-warning-on-warning-hover: light-dark(var(--md-sys-color-warning-050), var(--md-sys-color-warning-050));
672
- --md-sys-color-warning-on-warning-active: light-dark(var(--md-sys-color-warning-050), var(--md-sys-color-warning-050));
673
- --md-sys-color-warning-on-warning-disabled: light-dark(var(--md-sys-color-warning-500-400), var(--md-sys-color-warning-500-400));
734
+ --md-sys-color-warning-on-warning-hover: var(--md-sys-color-warning-050);
735
+ --md-sys-color-warning-on-warning-active: var(--md-sys-color-warning-050);
736
+ --md-sys-color-warning-on-warning-disabled: var(--md-sys-color-warning-500-400);
674
737
  --md-sys-color-warning-on-surface: light-dark(var(--md-sys-color-warning-950), var(--md-sys-color-warning-050));
675
738
  --md-sys-color-warning-on-surface-variant: light-dark(var(--md-sys-color-warning-750), var(--md-sys-color-warning-250));
676
739
  --md-sys-color-warning-on-surface-hover: light-dark(var(--md-sys-color-warning-950), var(--md-sys-color-warning-050));
677
740
  --md-sys-color-warning-on-surface-active: light-dark(var(--md-sys-color-warning-950), var(--md-sys-color-warning-050));
678
- --md-sys-color-warning-on-surface-disabled: light-dark(var(--md-sys-color-warning-500-400), var(--md-sys-color-warning-500-400));
741
+ --md-sys-color-warning-on-surface-disabled: var(--md-sys-color-warning-500-400);
679
742
  --md-sys-color-warning-placeholder: light-dark(var(--md-sys-color-warning-650), var(--md-sys-color-warning-350));
680
- --md-sys-color-warning-outline: light-dark(var(--md-sys-color-warning-500-600), var(--md-sys-color-warning-500-600));
681
- --md-sys-color-warning-outline-variant: light-dark(var(--md-sys-color-warning-500-300), var(--md-sys-color-warning-500-300));
682
- --md-sys-color-warning-outline-hover: light-dark(var(--md-sys-color-warning-500-700), var(--md-sys-color-warning-500-700));
683
- --md-sys-color-warning-outline-active: light-dark(var(--md-sys-color-warning-500-800), var(--md-sys-color-warning-500-800));
684
- --md-sys-color-warning-outline-disabled: light-dark(var(--md-sys-color-warning-500-400), var(--md-sys-color-warning-500-400));
685
- --md-sys-color-warning-container: light-dark(var(--md-sys-color-warning-500-200), var(--md-sys-color-warning-500-200));
686
- --md-sys-color-warning-container-low: light-dark(var(--md-sys-color-warning-500-100), var(--md-sys-color-warning-500-100));
687
- --md-sys-color-warning-container-high: light-dark(var(--md-sys-color-warning-500-300), var(--md-sys-color-warning-500-300));
688
- --md-sys-color-warning-container-hover: light-dark(var(--md-sys-color-warning-500-300), var(--md-sys-color-warning-500-300));
689
- --md-sys-color-warning-container-active: light-dark(var(--md-sys-color-warning-500-400), var(--md-sys-color-warning-500-400));
690
- --md-sys-color-warning-container-disabled: light-dark(var(--md-sys-color-warning-500-100), var(--md-sys-color-warning-500-100));
743
+ --md-sys-color-warning-outline: var(--md-sys-color-warning-500-600);
744
+ --md-sys-color-warning-outline-variant: var(--md-sys-color-warning-500-300);
745
+ --md-sys-color-warning-outline-hover: var(--md-sys-color-warning-500-700);
746
+ --md-sys-color-warning-outline-active: var(--md-sys-color-warning-500-800);
747
+ --md-sys-color-warning-outline-disabled: var(--md-sys-color-warning-500-400);
748
+ --md-sys-color-warning-container: var(--md-sys-color-warning-500-200);
749
+ --md-sys-color-warning-container-low: var(--md-sys-color-warning-500-100);
750
+ --md-sys-color-warning-container-high: var(--md-sys-color-warning-500-300);
751
+ --md-sys-color-warning-container-hover: var(--md-sys-color-warning-500-300);
752
+ --md-sys-color-warning-container-active: var(--md-sys-color-warning-500-400);
753
+ --md-sys-color-warning-container-disabled: var(--md-sys-color-warning-500-100);
691
754
  --md-sys-color-warning-inverse-surface: light-dark(var(--md-sys-color-warning-900), var(--md-sys-color-warning-100));
692
755
  --md-sys-color-warning-inverse-on-surface: light-dark(var(--md-sys-color-warning-050), var(--md-sys-color-warning-950));
693
756
  --md-sys-color-warning-background: light-dark(var(--md-sys-color-warning-100), var(--md-sys-color-warning-900));
@@ -704,13 +767,13 @@
704
767
  --md-sys-color-warning-surface-high: light-dark(var(--md-sys-color-warning-150), var(--md-sys-color-warning-850));
705
768
  --md-sys-color-warning-surface-higher: light-dark(var(--md-sys-color-warning-175), var(--md-sys-color-warning-825));
706
769
  --md-sys-color-warning-surface-highest: light-dark(var(--md-sys-color-warning-200), var(--md-sys-color-warning-800));
707
- --md-sys-color-warning-scrim-weakest: light-dark(var(--md-sys-color-warning-500-050), var(--md-sys-color-warning-500-050));
708
- --md-sys-color-warning-scrim-weaker: light-dark(var(--md-sys-color-warning-500-100), var(--md-sys-color-warning-500-100));
709
- --md-sys-color-warning-scrim-weak: light-dark(var(--md-sys-color-warning-500-200), var(--md-sys-color-warning-500-200));
710
- --md-sys-color-warning-scrim: light-dark(var(--md-sys-color-warning-500-300), var(--md-sys-color-warning-500-300));
711
- --md-sys-color-warning-scrim-strong: light-dark(var(--md-sys-color-warning-500-400), var(--md-sys-color-warning-500-400));
712
- --md-sys-color-warning-scrim-stronger: light-dark(var(--md-sys-color-warning-500-500), var(--md-sys-color-warning-500-500));
713
- --md-sys-color-warning-scrim-strongest: light-dark(var(--md-sys-color-warning-500-600), var(--md-sys-color-warning-500-600));
770
+ --md-sys-color-warning-scrim-weakest: var(--md-sys-color-warning-500-050);
771
+ --md-sys-color-warning-scrim-weaker: var(--md-sys-color-warning-500-100);
772
+ --md-sys-color-warning-scrim-weak: var(--md-sys-color-warning-500-200);
773
+ --md-sys-color-warning-scrim: var(--md-sys-color-warning-500-300);
774
+ --md-sys-color-warning-scrim-strong: var(--md-sys-color-warning-500-400);
775
+ --md-sys-color-warning-scrim-stronger: var(--md-sys-color-warning-500-500);
776
+ --md-sys-color-warning-scrim-strongest: var(--md-sys-color-warning-500-600);
714
777
 
715
778
  /* Danger — flat mode-independent primitives */
716
779
  --md-sys-color-danger-100: oklch(0.9544 0.0032 17.21);
@@ -750,41 +813,42 @@
750
813
  --md-sys-color-danger-500-900: oklch(0.5992 0.1622 25.47 / 90%);
751
814
  --md-sys-color-danger-500-950: oklch(0.5992 0.1622 25.47 / 95%);
752
815
  /* Danger — semantic roles */
753
- --md-sys-color-danger: light-dark(var(--md-sys-color-danger-600), var(--md-sys-color-danger-600));
816
+ /* gh#1852: identical-leg light-dark() roles below (base/hover/active/on-* solid-fill and their alpha-family -disabled, outline-*, container-*, scrim-* siblings) dropped their pointless wrapper — see neutral's semantic-roles comment above for the per-class rationale (fixed fill-identity vs. alpha auto-compositing). */
817
+ --md-sys-color-danger: var(--md-sys-color-danger-600);
754
818
  --md-sys-color-danger-dim: light-dark(var(--md-sys-color-danger-650), var(--md-sys-color-danger-700));
755
819
  --md-sys-color-danger-bright: light-dark(var(--md-sys-color-danger-350), var(--md-sys-color-danger-400));
756
820
  --md-sys-color-danger-low: light-dark(var(--md-sys-color-danger-350), var(--md-sys-color-danger-700));
757
821
  --md-sys-color-danger-high: light-dark(var(--md-sys-color-danger-650), var(--md-sys-color-danger-400));
758
- --md-sys-color-danger-hover: light-dark(var(--md-sys-color-danger-650), var(--md-sys-color-danger-650));
759
- --md-sys-color-danger-active: light-dark(var(--md-sys-color-danger-700), var(--md-sys-color-danger-700));
760
- --md-sys-color-danger-disabled: light-dark(var(--md-sys-color-danger-500-600), var(--md-sys-color-danger-500-600));
761
- --md-sys-color-danger-on-danger: light-dark(var(--md-sys-color-danger-050), var(--md-sys-color-danger-050));
762
- --md-sys-color-danger-on-danger-variant: light-dark(var(--md-sys-color-danger-200), var(--md-sys-color-danger-200));
822
+ --md-sys-color-danger-hover: var(--md-sys-color-danger-650);
823
+ --md-sys-color-danger-active: var(--md-sys-color-danger-700);
824
+ --md-sys-color-danger-disabled: var(--md-sys-color-danger-500-600);
825
+ --md-sys-color-danger-on-danger: var(--md-sys-color-danger-050);
826
+ --md-sys-color-danger-on-danger-variant: var(--md-sys-color-danger-200);
763
827
  /* tonal text (gh#434): dark in-family text on the translucent container fill.
764
828
  light leg = the 950 stop (measured 10.2-15.2:1 over container/-hover/-active
765
829
  composited on the page bg); dark leg = the 200 stop, on-danger-variant's own
766
830
  dark leg (measured 5.6-9.2:1). Gate: verify:contrast §on-container pairs. */
767
831
  --md-sys-color-danger-on-danger-container: light-dark(var(--md-sys-color-danger-950), var(--md-sys-color-danger-200));
768
- --md-sys-color-danger-on-danger-hover: light-dark(var(--md-sys-color-danger-050), var(--md-sys-color-danger-050));
769
- --md-sys-color-danger-on-danger-active: light-dark(var(--md-sys-color-danger-050), var(--md-sys-color-danger-050));
770
- --md-sys-color-danger-on-danger-disabled: light-dark(var(--md-sys-color-danger-500-400), var(--md-sys-color-danger-500-400));
832
+ --md-sys-color-danger-on-danger-hover: var(--md-sys-color-danger-050);
833
+ --md-sys-color-danger-on-danger-active: var(--md-sys-color-danger-050);
834
+ --md-sys-color-danger-on-danger-disabled: var(--md-sys-color-danger-500-400);
771
835
  --md-sys-color-danger-on-surface: light-dark(var(--md-sys-color-danger-950), var(--md-sys-color-danger-050));
772
836
  --md-sys-color-danger-on-surface-variant: light-dark(var(--md-sys-color-danger-750), var(--md-sys-color-danger-250));
773
837
  --md-sys-color-danger-on-surface-hover: light-dark(var(--md-sys-color-danger-950), var(--md-sys-color-danger-050));
774
838
  --md-sys-color-danger-on-surface-active: light-dark(var(--md-sys-color-danger-950), var(--md-sys-color-danger-050));
775
- --md-sys-color-danger-on-surface-disabled: light-dark(var(--md-sys-color-danger-500-400), var(--md-sys-color-danger-500-400));
839
+ --md-sys-color-danger-on-surface-disabled: var(--md-sys-color-danger-500-400);
776
840
  --md-sys-color-danger-placeholder: light-dark(var(--md-sys-color-danger-650), var(--md-sys-color-danger-350));
777
- --md-sys-color-danger-outline: light-dark(var(--md-sys-color-danger-500-600), var(--md-sys-color-danger-500-600));
778
- --md-sys-color-danger-outline-variant: light-dark(var(--md-sys-color-danger-500-300), var(--md-sys-color-danger-500-300));
779
- --md-sys-color-danger-outline-hover: light-dark(var(--md-sys-color-danger-500-700), var(--md-sys-color-danger-500-700));
780
- --md-sys-color-danger-outline-active: light-dark(var(--md-sys-color-danger-500-800), var(--md-sys-color-danger-500-800));
781
- --md-sys-color-danger-outline-disabled: light-dark(var(--md-sys-color-danger-500-400), var(--md-sys-color-danger-500-400));
782
- --md-sys-color-danger-container: light-dark(var(--md-sys-color-danger-500-200), var(--md-sys-color-danger-500-200));
783
- --md-sys-color-danger-container-low: light-dark(var(--md-sys-color-danger-500-100), var(--md-sys-color-danger-500-100));
784
- --md-sys-color-danger-container-high: light-dark(var(--md-sys-color-danger-500-300), var(--md-sys-color-danger-500-300));
785
- --md-sys-color-danger-container-hover: light-dark(var(--md-sys-color-danger-500-300), var(--md-sys-color-danger-500-300));
786
- --md-sys-color-danger-container-active: light-dark(var(--md-sys-color-danger-500-400), var(--md-sys-color-danger-500-400));
787
- --md-sys-color-danger-container-disabled: light-dark(var(--md-sys-color-danger-500-100), var(--md-sys-color-danger-500-100));
841
+ --md-sys-color-danger-outline: var(--md-sys-color-danger-500-600);
842
+ --md-sys-color-danger-outline-variant: var(--md-sys-color-danger-500-300);
843
+ --md-sys-color-danger-outline-hover: var(--md-sys-color-danger-500-700);
844
+ --md-sys-color-danger-outline-active: var(--md-sys-color-danger-500-800);
845
+ --md-sys-color-danger-outline-disabled: var(--md-sys-color-danger-500-400);
846
+ --md-sys-color-danger-container: var(--md-sys-color-danger-500-200);
847
+ --md-sys-color-danger-container-low: var(--md-sys-color-danger-500-100);
848
+ --md-sys-color-danger-container-high: var(--md-sys-color-danger-500-300);
849
+ --md-sys-color-danger-container-hover: var(--md-sys-color-danger-500-300);
850
+ --md-sys-color-danger-container-active: var(--md-sys-color-danger-500-400);
851
+ --md-sys-color-danger-container-disabled: var(--md-sys-color-danger-500-100);
788
852
  --md-sys-color-danger-inverse-surface: light-dark(var(--md-sys-color-danger-900), var(--md-sys-color-danger-100));
789
853
  --md-sys-color-danger-inverse-on-surface: light-dark(var(--md-sys-color-danger-050), var(--md-sys-color-danger-950));
790
854
  --md-sys-color-danger-background: light-dark(var(--md-sys-color-danger-100), var(--md-sys-color-danger-900));
@@ -801,11 +865,11 @@
801
865
  --md-sys-color-danger-surface-high: light-dark(var(--md-sys-color-danger-150), var(--md-sys-color-danger-850));
802
866
  --md-sys-color-danger-surface-higher: light-dark(var(--md-sys-color-danger-175), var(--md-sys-color-danger-825));
803
867
  --md-sys-color-danger-surface-highest: light-dark(var(--md-sys-color-danger-200), var(--md-sys-color-danger-800));
804
- --md-sys-color-danger-scrim-weakest: light-dark(var(--md-sys-color-danger-500-050), var(--md-sys-color-danger-500-050));
805
- --md-sys-color-danger-scrim-weaker: light-dark(var(--md-sys-color-danger-500-100), var(--md-sys-color-danger-500-100));
806
- --md-sys-color-danger-scrim-weak: light-dark(var(--md-sys-color-danger-500-200), var(--md-sys-color-danger-500-200));
807
- --md-sys-color-danger-scrim: light-dark(var(--md-sys-color-danger-500-300), var(--md-sys-color-danger-500-300));
808
- --md-sys-color-danger-scrim-strong: light-dark(var(--md-sys-color-danger-500-400), var(--md-sys-color-danger-500-400));
809
- --md-sys-color-danger-scrim-stronger: light-dark(var(--md-sys-color-danger-500-500), var(--md-sys-color-danger-500-500));
810
- --md-sys-color-danger-scrim-strongest: light-dark(var(--md-sys-color-danger-500-600), var(--md-sys-color-danger-500-600));
868
+ --md-sys-color-danger-scrim-weakest: var(--md-sys-color-danger-500-050);
869
+ --md-sys-color-danger-scrim-weaker: var(--md-sys-color-danger-500-100);
870
+ --md-sys-color-danger-scrim-weak: var(--md-sys-color-danger-500-200);
871
+ --md-sys-color-danger-scrim: var(--md-sys-color-danger-500-300);
872
+ --md-sys-color-danger-scrim-strong: var(--md-sys-color-danger-500-400);
873
+ --md-sys-color-danger-scrim-stronger: var(--md-sys-color-danger-500-500);
874
+ --md-sys-color-danger-scrim-strongest: var(--md-sys-color-danger-500-600);
811
875
  }