@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
package/dist/build/platforms/css.js CHANGED
@@ -1,5 +1,23 @@
1
1
  import { isFromFile, isSource } from '../filters/index.js';
2
2
  import { outputReferencesTransformed, outputReferencesFilter } from 'style-dictionary/utils';
3
+ /**
4
+ * Determines whether a token's value should use CSS variable references.
5
+ *
6
+ * For most tokens, we check both that referenced tokens are in the current output
7
+ * (outputReferencesFilter) and that the string replacement is valid (outputReferencesTransformed).
8
+ *
9
+ * Composite border tokens need special handling because:
10
+ * 1. outputReferencesTransformed returns false for object original values
11
+ * 2. outputReferencesFilter returns false because width tokens are in a separate CSS file
12
+ * Style Dictionary's formatter correctly handles var() substitution in flattened composite strings,
13
+ * and the referenced tokens (borderColor.*, borderWidth.*, focus.outline-*) all exist as CSS variables at runtime.
14
+ */
15
+ const shouldOutputReferences = (token, platformOptions) => {
16
+ if (token.$type === 'border') {
17
+ return true;
18
+ }
19
+ return outputReferencesFilter(token, platformOptions) && outputReferencesTransformed(token, platformOptions);
20
+ };
3
21
  const getCssSelectors = (outputFile) => {
4
22
  // check for dark in the beginning of the output filename
5
23
  const lastSlash = outputFile.lastIndexOf('/');
@@ -54,7 +72,7 @@ export const css = (outputFile, prefix, buildPath, options) => {
54
72
  'src/tokens/functional/size/size-coarse.json5',
55
73
  'src/tokens/functional/size/size-fine.json5',
56
74
  ]),
57
- options: Object.assign({ showFileHeader: false, outputReferences: (token, platformOptions) => outputReferencesFilter(token, platformOptions) && outputReferencesTransformed(token, platformOptions), descriptions: false, queries: getCssSelectors(outputFile) }, options === null || options === void 0 ? void 0 : options.options),
75
+ options: Object.assign({ showFileHeader: false, outputReferences: shouldOutputReferences, descriptions: false, queries: getCssSelectors(outputFile) }, options === null || options === void 0 ? void 0 : options.options),
58
76
  },
59
77
  {
60
78
  destination: `${outputFile}`,
@@ -66,7 +84,7 @@ export const css = (outputFile, prefix, buildPath, options) => {
66
84
  'src/tokens/functional/size/size-coarse.json5',
67
85
  'src/tokens/functional/size/size-fine.json5',
68
86
  ]),
69
- options: Object.assign({ showFileHeader: false, outputReferences: (token, platformOptions) => outputReferencesFilter(token, platformOptions) && outputReferencesTransformed(token, platformOptions), descriptions: false }, options === null || options === void 0 ? void 0 : options.options),
87
+ options: Object.assign({ showFileHeader: false, outputReferences: shouldOutputReferences, descriptions: false }, options === null || options === void 0 ? void 0 : options.options),
70
88
  },
71
89
  {
72
90
  destination: `${outputFile}`,
@@ -74,7 +92,7 @@ export const css = (outputFile, prefix, buildPath, options) => {
74
92
  filter: token => isSource(token) && (options === null || options === void 0 ? void 0 : options.themed) !== true && token.$type === 'custom-viewportRange',
75
93
  options: {
76
94
  showFileHeader: false,
77
- outputReferences: (token, platformOptions) => outputReferencesFilter(token, platformOptions) && outputReferencesTransformed(token, platformOptions),
95
+ outputReferences: shouldOutputReferences,
78
96
  },
79
97
  },
80
98
  {
@@ -87,7 +105,7 @@ export const css = (outputFile, prefix, buildPath, options) => {
87
105
  ]),
88
106
  options: {
89
107
  descriptions: false,
90
- outputReferences: (token, platformOptions) => outputReferencesFilter(token, platformOptions) && outputReferencesTransformed(token, platformOptions),
108
+ outputReferences: shouldOutputReferences,
91
109
  showFileHeader: false,
92
110
  queries: [
93
111
  {
package/dist/css/functional/themes/dark-colorblind-high-contrast.css CHANGED
@@ -652,24 +652,24 @@
652
652
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
653
653
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
654
654
  --bgColor-white: #ffffff; /** Pure white background */
655
- --border-accent-emphasis: 0.0625rem solid #409eff;
656
- --border-accent-muted: 0.0625rem solid #5cacff;
657
- --border-attention-emphasis: 0.0625rem solid #e09b13;
658
- --border-attention-muted: 0.0625rem solid #edaa27;
659
- --border-danger-emphasis: 0.0625rem solid #e7811d;
660
- --border-danger-muted: 0.0625rem solid #f48b25;
661
- --border-default: 0.0625rem solid #b7bdc8;
662
- --border-disabled: 0.0625rem solid #656c761a;
663
- --border-done-emphasis: 0.0625rem solid #b87fff;
664
- --border-done-muted: 0.0625rem solid #bf8fff;
665
- --border-severe-emphasis: 0.0625rem solid #e7811d;
666
- --border-severe-muted: 0.0625rem solid #e7811d;
667
- --border-sponsors-emphasis: 0.0625rem solid #ef6eb1;
668
- --border-sponsors-muted: 0.0625rem solid #f87cbd;
669
- --border-success-emphasis: 0.0625rem solid #409eff;
670
- --border-success-muted: 0.0625rem solid #5cacff;
671
- --border-translucent: 0.0625rem solid #9198a1; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
672
- --border-transparent: 0.0625rem solid #00000000;
655
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
656
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
657
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
658
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
659
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
660
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
661
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
662
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
663
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
664
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
665
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
666
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
667
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
668
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
669
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
670
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
671
+ --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. */
672
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
673
673
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
674
674
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
675
675
  --borderColor-emphasis: var(--borderColor-default); /** Strong border for emphasis and visual weight */
@@ -808,13 +808,13 @@
808
808
  --avatar-borderColor: var(--borderColor-emphasis);
809
809
  --border-closed-emphasis: var(--border-danger-emphasis);
810
810
  --border-closed-muted: var(--border-danger-muted);
811
- --border-draft-muted: 0.0625rem solid #b7bdc8;
812
- --border-emphasis: 0.0625rem solid #b7bdc8;
813
- --border-muted: 0.0625rem solid #b7bdc8;
811
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
812
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
813
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
814
814
  --border-open-emphasis: var(--border-success-emphasis);
815
815
  --border-open-muted: var(--border-success-muted);
816
- --border-upsell-emphasis: 0.0625rem solid #b87fff;
817
- --border-upsell-muted: 0.0625rem solid #bf8fff;
816
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
817
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
818
818
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
819
819
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
820
820
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -876,7 +876,7 @@
876
876
  --diffBlob-expander-iconColor: var(--fgColor-default);
877
877
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
878
878
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
879
- --focus-outline: 0.125rem solid #409eff; /** Focus ring outline for keyboard navigation and accessibility. */
879
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
880
880
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
881
881
  --page-header-bgColor: var(--bgColor-default);
882
882
  --progressBar-track-bgColor: var(--bgColor-inverse);
@@ -886,8 +886,8 @@
886
886
  --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
887
887
  --tooltip-bgColor: var(--bgColor-inverse);
888
888
  --tooltip-fgColor: var(--fgColor-onInverse);
889
- --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
890
- --border-neutral-muted: 0.0625rem solid #b7bdc8;
889
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
890
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
891
891
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
892
892
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
893
893
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
@@ -901,7 +901,7 @@
901
901
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
902
902
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
903
903
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
904
- --border-draft-emphasis: 0.0625rem solid #b7bdc8;
904
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
905
905
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
906
906
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
907
907
  }
@@ -1555,24 +1555,24 @@
1555
1555
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
1556
1556
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
1557
1557
  --bgColor-white: #ffffff; /** Pure white background */
1558
- --border-accent-emphasis: 0.0625rem solid #409eff;
1559
- --border-accent-muted: 0.0625rem solid #5cacff;
1560
- --border-attention-emphasis: 0.0625rem solid #e09b13;
1561
- --border-attention-muted: 0.0625rem solid #edaa27;
1562
- --border-danger-emphasis: 0.0625rem solid #e7811d;
1563
- --border-danger-muted: 0.0625rem solid #f48b25;
1564
- --border-default: 0.0625rem solid #b7bdc8;
1565
- --border-disabled: 0.0625rem solid #656c761a;
1566
- --border-done-emphasis: 0.0625rem solid #b87fff;
1567
- --border-done-muted: 0.0625rem solid #bf8fff;
1568
- --border-severe-emphasis: 0.0625rem solid #e7811d;
1569
- --border-severe-muted: 0.0625rem solid #e7811d;
1570
- --border-sponsors-emphasis: 0.0625rem solid #ef6eb1;
1571
- --border-sponsors-muted: 0.0625rem solid #f87cbd;
1572
- --border-success-emphasis: 0.0625rem solid #409eff;
1573
- --border-success-muted: 0.0625rem solid #5cacff;
1574
- --border-translucent: 0.0625rem solid #9198a1; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1575
- --border-transparent: 0.0625rem solid #00000000;
1558
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
1559
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
1560
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
1561
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
1562
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
1563
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
1564
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
1565
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
1566
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
1567
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
1568
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
1569
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
1570
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
1571
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
1572
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
1573
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
1574
+ --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. */
1575
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
1576
1576
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
1577
1577
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
1578
1578
  --borderColor-emphasis: var(--borderColor-default); /** Strong border for emphasis and visual weight */
@@ -1711,13 +1711,13 @@
1711
1711
  --avatar-borderColor: var(--borderColor-emphasis);
1712
1712
  --border-closed-emphasis: var(--border-danger-emphasis);
1713
1713
  --border-closed-muted: var(--border-danger-muted);
1714
- --border-draft-muted: 0.0625rem solid #b7bdc8;
1715
- --border-emphasis: 0.0625rem solid #b7bdc8;
1716
- --border-muted: 0.0625rem solid #b7bdc8;
1714
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1715
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1716
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1717
1717
  --border-open-emphasis: var(--border-success-emphasis);
1718
1718
  --border-open-muted: var(--border-success-muted);
1719
- --border-upsell-emphasis: 0.0625rem solid #b87fff;
1720
- --border-upsell-muted: 0.0625rem solid #bf8fff;
1719
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1720
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1721
1721
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
1722
1722
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
1723
1723
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -1779,7 +1779,7 @@
1779
1779
  --diffBlob-expander-iconColor: var(--fgColor-default);
1780
1780
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
1781
1781
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
1782
- --focus-outline: 0.125rem solid #409eff; /** Focus ring outline for keyboard navigation and accessibility. */
1782
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1783
1783
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1784
1784
  --page-header-bgColor: var(--bgColor-default);
1785
1785
  --progressBar-track-bgColor: var(--bgColor-inverse);
@@ -1789,8 +1789,8 @@
1789
1789
  --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
1790
1790
  --tooltip-bgColor: var(--bgColor-inverse);
1791
1791
  --tooltip-fgColor: var(--fgColor-onInverse);
1792
- --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
1793
- --border-neutral-muted: 0.0625rem solid #b7bdc8;
1792
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
1793
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1794
1794
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1795
1795
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
1796
1796
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
@@ -1804,7 +1804,7 @@
1804
1804
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1805
1805
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
1806
1806
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1807
- --border-draft-emphasis: 0.0625rem solid #b7bdc8;
1807
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1808
1808
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1809
1809
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1810
1810
  }
package/dist/css/functional/themes/dark-colorblind.css CHANGED
@@ -671,24 +671,24 @@
671
671
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
672
672
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
673
673
  --bgColor-white: #ffffff; /** Pure white background */
674
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
675
- --border-accent-muted: 0.0625rem solid #388bfd66;
676
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
677
- --border-attention-muted: 0.0625rem solid #bb800966;
678
- --border-danger-emphasis: 0.0625rem solid #bd561d;
679
- --border-danger-muted: 0.0625rem solid #db6d2866;
680
- --border-default: 0.0625rem solid #3d444d;
681
- --border-disabled: 0.0625rem solid #656c761a;
682
- --border-done-emphasis: 0.0625rem solid #8957e5;
683
- --border-done-muted: 0.0625rem solid #ab7df866;
684
- --border-emphasis: 0.0625rem solid #656c76;
685
- --border-severe-emphasis: 0.0625rem solid #bd561d;
686
- --border-severe-muted: 0.0625rem solid #db6d2866;
687
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
688
- --border-sponsors-muted: 0.0625rem solid #db61a266;
689
- --border-success-emphasis: 0.0625rem solid #1f6feb;
690
- --border-success-muted: 0.0625rem solid #388bfd66;
691
- --border-transparent: 0.0625rem solid #00000000;
674
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
675
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
676
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
677
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
678
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
679
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
680
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
681
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
682
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
683
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
684
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
685
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
686
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
687
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
688
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
689
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
690
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
691
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
692
692
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
693
693
  --borderColor-closed-muted: #3d444d66; /** Subtle border for closed state indicators */
694
694
  --borderColor-draft-muted: #3d444d66; /** Subtle border for draft state indicators */
@@ -830,14 +830,14 @@
830
830
  --avatar-borderColor: var(--borderColor-translucent);
831
831
  --border-closed-emphasis: var(--border-danger-emphasis);
832
832
  --border-closed-muted: var(--border-danger-muted);
833
- --border-draft-muted: 0.0625rem solid #3d444d66;
834
- --border-muted: 0.0625rem solid #3d444db3;
835
- --border-neutral-emphasis: 0.0625rem solid #656c76;
833
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
834
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
835
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
836
836
  --border-open-emphasis: var(--border-success-emphasis);
837
837
  --border-open-muted: var(--border-success-muted);
838
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
839
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
840
- --border-upsell-muted: 0.0625rem solid #ab7df866;
838
+ --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. */
839
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
840
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
841
841
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
842
842
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
843
843
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -882,12 +882,12 @@
882
882
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
883
883
  --dashboard-bgColor: var(--bgColor-inset);
884
884
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
885
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
885
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
886
886
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
887
887
  --overlay-borderColor: var(--borderColor-muted);
888
888
  --tooltip-fgColor: var(--fgColor-onEmphasis);
889
- --border-draft-emphasis: 0.0625rem solid #656c76;
890
- --border-neutral-muted: 0.0625rem solid #3d444db3;
889
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
890
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
891
891
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
892
892
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
893
893
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
@@ -1574,24 +1574,24 @@
1574
1574
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
1575
1575
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
1576
1576
  --bgColor-white: #ffffff; /** Pure white background */
1577
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
1578
- --border-accent-muted: 0.0625rem solid #388bfd66;
1579
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
1580
- --border-attention-muted: 0.0625rem solid #bb800966;
1581
- --border-danger-emphasis: 0.0625rem solid #bd561d;
1582
- --border-danger-muted: 0.0625rem solid #db6d2866;
1583
- --border-default: 0.0625rem solid #3d444d;
1584
- --border-disabled: 0.0625rem solid #656c761a;
1585
- --border-done-emphasis: 0.0625rem solid #8957e5;
1586
- --border-done-muted: 0.0625rem solid #ab7df866;
1587
- --border-emphasis: 0.0625rem solid #656c76;
1588
- --border-severe-emphasis: 0.0625rem solid #bd561d;
1589
- --border-severe-muted: 0.0625rem solid #db6d2866;
1590
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
1591
- --border-sponsors-muted: 0.0625rem solid #db61a266;
1592
- --border-success-emphasis: 0.0625rem solid #1f6feb;
1593
- --border-success-muted: 0.0625rem solid #388bfd66;
1594
- --border-transparent: 0.0625rem solid #00000000;
1577
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
1578
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
1579
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
1580
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
1581
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
1582
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
1583
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
1584
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
1585
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
1586
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
1587
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1588
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
1589
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
1590
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
1591
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
1592
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
1593
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
1594
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
1595
1595
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
1596
1596
  --borderColor-closed-muted: #3d444d66; /** Subtle border for closed state indicators */
1597
1597
  --borderColor-draft-muted: #3d444d66; /** Subtle border for draft state indicators */
@@ -1733,14 +1733,14 @@
1733
1733
  --avatar-borderColor: var(--borderColor-translucent);
1734
1734
  --border-closed-emphasis: var(--border-danger-emphasis);
1735
1735
  --border-closed-muted: var(--border-danger-muted);
1736
- --border-draft-muted: 0.0625rem solid #3d444d66;
1737
- --border-muted: 0.0625rem solid #3d444db3;
1738
- --border-neutral-emphasis: 0.0625rem solid #656c76;
1736
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1737
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1738
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
1739
1739
  --border-open-emphasis: var(--border-success-emphasis);
1740
1740
  --border-open-muted: var(--border-success-muted);
1741
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1742
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
1743
- --border-upsell-muted: 0.0625rem solid #ab7df866;
1741
+ --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. */
1742
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1743
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1744
1744
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1745
1745
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1746
1746
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1785,12 +1785,12 @@
1785
1785
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
1786
1786
  --dashboard-bgColor: var(--bgColor-inset);
1787
1787
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
1788
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
1788
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1789
1789
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1790
1790
  --overlay-borderColor: var(--borderColor-muted);
1791
1791
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1792
- --border-draft-emphasis: 0.0625rem solid #656c76;
1793
- --border-neutral-muted: 0.0625rem solid #3d444db3;
1792
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1793
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1794
1794
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
1795
1795
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
1796
1796
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
package/dist/css/functional/themes/dark-dimmed-high-contrast.css CHANGED
@@ -663,24 +663,24 @@
663
663
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
664
664
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
665
665
  --bgColor-white: #cdd9e5; /** Pure white background */
666
- --border-accent-emphasis: 0.0625rem solid #6cb6ff;
667
- --border-accent-muted: 0.0625rem solid #6cb6ff;
668
- --border-attention-emphasis: 0.0625rem solid #daaa3f;
669
- --border-attention-muted: 0.0625rem solid #daaa3f;
670
- --border-danger-emphasis: 0.0625rem solid #ff938a;
671
- --border-danger-muted: 0.0625rem solid #ff938a;
672
- --border-default: 0.0625rem solid #b7bdc8;
673
- --border-disabled: 0.0625rem solid #656c761a;
674
- --border-done-emphasis: 0.0625rem solid #dcbdfb;
675
- --border-done-muted: 0.0625rem solid #dcbdfb;
676
- --border-severe-emphasis: 0.0625rem solid #f69d50;
677
- --border-severe-muted: 0.0625rem solid #f69d50;
678
- --border-sponsors-emphasis: 0.0625rem solid #e275ad;
679
- --border-sponsors-muted: 0.0625rem solid #fc8dc7;
680
- --border-success-emphasis: 0.0625rem solid #6bc46d;
681
- --border-success-muted: 0.0625rem solid #6bc46d;
682
- --border-translucent: 0.0625rem solid #9198a1; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
683
- --border-transparent: 0.0625rem solid #00000000;
666
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
667
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
668
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
669
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
670
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
671
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
672
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
673
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
674
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
675
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
676
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
677
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
678
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
679
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
680
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
681
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
682
+ --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. */
683
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
684
684
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
685
685
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
686
686
  --borderColor-emphasis: var(--borderColor-default); /** Strong border for emphasis and visual weight */
@@ -838,12 +838,12 @@
838
838
  --avatar-borderColor: var(--borderColor-emphasis);
839
839
  --border-closed-emphasis: var(--border-danger-emphasis);
840
840
  --border-closed-muted: var(--border-danger-muted);
841
- --border-emphasis: 0.0625rem solid #b7bdc8;
842
- --border-muted: 0.0625rem solid #b7bdc8;
841
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
842
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
843
843
  --border-open-emphasis: var(--border-success-emphasis);
844
844
  --border-open-muted: var(--border-success-muted);
845
- --border-upsell-emphasis: 0.0625rem solid #dcbdfb;
846
- --border-upsell-muted: 0.0625rem solid #dcbdfb;
845
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
846
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
847
847
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
848
848
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
849
849
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -878,7 +878,7 @@
878
878
  --controlKnob-borderColor-checked: var(--control-checked-bgColor-rest);
879
879
  --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
880
880
  --controlTrack-borderColor-rest: var(--borderColor-emphasis);
881
- --focus-outline: 0.125rem solid #6cb6ff; /** Focus ring outline for keyboard navigation and accessibility. */
881
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
882
882
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
883
883
  --progressBar-track-bgColor: var(--bgColor-inverse);
884
884
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -888,8 +888,8 @@
888
888
  --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
889
889
  --tooltip-bgColor: var(--bgColor-inverse);
890
890
  --tooltip-fgColor: var(--fgColor-onInverse);
891
- --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
892
- --border-neutral-muted: 0.0625rem solid #b7bdc8;
891
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
892
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
893
893
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
894
894
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
895
895
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
@@ -900,8 +900,8 @@
900
900
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
901
901
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
902
902
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
903
- --border-draft-emphasis: 0.0625rem solid #b7bdc8;
904
- --border-draft-muted: 0.0625rem solid #b7bdc8;
903
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
904
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
905
905
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
906
906
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
907
907
  }
@@ -1566,24 +1566,24 @@
1566
1566
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
1567
1567
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
1568
1568
  --bgColor-white: #cdd9e5; /** Pure white background */
1569
- --border-accent-emphasis: 0.0625rem solid #6cb6ff;
1570
- --border-accent-muted: 0.0625rem solid #6cb6ff;
1571
- --border-attention-emphasis: 0.0625rem solid #daaa3f;
1572
- --border-attention-muted: 0.0625rem solid #daaa3f;
1573
- --border-danger-emphasis: 0.0625rem solid #ff938a;
1574
- --border-danger-muted: 0.0625rem solid #ff938a;
1575
- --border-default: 0.0625rem solid #b7bdc8;
1576
- --border-disabled: 0.0625rem solid #656c761a;
1577
- --border-done-emphasis: 0.0625rem solid #dcbdfb;
1578
- --border-done-muted: 0.0625rem solid #dcbdfb;
1579
- --border-severe-emphasis: 0.0625rem solid #f69d50;
1580
- --border-severe-muted: 0.0625rem solid #f69d50;
1581
- --border-sponsors-emphasis: 0.0625rem solid #e275ad;
1582
- --border-sponsors-muted: 0.0625rem solid #fc8dc7;
1583
- --border-success-emphasis: 0.0625rem solid #6bc46d;
1584
- --border-success-muted: 0.0625rem solid #6bc46d;
1585
- --border-translucent: 0.0625rem solid #9198a1; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1586
- --border-transparent: 0.0625rem solid #00000000;
1569
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
1570
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
1571
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
1572
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
1573
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
1574
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
1575
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
1576
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
1577
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
1578
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
1579
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
1580
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
1581
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
1582
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
1583
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
1584
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
1585
+ --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. */
1586
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
1587
1587
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
1588
1588
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
1589
1589
  --borderColor-emphasis: var(--borderColor-default); /** Strong border for emphasis and visual weight */
@@ -1741,12 +1741,12 @@
1741
1741
  --avatar-borderColor: var(--borderColor-emphasis);
1742
1742
  --border-closed-emphasis: var(--border-danger-emphasis);
1743
1743
  --border-closed-muted: var(--border-danger-muted);
1744
- --border-emphasis: 0.0625rem solid #b7bdc8;
1745
- --border-muted: 0.0625rem solid #b7bdc8;
1744
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1745
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1746
1746
  --border-open-emphasis: var(--border-success-emphasis);
1747
1747
  --border-open-muted: var(--border-success-muted);
1748
- --border-upsell-emphasis: 0.0625rem solid #dcbdfb;
1749
- --border-upsell-muted: 0.0625rem solid #dcbdfb;
1748
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1749
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1750
1750
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
1751
1751
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1752
1752
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1781,7 +1781,7 @@
1781
1781
  --controlKnob-borderColor-checked: var(--control-checked-bgColor-rest);
1782
1782
  --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
1783
1783
  --controlTrack-borderColor-rest: var(--borderColor-emphasis);
1784
- --focus-outline: 0.125rem solid #6cb6ff; /** Focus ring outline for keyboard navigation and accessibility. */
1784
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1785
1785
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1786
1786
  --progressBar-track-bgColor: var(--bgColor-inverse);
1787
1787
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -1791,8 +1791,8 @@
1791
1791
  --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
1792
1792
  --tooltip-bgColor: var(--bgColor-inverse);
1793
1793
  --tooltip-fgColor: var(--fgColor-onInverse);
1794
- --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
1795
- --border-neutral-muted: 0.0625rem solid #b7bdc8;
1794
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
1795
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1796
1796
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1797
1797
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
1798
1798
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
@@ -1803,8 +1803,8 @@
1803
1803
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1804
1804
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
1805
1805
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1806
- --border-draft-emphasis: 0.0625rem solid #b7bdc8;
1807
- --border-draft-muted: 0.0625rem solid #b7bdc8;
1806
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1807
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1808
1808
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1809
1809
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1810
1810
  }