@primer/primitives 11.7.0 → 11.7.1-rc.97abd424

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 (30) hide show
  1. package/dist/build/platforms/css.js +22 -4
  2. package/dist/css/functional/themes/dark-colorblind-high-contrast.css +54 -54
  3. package/dist/css/functional/themes/dark-colorblind.css +54 -54
  4. package/dist/css/functional/themes/dark-dimmed-high-contrast.css +54 -54
  5. package/dist/css/functional/themes/dark-dimmed.css +54 -54
  6. package/dist/css/functional/themes/dark-high-contrast.css +54 -54
  7. package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +54 -54
  8. package/dist/css/functional/themes/dark-tritanopia.css +54 -54
  9. package/dist/css/functional/themes/dark.css +54 -54
  10. package/dist/css/functional/themes/light-colorblind-high-contrast.css +54 -54
  11. package/dist/css/functional/themes/light-colorblind.css +54 -54
  12. package/dist/css/functional/themes/light-high-contrast.css +54 -54
  13. package/dist/css/functional/themes/light-tritanopia-high-contrast.css +54 -54
  14. package/dist/css/functional/themes/light-tritanopia.css +54 -54
  15. package/dist/css/functional/themes/light.css +54 -54
  16. package/dist/internalCss/dark-colorblind-high-contrast.css +54 -54
  17. package/dist/internalCss/dark-colorblind.css +54 -54
  18. package/dist/internalCss/dark-dimmed-high-contrast.css +54 -54
  19. package/dist/internalCss/dark-dimmed.css +54 -54
  20. package/dist/internalCss/dark-high-contrast.css +54 -54
  21. package/dist/internalCss/dark-tritanopia-high-contrast.css +54 -54
  22. package/dist/internalCss/dark-tritanopia.css +54 -54
  23. package/dist/internalCss/dark.css +54 -54
  24. package/dist/internalCss/light-colorblind-high-contrast.css +54 -54
  25. package/dist/internalCss/light-colorblind.css +54 -54
  26. package/dist/internalCss/light-high-contrast.css +54 -54
  27. package/dist/internalCss/light-tritanopia-high-contrast.css +54 -54
  28. package/dist/internalCss/light-tritanopia.css +54 -54
  29. package/dist/internalCss/light.css +54 -54
  30. package/package.json +15 -14
@@ -932,25 +932,25 @@
932
932
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
933
933
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
934
934
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
935
- --border-accent-emphasis: 0.0625rem solid #0349b4;
936
- --border-accent-muted: 0.0625rem solid #368cf9;
937
- --border-attention-emphasis: 0.0625rem solid #744500;
938
- --border-attention-muted: 0.0625rem solid #b58407;
939
- --border-danger-emphasis: 0.0625rem solid #a0111f;
940
- --border-danger-muted: 0.0625rem solid #ee5a5d;
941
- --border-default: 0.0625rem solid #454c54;
942
- --border-disabled: 0.0625rem solid #59636e1f;
943
- --border-done-emphasis: 0.0625rem solid #622cbc;
944
- --border-done-muted: 0.0625rem solid #a371f7;
945
- --border-neutral-emphasis: 0.0625rem solid #59636e;
946
- --border-severe-emphasis: 0.0625rem solid #873800;
947
- --border-severe-muted: 0.0625rem solid #dc6d1a;
948
- --border-sponsors-emphasis: 0.0625rem solid #971368;
949
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
950
- --border-success-emphasis: 0.0625rem solid #055d20;
951
- --border-success-muted: 0.0625rem solid #26a148;
952
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
953
- --border-transparent: 0.0625rem solid #ffffff00;
935
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
936
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
937
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
938
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
939
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
940
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
941
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
942
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
943
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
944
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
945
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
946
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
947
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
948
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
949
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
950
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
951
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
952
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
953
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
954
954
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
955
955
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
956
956
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -1109,13 +1109,13 @@
1109
1109
  --avatar-borderColor: var(--borderColor-emphasis);
1110
1110
  --border-closed-emphasis: var(--border-danger-emphasis);
1111
1111
  --border-closed-muted: var(--border-danger-muted);
1112
- --border-draft-emphasis: 0.0625rem solid #59636e;
1113
- --border-emphasis: 0.0625rem solid #454c54;
1114
- --border-muted: 0.0625rem solid #454c54;
1112
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1113
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1114
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1115
1115
  --border-open-emphasis: var(--border-success-emphasis);
1116
1116
  --border-open-muted: var(--border-success-muted);
1117
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
1118
- --border-upsell-muted: 0.0625rem solid #a371f7;
1117
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1118
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1119
1119
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1120
1120
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
1121
1121
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
@@ -1175,7 +1175,7 @@
1175
1175
  --diffBlob-expander-iconColor: var(--fgColor-default);
1176
1176
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
1177
1177
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
1178
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
1178
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1179
1179
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1180
1180
  --progressBar-track-bgColor: var(--bgColor-default);
1181
1181
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -1185,14 +1185,14 @@
1185
1185
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
1186
1186
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1187
1187
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1188
- --border-neutral-muted: 0.0625rem solid #454c54;
1188
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1189
1189
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
1190
1190
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1191
1191
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
1192
1192
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
1193
1193
  --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
1194
1194
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1195
- --border-draft-muted: 0.0625rem solid #454c54;
1195
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1196
1196
  }
1197
1197
  @media (prefers-color-scheme: dark) {
1198
1198
  [data-color-mode][data-color-mode="auto"][data-dark-theme="light_high_contrast"] {
@@ -2128,25 +2128,25 @@
2128
2128
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2129
2129
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2130
2130
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
2131
- --border-accent-emphasis: 0.0625rem solid #0349b4;
2132
- --border-accent-muted: 0.0625rem solid #368cf9;
2133
- --border-attention-emphasis: 0.0625rem solid #744500;
2134
- --border-attention-muted: 0.0625rem solid #b58407;
2135
- --border-danger-emphasis: 0.0625rem solid #a0111f;
2136
- --border-danger-muted: 0.0625rem solid #ee5a5d;
2137
- --border-default: 0.0625rem solid #454c54;
2138
- --border-disabled: 0.0625rem solid #59636e1f;
2139
- --border-done-emphasis: 0.0625rem solid #622cbc;
2140
- --border-done-muted: 0.0625rem solid #a371f7;
2141
- --border-neutral-emphasis: 0.0625rem solid #59636e;
2142
- --border-severe-emphasis: 0.0625rem solid #873800;
2143
- --border-severe-muted: 0.0625rem solid #dc6d1a;
2144
- --border-sponsors-emphasis: 0.0625rem solid #971368;
2145
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
2146
- --border-success-emphasis: 0.0625rem solid #055d20;
2147
- --border-success-muted: 0.0625rem solid #26a148;
2148
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2149
- --border-transparent: 0.0625rem solid #ffffff00;
2131
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2132
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2133
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2134
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2135
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2136
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2137
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2138
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2139
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2140
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2141
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2142
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2143
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2144
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2145
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2146
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2147
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2148
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2149
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2150
2150
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
2151
2151
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
2152
2152
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -2305,13 +2305,13 @@
2305
2305
  --avatar-borderColor: var(--borderColor-emphasis);
2306
2306
  --border-closed-emphasis: var(--border-danger-emphasis);
2307
2307
  --border-closed-muted: var(--border-danger-muted);
2308
- --border-draft-emphasis: 0.0625rem solid #59636e;
2309
- --border-emphasis: 0.0625rem solid #454c54;
2310
- --border-muted: 0.0625rem solid #454c54;
2308
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2309
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2310
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2311
2311
  --border-open-emphasis: var(--border-success-emphasis);
2312
2312
  --border-open-muted: var(--border-success-muted);
2313
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
2314
- --border-upsell-muted: 0.0625rem solid #a371f7;
2313
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2314
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2315
2315
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2316
2316
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
2317
2317
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
@@ -2371,7 +2371,7 @@
2371
2371
  --diffBlob-expander-iconColor: var(--fgColor-default);
2372
2372
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
2373
2373
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
2374
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
2374
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2375
2375
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2376
2376
  --progressBar-track-bgColor: var(--bgColor-default);
2377
2377
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -2381,13 +2381,13 @@
2381
2381
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
2382
2382
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2383
2383
  --underlineNav-borderColor-hover: var(--borderColor-muted);
2384
- --border-neutral-muted: 0.0625rem solid #454c54;
2384
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2385
2385
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
2386
2386
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
2387
2387
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
2388
2388
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
2389
2389
  --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
2390
2390
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
2391
- --border-draft-muted: 0.0625rem solid #454c54;
2391
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2392
2392
  }
2393
2393
  }
@@ -928,25 +928,25 @@
928
928
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
929
929
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
930
930
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
931
- --border-accent-emphasis: 0.0625rem solid #0349b4;
932
- --border-accent-muted: 0.0625rem solid #368cf9;
933
- --border-attention-emphasis: 0.0625rem solid #744500;
934
- --border-attention-muted: 0.0625rem solid #b58407;
935
- --border-danger-emphasis: 0.0625rem solid #a0111f;
936
- --border-danger-muted: 0.0625rem solid #ee5a5d;
937
- --border-default: 0.0625rem solid #454c54;
938
- --border-disabled: 0.0625rem solid #59636e1f;
939
- --border-done-emphasis: 0.0625rem solid #622cbc;
940
- --border-done-muted: 0.0625rem solid #a371f7;
941
- --border-neutral-emphasis: 0.0625rem solid #59636e;
942
- --border-severe-emphasis: 0.0625rem solid #a0111f;
943
- --border-severe-muted: 0.0625rem solid #ee5a5d;
944
- --border-sponsors-emphasis: 0.0625rem solid #971368;
945
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
946
- --border-success-emphasis: 0.0625rem solid #0349b4;
947
- --border-success-muted: 0.0625rem solid #368cf9;
948
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
949
- --border-transparent: 0.0625rem solid #ffffff00;
931
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
932
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
933
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
934
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
935
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
936
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
937
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
938
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
939
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
940
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
941
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
942
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
943
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
944
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
945
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
946
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
947
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
948
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
949
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
950
950
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
951
951
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
952
952
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
@@ -1107,14 +1107,14 @@
1107
1107
  --avatar-borderColor: var(--borderColor-emphasis);
1108
1108
  --border-closed-emphasis: var(--border-danger-emphasis);
1109
1109
  --border-closed-muted: var(--border-danger-muted);
1110
- --border-draft-emphasis: 0.0625rem solid #59636e;
1111
- --border-draft-muted: 0.0625rem solid #454c54;
1112
- --border-emphasis: 0.0625rem solid #454c54;
1113
- --border-muted: 0.0625rem solid #454c54;
1110
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1111
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1112
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1113
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1114
1114
  --border-open-emphasis: var(--border-success-emphasis);
1115
1115
  --border-open-muted: var(--border-success-muted);
1116
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
1117
- --border-upsell-muted: 0.0625rem solid #a371f7;
1116
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1117
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1118
1118
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
1119
1119
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1120
1120
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1177,7 +1177,7 @@
1177
1177
  --diffBlob-expander-iconColor: var(--fgColor-default);
1178
1178
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
1179
1179
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
1180
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
1180
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1181
1181
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1182
1182
  --progressBar-track-bgColor: var(--bgColor-default);
1183
1183
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -1187,7 +1187,7 @@
1187
1187
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
1188
1188
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1189
1189
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1190
- --border-neutral-muted: 0.0625rem solid #454c54;
1190
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1191
1191
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1192
1192
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
1193
1193
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
@@ -2124,25 +2124,25 @@
2124
2124
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2125
2125
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2126
2126
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
2127
- --border-accent-emphasis: 0.0625rem solid #0349b4;
2128
- --border-accent-muted: 0.0625rem solid #368cf9;
2129
- --border-attention-emphasis: 0.0625rem solid #744500;
2130
- --border-attention-muted: 0.0625rem solid #b58407;
2131
- --border-danger-emphasis: 0.0625rem solid #a0111f;
2132
- --border-danger-muted: 0.0625rem solid #ee5a5d;
2133
- --border-default: 0.0625rem solid #454c54;
2134
- --border-disabled: 0.0625rem solid #59636e1f;
2135
- --border-done-emphasis: 0.0625rem solid #622cbc;
2136
- --border-done-muted: 0.0625rem solid #a371f7;
2137
- --border-neutral-emphasis: 0.0625rem solid #59636e;
2138
- --border-severe-emphasis: 0.0625rem solid #a0111f;
2139
- --border-severe-muted: 0.0625rem solid #ee5a5d;
2140
- --border-sponsors-emphasis: 0.0625rem solid #971368;
2141
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
2142
- --border-success-emphasis: 0.0625rem solid #0349b4;
2143
- --border-success-muted: 0.0625rem solid #368cf9;
2144
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2145
- --border-transparent: 0.0625rem solid #ffffff00;
2127
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2128
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2129
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2130
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2131
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2132
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2133
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2134
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2135
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2136
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2137
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2138
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2139
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2140
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2141
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2142
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2143
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2144
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2145
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2146
2146
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
2147
2147
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
2148
2148
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
@@ -2303,14 +2303,14 @@
2303
2303
  --avatar-borderColor: var(--borderColor-emphasis);
2304
2304
  --border-closed-emphasis: var(--border-danger-emphasis);
2305
2305
  --border-closed-muted: var(--border-danger-muted);
2306
- --border-draft-emphasis: 0.0625rem solid #59636e;
2307
- --border-draft-muted: 0.0625rem solid #454c54;
2308
- --border-emphasis: 0.0625rem solid #454c54;
2309
- --border-muted: 0.0625rem solid #454c54;
2306
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2307
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2308
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2309
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2310
2310
  --border-open-emphasis: var(--border-success-emphasis);
2311
2311
  --border-open-muted: var(--border-success-muted);
2312
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
2313
- --border-upsell-muted: 0.0625rem solid #a371f7;
2312
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2313
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2314
2314
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
2315
2315
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2316
2316
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -2373,7 +2373,7 @@
2373
2373
  --diffBlob-expander-iconColor: var(--fgColor-default);
2374
2374
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
2375
2375
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
2376
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
2376
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2377
2377
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2378
2378
  --progressBar-track-bgColor: var(--bgColor-default);
2379
2379
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -2383,7 +2383,7 @@
2383
2383
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
2384
2384
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2385
2385
  --underlineNav-borderColor-hover: var(--borderColor-muted);
2386
- --border-neutral-muted: 0.0625rem solid #454c54;
2386
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2387
2387
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
2388
2388
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
2389
2389
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
@@ -949,25 +949,25 @@
949
949
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
950
950
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
951
951
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
952
- --border-accent-emphasis: 0.0625rem solid #0969da;
953
- --border-accent-muted: 0.0625rem solid #54aeff66;
954
- --border-attention-emphasis: 0.0625rem solid #9a6700;
955
- --border-attention-muted: 0.0625rem solid #d4a72c66;
956
- --border-danger-emphasis: 0.0625rem solid #cf222e;
957
- --border-danger-muted: 0.0625rem solid #ff818266;
958
- --border-default: 0.0625rem solid #d1d9e0;
959
- --border-disabled: 0.0625rem solid #818b981a;
960
- --border-done-emphasis: 0.0625rem solid #8250df;
961
- --border-done-muted: 0.0625rem solid #c297ff66;
962
- --border-emphasis: 0.0625rem solid #818b98;
963
- --border-neutral-emphasis: 0.0625rem solid #59636e;
964
- --border-severe-emphasis: 0.0625rem solid #cf222e;
965
- --border-severe-muted: 0.0625rem solid #ff818266;
966
- --border-sponsors-emphasis: 0.0625rem solid #bf3989;
967
- --border-sponsors-muted: 0.0625rem solid #ff80c866;
968
- --border-success-emphasis: 0.0625rem solid #0969da;
969
- --border-success-muted: 0.0625rem solid #54aeff66;
970
- --border-transparent: 0.0625rem solid #ffffff00;
952
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
953
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
954
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
955
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
956
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
957
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
958
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
959
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
960
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
961
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
962
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
963
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
964
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
965
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
966
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
967
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
968
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
969
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
970
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
971
971
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
972
972
  --borderColor-closed-muted: #d1d9e066; /** Subtle border for closed state indicators */
973
973
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -1106,14 +1106,14 @@
1106
1106
  --avatar-borderColor: var(--borderColor-translucent);
1107
1107
  --border-closed-emphasis: var(--border-danger-emphasis);
1108
1108
  --border-closed-muted: var(--border-danger-muted);
1109
- --border-draft-emphasis: 0.0625rem solid #59636e;
1110
- --border-draft-muted: 0.0625rem solid #d1d9e066;
1111
- --border-muted: 0.0625rem solid #d1d9e0b3;
1109
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1110
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1111
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1112
1112
  --border-open-emphasis: var(--border-success-emphasis);
1113
1113
  --border-open-muted: var(--border-success-muted);
1114
- --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1115
- --border-upsell-emphasis: 0.0625rem solid #8250df;
1116
- --border-upsell-muted: 0.0625rem solid #c297ff66;
1114
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1115
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1116
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1117
1117
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1118
1118
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
1119
1119
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
@@ -1171,13 +1171,13 @@
1171
1171
  --diffBlob-deletionWord-fgColor: var(--fgColor-default);
1172
1172
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
1173
1173
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
1174
- --focus-outline: 0.125rem solid #0969da; /** Focus ring outline for keyboard navigation and accessibility. */
1174
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1175
1175
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1176
1176
  --overlay-borderColor: #d1d9e080;
1177
1177
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
1178
1178
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1179
1179
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1180
- --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
1180
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1181
1181
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
1182
1182
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1183
1183
  --button-primary-borderColor-active: var(--button-primary-borderColor-rest);
@@ -2145,25 +2145,25 @@
2145
2145
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2146
2146
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2147
2147
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
2148
- --border-accent-emphasis: 0.0625rem solid #0969da;
2149
- --border-accent-muted: 0.0625rem solid #54aeff66;
2150
- --border-attention-emphasis: 0.0625rem solid #9a6700;
2151
- --border-attention-muted: 0.0625rem solid #d4a72c66;
2152
- --border-danger-emphasis: 0.0625rem solid #cf222e;
2153
- --border-danger-muted: 0.0625rem solid #ff818266;
2154
- --border-default: 0.0625rem solid #d1d9e0;
2155
- --border-disabled: 0.0625rem solid #818b981a;
2156
- --border-done-emphasis: 0.0625rem solid #8250df;
2157
- --border-done-muted: 0.0625rem solid #c297ff66;
2158
- --border-emphasis: 0.0625rem solid #818b98;
2159
- --border-neutral-emphasis: 0.0625rem solid #59636e;
2160
- --border-severe-emphasis: 0.0625rem solid #cf222e;
2161
- --border-severe-muted: 0.0625rem solid #ff818266;
2162
- --border-sponsors-emphasis: 0.0625rem solid #bf3989;
2163
- --border-sponsors-muted: 0.0625rem solid #ff80c866;
2164
- --border-success-emphasis: 0.0625rem solid #0969da;
2165
- --border-success-muted: 0.0625rem solid #54aeff66;
2166
- --border-transparent: 0.0625rem solid #ffffff00;
2148
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2149
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2150
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2151
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2152
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2153
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2154
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2155
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2156
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2157
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2158
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2159
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2160
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2161
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2162
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2163
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2164
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2165
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2166
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2167
2167
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
2168
2168
  --borderColor-closed-muted: #d1d9e066; /** Subtle border for closed state indicators */
2169
2169
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -2302,14 +2302,14 @@
2302
2302
  --avatar-borderColor: var(--borderColor-translucent);
2303
2303
  --border-closed-emphasis: var(--border-danger-emphasis);
2304
2304
  --border-closed-muted: var(--border-danger-muted);
2305
- --border-draft-emphasis: 0.0625rem solid #59636e;
2306
- --border-draft-muted: 0.0625rem solid #d1d9e066;
2307
- --border-muted: 0.0625rem solid #d1d9e0b3;
2305
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2306
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2307
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2308
2308
  --border-open-emphasis: var(--border-success-emphasis);
2309
2309
  --border-open-muted: var(--border-success-muted);
2310
- --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2311
- --border-upsell-emphasis: 0.0625rem solid #8250df;
2312
- --border-upsell-muted: 0.0625rem solid #c297ff66;
2310
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2311
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2312
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2313
2313
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2314
2314
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
2315
2315
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
@@ -2367,13 +2367,13 @@
2367
2367
  --diffBlob-deletionWord-fgColor: var(--fgColor-default);
2368
2368
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
2369
2369
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
2370
- --focus-outline: 0.125rem solid #0969da; /** Focus ring outline for keyboard navigation and accessibility. */
2370
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2371
2371
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2372
2372
  --overlay-borderColor: #d1d9e080;
2373
2373
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
2374
2374
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2375
2375
  --underlineNav-borderColor-hover: var(--borderColor-muted);
2376
- --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
2376
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2377
2377
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
2378
2378
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
2379
2379
  --button-primary-borderColor-active: var(--button-primary-borderColor-rest);