@primer/primitives 11.4.1-rc.eb8ee149 → 11.5.0-rc.14eaeb12

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 (190) hide show
  1. package/DESIGN_TOKENS_GUIDE.md +185 -0
  2. package/DESIGN_TOKENS_SPEC.md +136 -8
  3. package/dist/build/formats/jsonFigma.js +8 -1
  4. package/dist/build/formats/markdownLlmGuidelines.js +349 -0
  5. package/dist/build/schemas/borderToken.d.ts +61 -5
  6. package/dist/build/schemas/borderToken.js +2 -1
  7. package/dist/build/schemas/colorToken.d.ts +639 -30
  8. package/dist/build/schemas/colorToken.js +3 -2
  9. package/dist/build/schemas/colorW3cValue.d.ts +28 -0
  10. package/dist/build/schemas/colorW3cValue.js +42 -0
  11. package/dist/build/schemas/cubicBezierToken.d.ts +1 -1
  12. package/dist/build/schemas/dimensionToken.d.ts +9 -2
  13. package/dist/build/schemas/dimensionValue.d.ts +12 -1
  14. package/dist/build/schemas/dimensionValue.js +10 -13
  15. package/dist/build/schemas/durationToken.d.ts +8 -2
  16. package/dist/build/schemas/durationValue.d.ts +11 -1
  17. package/dist/build/schemas/durationValue.js +13 -3
  18. package/dist/build/schemas/fontFamilyToken.d.ts +1 -1
  19. package/dist/build/schemas/fontWeightToken.d.ts +1 -1
  20. package/dist/build/schemas/gradientToken.d.ts +23 -2
  21. package/dist/build/schemas/gradientToken.js +2 -1
  22. package/dist/build/schemas/numberToken.d.ts +1 -1
  23. package/dist/build/schemas/shadowToken.d.ts +1751 -127
  24. package/dist/build/schemas/shadowToken.js +8 -2
  25. package/dist/build/schemas/stringToken.d.ts +1 -1
  26. package/dist/build/schemas/stringToken.js +1 -1
  27. package/dist/build/schemas/tokenType.d.ts +1 -1
  28. package/dist/build/schemas/transitionToken.d.ts +15 -3
  29. package/dist/build/schemas/typographyToken.d.ts +19 -5
  30. package/dist/build/schemas/typographyToken.js +1 -1
  31. package/dist/build/schemas/validTokenType.d.ts +1 -1
  32. package/dist/build/schemas/validTokenType.js +1 -1
  33. package/dist/build/schemas/viewportRangeToken.d.ts +1 -1
  34. package/dist/build/transformers/borderToCss.js +19 -1
  35. package/dist/build/transformers/colorAlphaToCss.js +6 -3
  36. package/dist/build/transformers/colorToHex.js +5 -2
  37. package/dist/build/transformers/colorToRgbAlpha.js +5 -2
  38. package/dist/build/transformers/colorToRgbaFloat.js +5 -0
  39. package/dist/build/transformers/dimensionToPixelUnitless.d.ts +3 -2
  40. package/dist/build/transformers/dimensionToPixelUnitless.js +22 -26
  41. package/dist/build/transformers/dimensionToRem.d.ts +2 -1
  42. package/dist/build/transformers/dimensionToRem.js +21 -22
  43. package/dist/build/transformers/dimensionToRemPxArray.d.ts +2 -1
  44. package/dist/build/transformers/dimensionToRemPxArray.js +21 -22
  45. package/dist/build/transformers/durationToCss.d.ts +2 -1
  46. package/dist/build/transformers/durationToCss.js +19 -12
  47. package/dist/build/transformers/gradientToCss.js +2 -1
  48. package/dist/build/transformers/shadowToCss.js +15 -1
  49. package/dist/build/transformers/utilities/normalizeColorValue.d.ts +23 -0
  50. package/dist/build/transformers/utilities/normalizeColorValue.js +74 -0
  51. package/dist/build/transformers/utilities/parseDimension.d.ts +12 -0
  52. package/dist/build/transformers/utilities/parseDimension.js +31 -0
  53. package/dist/build/types/borderTokenValue.d.ts +5 -2
  54. package/dist/build/types/dimensionTokenValue.d.ts +9 -0
  55. package/dist/build/types/shadowTokenValue.d.ts +8 -5
  56. package/dist/css/base/motion/motion.css +1 -1
  57. package/dist/css/functional/size/radius.css +1 -1
  58. package/dist/css/functional/size/size-coarse.css +1 -0
  59. package/dist/css/functional/size/size-fine.css +1 -0
  60. package/dist/css/functional/size/size.css +5 -0
  61. package/dist/css/functional/themes/dark-colorblind-high-contrast.css +42 -30
  62. package/dist/css/functional/themes/dark-colorblind.css +42 -30
  63. package/dist/css/functional/themes/dark-dimmed-high-contrast.css +42 -30
  64. package/dist/css/functional/themes/dark-dimmed.css +42 -30
  65. package/dist/css/functional/themes/dark-high-contrast.css +42 -30
  66. package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +42 -30
  67. package/dist/css/functional/themes/dark-tritanopia.css +42 -30
  68. package/dist/css/functional/themes/dark.css +42 -30
  69. package/dist/css/functional/themes/light-colorblind-high-contrast.css +42 -30
  70. package/dist/css/functional/themes/light-colorblind.css +42 -30
  71. package/dist/css/functional/themes/light-high-contrast.css +42 -30
  72. package/dist/css/functional/themes/light-tritanopia-high-contrast.css +42 -30
  73. package/dist/css/functional/themes/light-tritanopia.css +42 -30
  74. package/dist/css/functional/themes/light.css +42 -30
  75. package/dist/docs/base/motion/motion.json +96 -24
  76. package/dist/docs/base/size/size.json +76 -19
  77. package/dist/docs/base/typography/typography.json +24 -6
  78. package/dist/docs/functional/size/border.json +26 -11
  79. package/dist/docs/functional/size/breakpoints.json +24 -6
  80. package/dist/docs/functional/size/radius.json +18 -6
  81. package/dist/docs/functional/size/size-coarse.json +55 -2
  82. package/dist/docs/functional/size/size-fine.json +55 -2
  83. package/dist/docs/functional/size/size.json +195 -15
  84. package/dist/docs/functional/themes/dark-colorblind-high-contrast.json +3921 -714
  85. package/dist/docs/functional/themes/dark-colorblind.json +3911 -712
  86. package/dist/docs/functional/themes/dark-dimmed-high-contrast.json +3774 -547
  87. package/dist/docs/functional/themes/dark-dimmed.json +3801 -554
  88. package/dist/docs/functional/themes/dark-high-contrast.json +3926 -715
  89. package/dist/docs/functional/themes/dark-tritanopia-high-contrast.json +3936 -717
  90. package/dist/docs/functional/themes/dark-tritanopia.json +3769 -546
  91. package/dist/docs/functional/themes/dark.json +3920 -713
  92. package/dist/docs/functional/themes/light-colorblind-high-contrast.json +3780 -553
  93. package/dist/docs/functional/themes/light-colorblind.json +3767 -548
  94. package/dist/docs/functional/themes/light-high-contrast.json +3785 -554
  95. package/dist/docs/functional/themes/light-tritanopia-high-contrast.json +3785 -554
  96. package/dist/docs/functional/themes/light-tritanopia.json +3777 -550
  97. package/dist/docs/functional/themes/light.json +3782 -551
  98. package/dist/docs/functional/typography/typography.json +8 -2
  99. package/dist/fallbacks/base/motion/motion.json +48 -12
  100. package/dist/fallbacks/functional/size/size-coarse.json +2 -1
  101. package/dist/fallbacks/functional/size/size-fine.json +2 -1
  102. package/dist/fallbacks/functional/size/size.json +5 -0
  103. package/dist/figma/dimension/dimension.json +56 -1
  104. package/dist/figma/themes/dark-colorblind.json +49 -1
  105. package/dist/figma/themes/dark-dimmed.json +51 -3
  106. package/dist/figma/themes/dark-high-contrast.json +49 -1
  107. package/dist/figma/themes/dark-tritanopia.json +49 -1
  108. package/dist/figma/themes/dark.json +49 -1
  109. package/dist/figma/themes/light-colorblind.json +53 -5
  110. package/dist/figma/themes/light-high-contrast.json +53 -5
  111. package/dist/figma/themes/light-tritanopia.json +53 -5
  112. package/dist/figma/themes/light.json +53 -5
  113. package/dist/internalCss/dark-colorblind-high-contrast.css +42 -30
  114. package/dist/internalCss/dark-colorblind.css +42 -30
  115. package/dist/internalCss/dark-dimmed-high-contrast.css +42 -30
  116. package/dist/internalCss/dark-dimmed.css +42 -30
  117. package/dist/internalCss/dark-high-contrast.css +42 -30
  118. package/dist/internalCss/dark-tritanopia-high-contrast.css +42 -30
  119. package/dist/internalCss/dark-tritanopia.css +42 -30
  120. package/dist/internalCss/dark.css +42 -30
  121. package/dist/internalCss/light-colorblind-high-contrast.css +42 -30
  122. package/dist/internalCss/light-colorblind.css +42 -30
  123. package/dist/internalCss/light-high-contrast.css +42 -30
  124. package/dist/internalCss/light-tritanopia-high-contrast.css +42 -30
  125. package/dist/internalCss/light-tritanopia.css +42 -30
  126. package/dist/internalCss/light.css +42 -30
  127. package/dist/styleLint/base/motion/motion.json +96 -24
  128. package/dist/styleLint/base/size/size.json +76 -19
  129. package/dist/styleLint/base/typography/typography.json +30 -12
  130. package/dist/styleLint/functional/size/border.json +27 -12
  131. package/dist/styleLint/functional/size/breakpoints.json +24 -6
  132. package/dist/styleLint/functional/size/radius.json +19 -7
  133. package/dist/styleLint/functional/size/size-coarse.json +60 -7
  134. package/dist/styleLint/functional/size/size-fine.json +60 -7
  135. package/dist/styleLint/functional/size/size.json +246 -66
  136. package/dist/styleLint/functional/themes/dark-colorblind-high-contrast.json +4060 -733
  137. package/dist/styleLint/functional/themes/dark-colorblind.json +4050 -731
  138. package/dist/styleLint/functional/themes/dark-dimmed-high-contrast.json +3914 -567
  139. package/dist/styleLint/functional/themes/dark-dimmed.json +3941 -574
  140. package/dist/styleLint/functional/themes/dark-high-contrast.json +4065 -734
  141. package/dist/styleLint/functional/themes/dark-tritanopia-high-contrast.json +4075 -736
  142. package/dist/styleLint/functional/themes/dark-tritanopia.json +4079 -736
  143. package/dist/styleLint/functional/themes/dark.json +4059 -732
  144. package/dist/styleLint/functional/themes/light-colorblind-high-contrast.json +4091 -744
  145. package/dist/styleLint/functional/themes/light-colorblind.json +4078 -739
  146. package/dist/styleLint/functional/themes/light-high-contrast.json +4096 -745
  147. package/dist/styleLint/functional/themes/light-tritanopia-high-contrast.json +4096 -745
  148. package/dist/styleLint/functional/themes/light-tritanopia.json +4088 -741
  149. package/dist/styleLint/functional/themes/light.json +4093 -742
  150. package/dist/styleLint/functional/typography/typography.json +28 -22
  151. package/package.json +5 -4
  152. package/src/tokens/base/color/dark/dark.dimmed.json5 +405 -81
  153. package/src/tokens/base/color/dark/dark.high-contrast.json5 +405 -81
  154. package/src/tokens/base/color/dark/dark.json5 +475 -95
  155. package/src/tokens/base/color/dark/display-dark.json5 +960 -192
  156. package/src/tokens/base/color/light/display-light.json5 +960 -192
  157. package/src/tokens/base/color/light/light.high-contrast.json5 +405 -81
  158. package/src/tokens/base/color/light/light.json5 +475 -95
  159. package/src/tokens/base/motion/timing.json5 +12 -12
  160. package/src/tokens/base/size/size.json5 +194 -194
  161. package/src/tokens/base/typography/typography.json5 +6 -6
  162. package/src/tokens/component/avatar.json5 +72 -44
  163. package/src/tokens/component/button.json5 +1846 -1191
  164. package/src/tokens/component/reactionButton.json5 +20 -4
  165. package/src/tokens/functional/border/border.json5 +33 -2
  166. package/src/tokens/functional/color/bgColor.json5 +18 -2
  167. package/src/tokens/functional/color/borderColor.json5 +8 -1
  168. package/src/tokens/functional/color/control.json5 +160 -32
  169. package/src/tokens/functional/color/display.json5 +7 -0
  170. package/src/tokens/functional/color/fgColor.json5 +13 -1
  171. package/src/tokens/functional/color/syntax.json5 +24 -2
  172. package/src/tokens/functional/shadow/shadow.json5 +1254 -163
  173. package/src/tokens/functional/size/border.json5 +8 -8
  174. package/src/tokens/functional/size/breakpoints.json5 +6 -6
  175. package/src/tokens/functional/size/radius.json5 +5 -5
  176. package/src/tokens/functional/size/size-coarse.json5 +15 -0
  177. package/src/tokens/functional/size/size-fine.json5 +15 -0
  178. package/src/tokens/functional/size/size.json5 +65 -15
  179. package/src/tokens/functional/typography/typography.json5 +8 -4
  180. package/dist/build/parsers/index.d.ts +0 -1
  181. package/dist/build/parsers/index.js +0 -1
  182. package/dist/build/parsers/w3cJsonParser.d.ts +0 -6
  183. package/dist/build/parsers/w3cJsonParser.js +0 -25
  184. package/dist/removed/testing.json5 +0 -4
  185. package/guidelines/color.llm.md +0 -16
  186. package/guidelines/guidelines.llm.md +0 -34
  187. package/guidelines/motion.llm.md +0 -41
  188. package/guidelines/spacing.llm.md +0 -20
  189. package/guidelines/typography.llm.md +0 -14
  190. package/src/tokens/removed/testing.json5 +0 -4
@@ -23,7 +23,7 @@
23
23
  --control-checked-borderColor-hover: #3876d3;
24
24
  --fgColor-accent: #478be6; /** Accent text for links and interactive elements */
25
25
  --reactionButton-selected-bgColor-hover: #4285e55c;
26
- --avatar-shadow: 0px 0px 0px 2px #0d1117;
26
+ --avatar-shadow: 0 0 0 2px #0d1117;
27
27
  --avatarStack-fade-bgColor-default: #3d444d;
28
28
  --avatarStack-fade-bgColor-muted: #2a313c;
29
29
  --bgColor-accent-emphasis: #316dca; /** Strong accent background for active states and focused states */
@@ -71,9 +71,9 @@
71
71
  --button-danger-bgColor-hover: #ad2e2c;
72
72
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
73
73
  --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
74
- --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
74
+ --button-danger-shadow-selected: 0 0 0 0 #00000000;
75
75
  --button-default-borderColor-rest: var(--control-borderColor-rest);
76
- --button-default-shadow-resting: 0px 0px 0px 0px #000000;
76
+ --button-default-shadow-resting: 0 0 0 0 #00000000;
77
77
  --button-inactive-bgColor: #2a313c;
78
78
  --button-inactive-fgColor: #656c76;
79
79
  --button-invisible-bgColor-disabled: #00000000;
@@ -84,8 +84,8 @@
84
84
  --button-outline-bgColor-rest: #f0f6fc;
85
85
  --button-outline-fgColor-hover: #539bf5;
86
86
  --button-outline-fgColor-rest: #4184e4;
87
- --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
88
- --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
87
+ --button-outline-shadow-selected: 0 0 0 0 #00000000;
88
+ --button-primary-shadow-selected: 0 0 0 0 #00000000;
89
89
  --button-star-iconColor: #daaa3f;
90
90
  --buttonCounter-danger-bgColor-rest: #5d0f1233;
91
91
  --buttonCounter-default-bgColor-rest: #2f3742;
@@ -710,7 +710,7 @@
710
710
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
711
711
  --borderColor-open-emphasis: var(--borderColor-success-emphasis); /** Strong border for open state badges */
712
712
  --borderColor-open-muted: var(--borderColor-success-muted); /** Subtle border for open state indicators */
713
- --borderColor-translucent: #cdd9e526; /** Semi-transparent border for overlays and layered elements */
713
+ --borderColor-translucent: #cdd9e526; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
714
714
  --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
715
715
  --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
716
716
  --button-danger-bgColor-active: var(--bgColor-danger-emphasis);
@@ -845,15 +845,15 @@
845
845
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
846
846
  --selectMenu-borderColor: var(--borderColor-default);
847
847
  --selection-bgColor: #316dcab3; /** Background color for text selection highlights */
848
- --shadow-floating-large: 0px 0px 0px 1px #3d444d, 0px 24px 48px 0px #010409; /** Large floating shadow for modals and dialogs */
849
- --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
850
- --shadow-floating-medium: 0px 0px 0px 1px #3d444d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
851
- --shadow-floating-small: 0px 0px 0px 1px #3d444d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
852
- --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
853
- --shadow-inset: inset 0px 1px 0px 0px #0104093d;
854
- --shadow-resting-medium: 0px 1px 1px 0px #01040966, 0px 3px 6px 0px #010409cc;
855
- --shadow-resting-small: 0px 1px 1px 0px #01040999, 0px 1px 3px 0px #01040999;
856
- --shadow-resting-xsmall: 0px 1px 1px 0px #010409cc;
848
+ --shadow-floating-large: 0 0 0 1px #3d444d, 0 24px 48px 0 #010409; /** Large floating shadow for modals and dialogs */
849
+ --shadow-floating-legacy: 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Legacy floating shadow for backward compatibility */
850
+ --shadow-floating-medium: 0 0 0 1px #3d444d, 0 8px 16px -4px #01040966, 0 4px 32px -4px #01040966, 0 24px 48px -12px #01040966, 0 48px 96px -24px #01040966; /** Medium floating shadow for popovers and action menus */
851
+ --shadow-floating-small: 0 0 0 1px #3d444d, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
852
+ --shadow-floating-xlarge: 0 0 0 1px #3d444d, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
853
+ --shadow-inset: inset 0 1px 0 0 #0104093d; /** Inset shadow for recessed elements */
854
+ --shadow-resting-medium: 0 1px 1px 0 #01040966, 0 3px 6px 0 #010409cc; /** Medium resting shadow for cards and elevated surfaces */
855
+ --shadow-resting-small: 0 1px 1px 0 #01040999, 0 1px 3px 0 #01040999; /** Small resting shadow for buttons and interactive elements */
856
+ --shadow-resting-xsmall: 0 1px 1px 0 #010409cc; /** Extra small resting shadow for minimal elevation */
857
857
  --tooltip-bgColor: var(--bgColor-emphasis);
858
858
  --tooltip-fgColor: var(--fgColor-onEmphasis);
859
859
  --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
@@ -862,14 +862,18 @@
862
862
  --avatar-borderColor: var(--borderColor-translucent);
863
863
  --border-closed-emphasis: var(--border-danger-emphasis);
864
864
  --border-closed-muted: var(--border-danger-muted);
865
+ --border-draft-muted: 0.0625rem solid #3d444db3;
865
866
  --border-neutral-emphasis: 0.0625rem solid #656c76;
866
867
  --border-open-emphasis: var(--border-success-emphasis);
867
868
  --border-open-muted: var(--border-success-muted);
869
+ --border-translucent: 0.0625rem solid #cdd9e526; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
868
870
  --border-upsell-emphasis: 0.0625rem solid #8256d0;
869
871
  --border-upsell-muted: 0.0625rem solid #986ee266;
870
872
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
871
873
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
874
+ --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
872
875
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
876
+ --button-default-fgColor-disabled: var(--control-fgColor-disabled);
873
877
  --button-default-fgColor-rest: var(--control-fgColor-rest);
874
878
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
875
879
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
@@ -879,6 +883,7 @@
879
883
  --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
880
884
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
881
885
  --button-primary-borderColor-rest: var(--borderColor-translucent);
886
+ --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
882
887
  --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
883
888
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
884
889
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
@@ -892,6 +897,7 @@
892
897
  --controlKnob-borderColor-checked: var(--control-checked-bgColor-rest);
893
898
  --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
894
899
  --focus-outline: 2px solid #316dca; /** Focus ring outline for keyboard navigation and accessibility. */
900
+ --border-draft-emphasis: 0.0625rem solid #656c76;
895
901
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
896
902
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
897
903
  --button-primary-borderColor-active: var(--button-primary-borderColor-rest);
@@ -920,7 +926,7 @@
920
926
  --control-checked-borderColor-hover: #3876d3;
921
927
  --fgColor-accent: #478be6; /** Accent text for links and interactive elements */
922
928
  --reactionButton-selected-bgColor-hover: #4285e55c;
923
- --avatar-shadow: 0px 0px 0px 2px #0d1117;
929
+ --avatar-shadow: 0 0 0 2px #0d1117;
924
930
  --avatarStack-fade-bgColor-default: #3d444d;
925
931
  --avatarStack-fade-bgColor-muted: #2a313c;
926
932
  --bgColor-accent-emphasis: #316dca; /** Strong accent background for active states and focused states */
@@ -968,9 +974,9 @@
968
974
  --button-danger-bgColor-hover: #ad2e2c;
969
975
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
970
976
  --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
971
- --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
977
+ --button-danger-shadow-selected: 0 0 0 0 #00000000;
972
978
  --button-default-borderColor-rest: var(--control-borderColor-rest);
973
- --button-default-shadow-resting: 0px 0px 0px 0px #000000;
979
+ --button-default-shadow-resting: 0 0 0 0 #00000000;
974
980
  --button-inactive-bgColor: #2a313c;
975
981
  --button-inactive-fgColor: #656c76;
976
982
  --button-invisible-bgColor-disabled: #00000000;
@@ -981,8 +987,8 @@
981
987
  --button-outline-bgColor-rest: #f0f6fc;
982
988
  --button-outline-fgColor-hover: #539bf5;
983
989
  --button-outline-fgColor-rest: #4184e4;
984
- --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
985
- --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
990
+ --button-outline-shadow-selected: 0 0 0 0 #00000000;
991
+ --button-primary-shadow-selected: 0 0 0 0 #00000000;
986
992
  --button-star-iconColor: #daaa3f;
987
993
  --buttonCounter-danger-bgColor-rest: #5d0f1233;
988
994
  --buttonCounter-default-bgColor-rest: #2f3742;
@@ -1607,7 +1613,7 @@
1607
1613
  --borderColor-neutral-emphasis: var(--borderColor-emphasis); /** Strong neutral semantic border */
1608
1614
  --borderColor-open-emphasis: var(--borderColor-success-emphasis); /** Strong border for open state badges */
1609
1615
  --borderColor-open-muted: var(--borderColor-success-muted); /** Subtle border for open state indicators */
1610
- --borderColor-translucent: #cdd9e526; /** Semi-transparent border for overlays and layered elements */
1616
+ --borderColor-translucent: #cdd9e526; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1611
1617
  --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
1612
1618
  --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
1613
1619
  --button-danger-bgColor-active: var(--bgColor-danger-emphasis);
@@ -1742,15 +1748,15 @@
1742
1748
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
1743
1749
  --selectMenu-borderColor: var(--borderColor-default);
1744
1750
  --selection-bgColor: #316dcab3; /** Background color for text selection highlights */
1745
- --shadow-floating-large: 0px 0px 0px 1px #3d444d, 0px 24px 48px 0px #010409; /** Large floating shadow for modals and dialogs */
1746
- --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
1747
- --shadow-floating-medium: 0px 0px 0px 1px #3d444d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
1748
- --shadow-floating-small: 0px 0px 0px 1px #3d444d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
1749
- --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
1750
- --shadow-inset: inset 0px 1px 0px 0px #0104093d;
1751
- --shadow-resting-medium: 0px 1px 1px 0px #01040966, 0px 3px 6px 0px #010409cc;
1752
- --shadow-resting-small: 0px 1px 1px 0px #01040999, 0px 1px 3px 0px #01040999;
1753
- --shadow-resting-xsmall: 0px 1px 1px 0px #010409cc;
1751
+ --shadow-floating-large: 0 0 0 1px #3d444d, 0 24px 48px 0 #010409; /** Large floating shadow for modals and dialogs */
1752
+ --shadow-floating-legacy: 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Legacy floating shadow for backward compatibility */
1753
+ --shadow-floating-medium: 0 0 0 1px #3d444d, 0 8px 16px -4px #01040966, 0 4px 32px -4px #01040966, 0 24px 48px -12px #01040966, 0 48px 96px -24px #01040966; /** Medium floating shadow for popovers and action menus */
1754
+ --shadow-floating-small: 0 0 0 1px #3d444d, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
1755
+ --shadow-floating-xlarge: 0 0 0 1px #3d444d, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
1756
+ --shadow-inset: inset 0 1px 0 0 #0104093d; /** Inset shadow for recessed elements */
1757
+ --shadow-resting-medium: 0 1px 1px 0 #01040966, 0 3px 6px 0 #010409cc; /** Medium resting shadow for cards and elevated surfaces */
1758
+ --shadow-resting-small: 0 1px 1px 0 #01040999, 0 1px 3px 0 #01040999; /** Small resting shadow for buttons and interactive elements */
1759
+ --shadow-resting-xsmall: 0 1px 1px 0 #010409cc; /** Extra small resting shadow for minimal elevation */
1754
1760
  --tooltip-bgColor: var(--bgColor-emphasis);
1755
1761
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1756
1762
  --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
@@ -1759,14 +1765,18 @@
1759
1765
  --avatar-borderColor: var(--borderColor-translucent);
1760
1766
  --border-closed-emphasis: var(--border-danger-emphasis);
1761
1767
  --border-closed-muted: var(--border-danger-muted);
1768
+ --border-draft-muted: 0.0625rem solid #3d444db3;
1762
1769
  --border-neutral-emphasis: 0.0625rem solid #656c76;
1763
1770
  --border-open-emphasis: var(--border-success-emphasis);
1764
1771
  --border-open-muted: var(--border-success-muted);
1772
+ --border-translucent: 0.0625rem solid #cdd9e526; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1765
1773
  --border-upsell-emphasis: 0.0625rem solid #8256d0;
1766
1774
  --border-upsell-muted: 0.0625rem solid #986ee266;
1767
1775
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1768
1776
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
1777
+ --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
1769
1778
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1779
+ --button-default-fgColor-disabled: var(--control-fgColor-disabled);
1770
1780
  --button-default-fgColor-rest: var(--control-fgColor-rest);
1771
1781
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
1772
1782
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
@@ -1776,6 +1786,7 @@
1776
1786
  --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
1777
1787
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1778
1788
  --button-primary-borderColor-rest: var(--borderColor-translucent);
1789
+ --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
1779
1790
  --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
1780
1791
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
1781
1792
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
@@ -1789,6 +1800,7 @@
1789
1800
  --controlKnob-borderColor-checked: var(--control-checked-bgColor-rest);
1790
1801
  --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
1791
1802
  --focus-outline: 2px solid #316dca; /** Focus ring outline for keyboard navigation and accessibility. */
1803
+ --border-draft-emphasis: 0.0625rem solid #656c76;
1792
1804
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
1793
1805
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1794
1806
  --button-primary-borderColor-active: var(--button-primary-borderColor-rest);
@@ -17,7 +17,7 @@
17
17
  --fgColor-sponsors: #ff90c8; /** Text color for GitHub Sponsors content */
18
18
  --fgColor-success: #2bd853; /** Success text for positive feedback and completed states */
19
19
  --reactionButton-selected-bgColor-hover: #5dadff5c;
20
- --avatar-shadow: 0px 0px 0px 2px #0d1117;
20
+ --avatar-shadow: 0 0 0 2px #0d1117;
21
21
  --avatarStack-fade-bgColor-default: #3d444d;
22
22
  --avatarStack-fade-bgColor-muted: #2a313c;
23
23
  --bgColor-accent-emphasis: #194fb1; /** Strong accent background for active states and focused states */
@@ -56,14 +56,14 @@
56
56
  --borderColor-sponsors-muted: #f87cbd; /** Subtle border for GitHub Sponsors content */
57
57
  --borderColor-success-emphasis: #09b43a; /** Strong success border for prominent positive elements */
58
58
  --borderColor-success-muted: #0ac740; /** Subtle success border for positive feedback elements */
59
- --borderColor-translucent: #9198a1; /** Semi-transparent border for overlays and layered elements */
59
+ --borderColor-translucent: #9198a1; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
60
60
  --borderColor-transparent: #00000000; /** Fully transparent border */
61
61
  --button-danger-bgColor-hover: #ad0116;
62
62
  --button-danger-borderColor-active: #ffb1af;
63
63
  --button-danger-borderColor-hover: #ffb1af;
64
64
  --button-danger-fgColor-rest: #ffb1af;
65
- --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
66
- --button-default-shadow-resting: 0px 0px 0px 0px #000000;
65
+ --button-danger-shadow-selected: 0 0 0 0 #00000000;
66
+ --button-default-shadow-resting: 0 0 0 0 #00000000;
67
67
  --button-inactive-fgColor: #b7bdc8;
68
68
  --button-invisible-bgColor-active: #212830;
69
69
  --button-invisible-bgColor-disabled: #00000000;
@@ -76,10 +76,10 @@
76
76
  --button-outline-fgColor-disabled: #74b9ff80;
77
77
  --button-outline-fgColor-hover: #71b7ff;
78
78
  --button-outline-fgColor-rest: #5cacff;
79
- --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
79
+ --button-outline-shadow-selected: 0 0 0 0 #00000000;
80
80
  --button-primary-borderColor-disabled: #4ae16866;
81
81
  --button-primary-borderColor-rest: #4ae168;
82
- --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
82
+ --button-primary-shadow-selected: 0 0 0 0 #00000000;
83
83
  --button-star-iconColor: #f7c843;
84
84
  --buttonCounter-default-bgColor-rest: #2f3742;
85
85
  --buttonCounter-outline-bgColor-hover: #194fb133;
@@ -664,6 +664,7 @@
664
664
  --border-sponsors-muted: 0.0625rem solid #f87cbd;
665
665
  --border-success-emphasis: 0.0625rem solid #09b43a;
666
666
  --border-success-muted: 0.0625rem solid #0ac740;
667
+ --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. */
667
668
  --border-transparent: 0.0625rem solid #00000000;
668
669
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
669
670
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
@@ -796,11 +797,11 @@
796
797
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
797
798
  --selectMenu-borderColor: var(--borderColor-default);
798
799
  --selection-bgColor: #194fb1b3; /** Background color for text selection highlights */
799
- --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
800
- --shadow-inset: inset 0px 1px 0px 0px #0104093d;
801
- --shadow-resting-medium: 0px 1px 1px 0px #01040966, 0px 3px 6px 0px #010409cc;
802
- --shadow-resting-small: 0px 1px 1px 0px #01040999, 0px 1px 3px 0px #01040999;
803
- --shadow-resting-xsmall: 0px 1px 1px 0px #010409cc;
800
+ --shadow-floating-legacy: 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Legacy floating shadow for backward compatibility */
801
+ --shadow-inset: inset 0 1px 0 0 #0104093d; /** Inset shadow for recessed elements */
802
+ --shadow-resting-medium: 0 1px 1px 0 #01040966, 0 3px 6px 0 #010409cc; /** Medium resting shadow for cards and elevated surfaces */
803
+ --shadow-resting-small: 0 1px 1px 0 #01040999, 0 1px 3px 0 #01040999; /** Small resting shadow for buttons and interactive elements */
804
+ --shadow-resting-xsmall: 0 1px 1px 0 #010409cc; /** Extra small resting shadow for minimal elevation */
804
805
  --topicTag-borderColor: var(--borderColor-accent-emphasis);
805
806
  --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
806
807
  --underlineNav-iconColor-rest: var(--fgColor-muted);
@@ -817,14 +818,17 @@
817
818
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
818
819
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
819
820
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
821
+ --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
820
822
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
821
823
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
822
824
  --button-default-borderColor-rest: var(--control-borderColor-rest);
825
+ --button-default-fgColor-disabled: var(--control-fgColor-disabled);
823
826
  --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
824
827
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
825
828
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
826
829
  --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
827
830
  --button-primary-fgColor-rest: var(--fgColor-white);
831
+ --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
828
832
  --button-primary-iconColor-rest: var(--fgColor-white);
829
833
  --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
830
834
  --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);
@@ -874,10 +878,10 @@
874
878
  --focus-outline: 2px solid #409eff; /** Focus ring outline for keyboard navigation and accessibility. */
875
879
  --page-header-bgColor: var(--bgColor-default);
876
880
  --progressBar-track-bgColor: var(--bgColor-inverse);
877
- --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409; /** Large floating shadow for modals and dialogs */
878
- --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
879
- --shadow-floating-small: 0px 0px 0px 1px #b7bdc8, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
880
- --shadow-floating-xlarge: 0px 0px 0px 1px #b7bdc8, 0px 32px 64px 0px #010409;
881
+ --shadow-floating-large: 0 0 0 1px #b7bdc8, 0 24px 48px 0 #010409; /** Large floating shadow for modals and dialogs */
882
+ --shadow-floating-medium: 0 0 0 1px #b7bdc8, 0 8px 16px -4px #01040966, 0 4px 32px -4px #01040966, 0 24px 48px -12px #01040966, 0 48px 96px -24px #01040966; /** Medium floating shadow for popovers and action menus */
883
+ --shadow-floating-small: 0 0 0 1px #b7bdc8, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
884
+ --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
881
885
  --tooltip-bgColor: var(--bgColor-inverse);
882
886
  --tooltip-fgColor: var(--fgColor-onInverse);
883
887
  --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
@@ -896,6 +900,8 @@
896
900
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
897
901
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
898
902
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
903
+ --border-draft-emphasis: 0.0625rem solid #b7bdc8;
904
+ --border-draft-muted: 0.0625rem solid #b7bdc8;
899
905
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
900
906
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
901
907
  }
@@ -914,7 +920,7 @@
914
920
  --fgColor-sponsors: #ff90c8; /** Text color for GitHub Sponsors content */
915
921
  --fgColor-success: #2bd853; /** Success text for positive feedback and completed states */
916
922
  --reactionButton-selected-bgColor-hover: #5dadff5c;
917
- --avatar-shadow: 0px 0px 0px 2px #0d1117;
923
+ --avatar-shadow: 0 0 0 2px #0d1117;
918
924
  --avatarStack-fade-bgColor-default: #3d444d;
919
925
  --avatarStack-fade-bgColor-muted: #2a313c;
920
926
  --bgColor-accent-emphasis: #194fb1; /** Strong accent background for active states and focused states */
@@ -953,14 +959,14 @@
953
959
  --borderColor-sponsors-muted: #f87cbd; /** Subtle border for GitHub Sponsors content */
954
960
  --borderColor-success-emphasis: #09b43a; /** Strong success border for prominent positive elements */
955
961
  --borderColor-success-muted: #0ac740; /** Subtle success border for positive feedback elements */
956
- --borderColor-translucent: #9198a1; /** Semi-transparent border for overlays and layered elements */
962
+ --borderColor-translucent: #9198a1; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
957
963
  --borderColor-transparent: #00000000; /** Fully transparent border */
958
964
  --button-danger-bgColor-hover: #ad0116;
959
965
  --button-danger-borderColor-active: #ffb1af;
960
966
  --button-danger-borderColor-hover: #ffb1af;
961
967
  --button-danger-fgColor-rest: #ffb1af;
962
- --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
963
- --button-default-shadow-resting: 0px 0px 0px 0px #000000;
968
+ --button-danger-shadow-selected: 0 0 0 0 #00000000;
969
+ --button-default-shadow-resting: 0 0 0 0 #00000000;
964
970
  --button-inactive-fgColor: #b7bdc8;
965
971
  --button-invisible-bgColor-active: #212830;
966
972
  --button-invisible-bgColor-disabled: #00000000;
@@ -973,10 +979,10 @@
973
979
  --button-outline-fgColor-disabled: #74b9ff80;
974
980
  --button-outline-fgColor-hover: #71b7ff;
975
981
  --button-outline-fgColor-rest: #5cacff;
976
- --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
982
+ --button-outline-shadow-selected: 0 0 0 0 #00000000;
977
983
  --button-primary-borderColor-disabled: #4ae16866;
978
984
  --button-primary-borderColor-rest: #4ae168;
979
- --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
985
+ --button-primary-shadow-selected: 0 0 0 0 #00000000;
980
986
  --button-star-iconColor: #f7c843;
981
987
  --buttonCounter-default-bgColor-rest: #2f3742;
982
988
  --buttonCounter-outline-bgColor-hover: #194fb133;
@@ -1561,6 +1567,7 @@
1561
1567
  --border-sponsors-muted: 0.0625rem solid #f87cbd;
1562
1568
  --border-success-emphasis: 0.0625rem solid #09b43a;
1563
1569
  --border-success-muted: 0.0625rem solid #0ac740;
1570
+ --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. */
1564
1571
  --border-transparent: 0.0625rem solid #00000000;
1565
1572
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
1566
1573
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
@@ -1693,11 +1700,11 @@
1693
1700
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
1694
1701
  --selectMenu-borderColor: var(--borderColor-default);
1695
1702
  --selection-bgColor: #194fb1b3; /** Background color for text selection highlights */
1696
- --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
1697
- --shadow-inset: inset 0px 1px 0px 0px #0104093d;
1698
- --shadow-resting-medium: 0px 1px 1px 0px #01040966, 0px 3px 6px 0px #010409cc;
1699
- --shadow-resting-small: 0px 1px 1px 0px #01040999, 0px 1px 3px 0px #01040999;
1700
- --shadow-resting-xsmall: 0px 1px 1px 0px #010409cc;
1703
+ --shadow-floating-legacy: 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Legacy floating shadow for backward compatibility */
1704
+ --shadow-inset: inset 0 1px 0 0 #0104093d; /** Inset shadow for recessed elements */
1705
+ --shadow-resting-medium: 0 1px 1px 0 #01040966, 0 3px 6px 0 #010409cc; /** Medium resting shadow for cards and elevated surfaces */
1706
+ --shadow-resting-small: 0 1px 1px 0 #01040999, 0 1px 3px 0 #01040999; /** Small resting shadow for buttons and interactive elements */
1707
+ --shadow-resting-xsmall: 0 1px 1px 0 #010409cc; /** Extra small resting shadow for minimal elevation */
1701
1708
  --topicTag-borderColor: var(--borderColor-accent-emphasis);
1702
1709
  --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
1703
1710
  --underlineNav-iconColor-rest: var(--fgColor-muted);
@@ -1714,14 +1721,17 @@
1714
1721
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1715
1722
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
1716
1723
  --button-danger-borderColor-rest: var(--control-borderColor-rest);
1724
+ --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
1717
1725
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1718
1726
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
1719
1727
  --button-default-borderColor-rest: var(--control-borderColor-rest);
1728
+ --button-default-fgColor-disabled: var(--control-fgColor-disabled);
1720
1729
  --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
1721
1730
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
1722
1731
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
1723
1732
  --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
1724
1733
  --button-primary-fgColor-rest: var(--fgColor-white);
1734
+ --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
1725
1735
  --button-primary-iconColor-rest: var(--fgColor-white);
1726
1736
  --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
1727
1737
  --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);
@@ -1771,10 +1781,10 @@
1771
1781
  --focus-outline: 2px solid #409eff; /** Focus ring outline for keyboard navigation and accessibility. */
1772
1782
  --page-header-bgColor: var(--bgColor-default);
1773
1783
  --progressBar-track-bgColor: var(--bgColor-inverse);
1774
- --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409; /** Large floating shadow for modals and dialogs */
1775
- --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
1776
- --shadow-floating-small: 0px 0px 0px 1px #b7bdc8, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
1777
- --shadow-floating-xlarge: 0px 0px 0px 1px #b7bdc8, 0px 32px 64px 0px #010409;
1784
+ --shadow-floating-large: 0 0 0 1px #b7bdc8, 0 24px 48px 0 #010409; /** Large floating shadow for modals and dialogs */
1785
+ --shadow-floating-medium: 0 0 0 1px #b7bdc8, 0 8px 16px -4px #01040966, 0 4px 32px -4px #01040966, 0 24px 48px -12px #01040966, 0 48px 96px -24px #01040966; /** Medium floating shadow for popovers and action menus */
1786
+ --shadow-floating-small: 0 0 0 1px #b7bdc8, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
1787
+ --shadow-floating-xlarge: 0 0 0 1px #b7bdc8, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
1778
1788
  --tooltip-bgColor: var(--bgColor-inverse);
1779
1789
  --tooltip-fgColor: var(--fgColor-onInverse);
1780
1790
  --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
@@ -1793,6 +1803,8 @@
1793
1803
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1794
1804
  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
1795
1805
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1806
+ --border-draft-emphasis: 0.0625rem solid #b7bdc8;
1807
+ --border-draft-muted: 0.0625rem solid #b7bdc8;
1796
1808
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1797
1809
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1798
1810
  }