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

package/dist/css/functional/themes/light-high-contrast.css

@@ -58,7 +58,7 @@
   --borderColor-sponsors-muted: #ed4baf; /** Subtle border for GitHub Sponsors content */
   --borderColor-success-emphasis: #055d20; /** Strong success border for prominent positive elements */
   --borderColor-success-muted: #26a148; /** Subtle success border for positive feedback elements */
-  --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements */
+  --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --borderColor-transparent: #ffffff00; /** Fully transparent border */
   --button-danger-bgColor-active: #86061d;
   --button-danger-borderColor-hover: #6e011a;
@@ -652,6 +652,7 @@
   --border-sponsors-muted: 0.0625rem solid #ed4baf;
   --border-success-emphasis: 0.0625rem solid #055d20;
   --border-success-muted: 0.0625rem solid #26a148;
+  --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --border-transparent: 0.0625rem solid #ffffff00;
   --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
   --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
@@ -818,6 +819,7 @@
   --avatar-borderColor: var(--borderColor-emphasis);
   --border-closed-emphasis: var(--border-danger-emphasis);
   --border-closed-muted: var(--border-danger-muted);
+  --border-draft-emphasis: 0.0625rem solid #59636e;
   --border-emphasis: 0.0625rem solid #454c54;
   --border-muted: 0.0625rem solid #454c54;
   --border-open-emphasis: var(--border-success-emphasis);
@@ -827,16 +829,19 @@
   --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
   --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
   --button-danger-borderColor-rest: var(--control-borderColor-rest);
+  --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
   --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
   --button-default-bgColor-disabled: var(--control-bgColor-disabled);
   --button-default-borderColor-active: var(--control-borderColor-rest);
   --button-default-borderColor-disabled: var(--control-borderColor-disabled);
   --button-default-borderColor-rest: var(--control-borderColor-rest);
+  --button-default-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
   --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
   --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
   --button-primary-fgColor-rest: var(--fgColor-white);
+  --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
   --button-primary-iconColor-rest: #ffffffcc;
   --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
   --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);
@@ -898,6 +903,7 @@
   --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
   --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
   --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+  --border-draft-muted: 0.0625rem solid #454c54;
 }
 @media (prefers-color-scheme: dark) {
   [data-color-mode][data-color-mode="auto"][data-dark-theme="light_high_contrast"] {
@@ -955,7 +961,7 @@
     --borderColor-sponsors-muted: #ed4baf; /** Subtle border for GitHub Sponsors content */
     --borderColor-success-emphasis: #055d20; /** Strong success border for prominent positive elements */
     --borderColor-success-muted: #26a148; /** Subtle success border for positive feedback elements */
-    --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements */
+    --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --borderColor-transparent: #ffffff00; /** Fully transparent border */
     --button-danger-bgColor-active: #86061d;
     --button-danger-borderColor-hover: #6e011a;
@@ -1549,6 +1555,7 @@
     --border-sponsors-muted: 0.0625rem solid #ed4baf;
     --border-success-emphasis: 0.0625rem solid #055d20;
     --border-success-muted: 0.0625rem solid #26a148;
+    --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --border-transparent: 0.0625rem solid #ffffff00;
     --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
     --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
@@ -1715,6 +1722,7 @@
     --avatar-borderColor: var(--borderColor-emphasis);
     --border-closed-emphasis: var(--border-danger-emphasis);
     --border-closed-muted: var(--border-danger-muted);
+    --border-draft-emphasis: 0.0625rem solid #59636e;
     --border-emphasis: 0.0625rem solid #454c54;
     --border-muted: 0.0625rem solid #454c54;
     --border-open-emphasis: var(--border-success-emphasis);
@@ -1724,16 +1732,19 @@
     --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
     --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
     --button-danger-borderColor-rest: var(--control-borderColor-rest);
+    --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
     --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
     --button-default-bgColor-disabled: var(--control-bgColor-disabled);
     --button-default-borderColor-active: var(--control-borderColor-rest);
     --button-default-borderColor-disabled: var(--control-borderColor-disabled);
     --button-default-borderColor-rest: var(--control-borderColor-rest);
+    --button-default-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
     --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
     --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
     --button-primary-fgColor-rest: var(--fgColor-white);
+    --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
     --button-primary-iconColor-rest: #ffffffcc;
     --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
     --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);
@@ -1795,5 +1806,6 @@
     --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
     --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
     --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+    --border-draft-muted: 0.0625rem solid #454c54;
   }
 }

package/dist/css/functional/themes/light-tritanopia-high-contrast.css

@@ -61,7 +61,7 @@
   --borderColor-sponsors-muted: #ed4baf; /** Subtle border for GitHub Sponsors content */
   --borderColor-success-emphasis: #0349b4; /** Strong success border for prominent positive elements */
   --borderColor-success-muted: #368cf9; /** Subtle success border for positive feedback elements */
-  --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements */
+  --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --borderColor-transparent: #ffffff00; /** Fully transparent border */
   --button-danger-bgColor-active: #86061d;
   --button-danger-borderColor-hover: #6e011a;
@@ -657,6 +657,7 @@
   --border-sponsors-muted: 0.0625rem solid #ed4baf;
   --border-success-emphasis: 0.0625rem solid #0349b4;
   --border-success-muted: 0.0625rem solid #368cf9;
+  --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --border-transparent: 0.0625rem solid #ffffff00;
   --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
   --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -818,6 +819,8 @@
   --avatar-borderColor: var(--borderColor-emphasis);
   --border-closed-emphasis: var(--border-danger-emphasis);
   --border-closed-muted: var(--border-danger-muted);
+  --border-draft-emphasis: 0.0625rem solid #59636e;
+  --border-draft-muted: 0.0625rem solid #454c54;
   --border-emphasis: 0.0625rem solid #454c54;
   --border-muted: 0.0625rem solid #454c54;
   --border-open-emphasis: var(--border-success-emphasis);
@@ -828,16 +831,19 @@
   --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
   --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
   --button-danger-borderColor-rest: var(--control-borderColor-rest);
+  --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
   --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
   --button-default-bgColor-disabled: var(--control-bgColor-disabled);
   --button-default-borderColor-active: var(--control-borderColor-rest);
   --button-default-borderColor-disabled: var(--control-borderColor-disabled);
   --button-default-borderColor-rest: var(--control-borderColor-rest);
+  --button-default-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
   --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
   --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
   --button-primary-fgColor-rest: var(--fgColor-white);
+  --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
   --button-primary-iconColor-rest: #ffffffcc;
   --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
   --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);
@@ -958,7 +964,7 @@
     --borderColor-sponsors-muted: #ed4baf; /** Subtle border for GitHub Sponsors content */
     --borderColor-success-emphasis: #0349b4; /** Strong success border for prominent positive elements */
     --borderColor-success-muted: #368cf9; /** Subtle success border for positive feedback elements */
-    --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements */
+    --borderColor-translucent: #59636e; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --borderColor-transparent: #ffffff00; /** Fully transparent border */
     --button-danger-bgColor-active: #86061d;
     --button-danger-borderColor-hover: #6e011a;
@@ -1554,6 +1560,7 @@
     --border-sponsors-muted: 0.0625rem solid #ed4baf;
     --border-success-emphasis: 0.0625rem solid #0349b4;
     --border-success-muted: 0.0625rem solid #368cf9;
+    --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --border-transparent: 0.0625rem solid #ffffff00;
     --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
     --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
@@ -1715,6 +1722,8 @@
     --avatar-borderColor: var(--borderColor-emphasis);
     --border-closed-emphasis: var(--border-danger-emphasis);
     --border-closed-muted: var(--border-danger-muted);
+    --border-draft-emphasis: 0.0625rem solid #59636e;
+    --border-draft-muted: 0.0625rem solid #454c54;
     --border-emphasis: 0.0625rem solid #454c54;
     --border-muted: 0.0625rem solid #454c54;
     --border-open-emphasis: var(--border-success-emphasis);
@@ -1725,16 +1734,19 @@
     --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
     --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
     --button-danger-borderColor-rest: var(--control-borderColor-rest);
+    --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
     --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
     --button-default-bgColor-disabled: var(--control-bgColor-disabled);
     --button-default-borderColor-active: var(--control-borderColor-rest);
     --button-default-borderColor-disabled: var(--control-borderColor-disabled);
     --button-default-borderColor-rest: var(--control-borderColor-rest);
+    --button-default-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
     --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
     --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
     --button-primary-fgColor-rest: var(--fgColor-white);
+    --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
     --button-primary-iconColor-rest: #ffffffcc;
     --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
     --buttonKeybindingHint-danger-fgColor-active: var(--fgColor-onEmphasis);

package/dist/css/functional/themes/light-tritanopia.css

@@ -685,13 +685,14 @@
   --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
   --borderColor-draft-muted: #d1d9e066; /** Subtle border for draft state indicators */
   --borderColor-muted: #d1d9e0b3; /** Subtle border for secondary elements and light separators */
-  --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements */
+  --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
   --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
   --button-danger-bgColor-hover: var(--bgColor-danger-emphasis);
   --button-danger-bgColor-rest: var(--control-bgColor-rest);
   --button-danger-fgColor-active: #ffffff;
   --button-danger-fgColor-hover: #ffffff;
+  --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
   --button-danger-iconColor-hover: #ffffff;
   --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
   --button-default-bgColor-active: var(--control-bgColor-active);
@@ -817,9 +818,12 @@
   --avatar-borderColor: var(--borderColor-translucent);
   --border-closed-emphasis: var(--border-danger-emphasis);
   --border-closed-muted: var(--border-danger-muted);
+  --border-draft-emphasis: 0.0625rem solid #59636e;
+  --border-draft-muted: 0.0625rem solid #d1d9e066;
   --border-muted: 0.0625rem solid #d1d9e0b3;
   --border-open-emphasis: var(--border-success-emphasis);
   --border-open-muted: var(--border-success-muted);
+  --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --border-upsell-emphasis: 0.0625rem solid #8250df;
   --border-upsell-muted: 0.0625rem solid #c297ff66;
   --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -829,11 +833,13 @@
   --button-default-borderColor-active: var(--control-borderColor-rest);
   --button-default-borderColor-disabled: var(--control-borderColor-disabled);
   --button-default-borderColor-rest: var(--control-borderColor-rest);
+  --button-default-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
   --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
   --button-primary-borderColor-rest: var(--borderColor-translucent);
   --button-primary-fgColor-rest: var(--fgColor-white);
+  --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
   --button-primary-iconColor-rest: #ffffffcc;
   --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
   --buttonKeybindingHint-danger-borderColor-hover: var(--borderColor-translucent);
@@ -891,10 +897,10 @@
   --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
   --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
   --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
-  --shadow-floating-large: 0 0 0 1px #d1d9e0, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
-  --shadow-floating-medium: 0 0 0 1px #d1d9e0, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
+  --shadow-floating-large: 0 0 0 1px #d1d9e000, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
+  --shadow-floating-medium: 0 0 0 1px #d1d9e000, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
   --shadow-floating-small: 0 0 0 1px #d1d9e080, 0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f; /** Small floating shadow for dropdowns, tooltips, and small overlays */
-  --shadow-floating-xlarge: 0 0 0 1px #d1d9e0, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+  --shadow-floating-xlarge: 0 0 0 1px #d1d9e000, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
   --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
   --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
   --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
@@ -1582,13 +1588,14 @@
     --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
     --borderColor-draft-muted: #d1d9e066; /** Subtle border for draft state indicators */
     --borderColor-muted: #d1d9e0b3; /** Subtle border for secondary elements and light separators */
-    --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements */
+    --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
     --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
     --button-danger-bgColor-hover: var(--bgColor-danger-emphasis);
     --button-danger-bgColor-rest: var(--control-bgColor-rest);
     --button-danger-fgColor-active: #ffffff;
     --button-danger-fgColor-hover: #ffffff;
+    --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
     --button-danger-iconColor-hover: #ffffff;
     --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
     --button-default-bgColor-active: var(--control-bgColor-active);
@@ -1714,9 +1721,12 @@
     --avatar-borderColor: var(--borderColor-translucent);
     --border-closed-emphasis: var(--border-danger-emphasis);
     --border-closed-muted: var(--border-danger-muted);
+    --border-draft-emphasis: 0.0625rem solid #59636e;
+    --border-draft-muted: 0.0625rem solid #d1d9e066;
     --border-muted: 0.0625rem solid #d1d9e0b3;
     --border-open-emphasis: var(--border-success-emphasis);
     --border-open-muted: var(--border-success-muted);
+    --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --border-upsell-emphasis: 0.0625rem solid #8250df;
     --border-upsell-muted: 0.0625rem solid #c297ff66;
     --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -1726,11 +1736,13 @@
     --button-default-borderColor-active: var(--control-borderColor-rest);
     --button-default-borderColor-disabled: var(--control-borderColor-disabled);
     --button-default-borderColor-rest: var(--control-borderColor-rest);
+    --button-default-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
     --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
     --button-primary-borderColor-rest: var(--borderColor-translucent);
     --button-primary-fgColor-rest: var(--fgColor-white);
+    --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
     --button-primary-iconColor-rest: #ffffffcc;
     --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
     --buttonKeybindingHint-danger-borderColor-hover: var(--borderColor-translucent);
@@ -1788,10 +1800,10 @@
     --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
     --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
     --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
-    --shadow-floating-large: 0 0 0 1px #d1d9e0, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
-    --shadow-floating-medium: 0 0 0 1px #d1d9e0, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
+    --shadow-floating-large: 0 0 0 1px #d1d9e000, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
+    --shadow-floating-medium: 0 0 0 1px #d1d9e000, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
     --shadow-floating-small: 0 0 0 1px #d1d9e080, 0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f; /** Small floating shadow for dropdowns, tooltips, and small overlays */
-    --shadow-floating-xlarge: 0 0 0 1px #d1d9e0, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+    --shadow-floating-xlarge: 0 0 0 1px #d1d9e000, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
     --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
     --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
     --button-outline-borderColor-active: var(--button-outline-borderColor-hover);

package/dist/css/functional/themes/light.css

@@ -684,13 +684,14 @@
   --borderColor-muted: #d1d9e0b3; /** Subtle border for secondary elements and light separators */
   --borderColor-open-emphasis: var(--borderColor-success-emphasis); /** Strong border for open state badges */
   --borderColor-open-muted: var(--borderColor-success-muted); /** Subtle border for open state indicators */
-  --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements */
+  --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
   --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
   --button-danger-bgColor-hover: var(--bgColor-danger-emphasis);
   --button-danger-bgColor-rest: var(--control-bgColor-rest);
   --button-danger-fgColor-active: #ffffff;
   --button-danger-fgColor-hover: #ffffff;
+  --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
   --button-danger-iconColor-hover: #ffffff;
   --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
   --button-default-bgColor-active: var(--control-bgColor-active);
@@ -816,9 +817,11 @@
   --avatar-borderColor: var(--borderColor-translucent);
   --border-closed-emphasis: var(--border-danger-emphasis);
   --border-closed-muted: var(--border-danger-muted);
+  --border-draft-emphasis: 0.0625rem solid #59636e;
   --border-muted: 0.0625rem solid #d1d9e0b3;
   --border-open-emphasis: var(--border-success-emphasis);
   --border-open-muted: var(--border-success-muted);
+  --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
   --border-upsell-emphasis: 0.0625rem solid #8250df;
   --border-upsell-muted: 0.0625rem solid #c297ff66;
   --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -828,11 +831,13 @@
   --button-default-borderColor-active: var(--control-borderColor-rest);
   --button-default-borderColor-disabled: var(--control-borderColor-disabled);
   --button-default-borderColor-rest: var(--control-borderColor-rest);
+  --button-default-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
   --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
   --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
   --button-primary-borderColor-rest: var(--borderColor-translucent);
   --button-primary-fgColor-rest: var(--fgColor-white);
+  --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
   --button-primary-iconColor-rest: #ffffffcc;
   --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
   --buttonKeybindingHint-danger-borderColor-hover: var(--borderColor-translucent);
@@ -891,10 +896,11 @@
   --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
   --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
   --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
-  --shadow-floating-large: 0 0 0 1px #d1d9e0, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
-  --shadow-floating-medium: 0 0 0 1px #d1d9e0, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
+  --shadow-floating-large: 0 0 0 1px #d1d9e000, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
+  --shadow-floating-medium: 0 0 0 1px #d1d9e000, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
   --shadow-floating-small: 0 0 0 1px #d1d9e080, 0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f; /** Small floating shadow for dropdowns, tooltips, and small overlays */
-  --shadow-floating-xlarge: 0 0 0 1px #d1d9e0, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+  --shadow-floating-xlarge: 0 0 0 1px #d1d9e000, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+  --border-draft-muted: 0.0625rem solid #d1d9e0b3;
   --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
   --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
   --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
@@ -1581,13 +1587,14 @@
     --borderColor-muted: #d1d9e0b3; /** Subtle border for secondary elements and light separators */
     --borderColor-open-emphasis: var(--borderColor-success-emphasis); /** Strong border for open state badges */
     --borderColor-open-muted: var(--borderColor-success-muted); /** Subtle border for open state indicators */
-    --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements */
+    --borderColor-translucent: #1f232826; /** Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --borderColor-upsell-emphasis: var(--borderColor-done-emphasis); /** Strong border for prominent upsell elements */
     --borderColor-upsell-muted: var(--borderColor-done-muted); /** Subtle border for upsell and promotional content */
     --button-danger-bgColor-hover: var(--bgColor-danger-emphasis);
     --button-danger-bgColor-rest: var(--control-bgColor-rest);
     --button-danger-fgColor-active: #ffffff;
     --button-danger-fgColor-hover: #ffffff;
+    --button-danger-iconColor-disabled: var(--button-danger-fgColor-disabled);
     --button-danger-iconColor-hover: #ffffff;
     --button-danger-iconColor-rest: var(--button-danger-fgColor-rest);
     --button-default-bgColor-active: var(--control-bgColor-active);
@@ -1713,9 +1720,11 @@
     --avatar-borderColor: var(--borderColor-translucent);
     --border-closed-emphasis: var(--border-danger-emphasis);
     --border-closed-muted: var(--border-danger-muted);
+    --border-draft-emphasis: 0.0625rem solid #59636e;
     --border-muted: 0.0625rem solid #d1d9e0b3;
     --border-open-emphasis: var(--border-success-emphasis);
     --border-open-muted: var(--border-success-muted);
+    --border-translucent: 0.0625rem solid #1f232826; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
     --border-upsell-emphasis: 0.0625rem solid #8250df;
     --border-upsell-muted: 0.0625rem solid #c297ff66;
     --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
@@ -1725,11 +1734,13 @@
     --button-default-borderColor-active: var(--control-borderColor-rest);
     --button-default-borderColor-disabled: var(--control-borderColor-disabled);
     --button-default-borderColor-rest: var(--control-borderColor-rest);
+    --button-default-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
     --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
     --button-outline-bgColor-disabled: var(--control-bgColor-disabled);
     --button-primary-borderColor-rest: var(--borderColor-translucent);
     --button-primary-fgColor-rest: var(--fgColor-white);
+    --button-primary-iconColor-disabled: var(--button-primary-fgColor-disabled);
     --button-primary-iconColor-rest: #ffffffcc;
     --buttonKeybindingHint-danger-bgColor-disabled: var(--buttonKeybindingHint-default-bgColor-disabled);
     --buttonKeybindingHint-danger-borderColor-hover: var(--borderColor-translucent);
@@ -1788,10 +1799,11 @@
     --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
     --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
     --buttonKeybindingHint-danger-fgColor-disabled: var(--buttonKeybindingHint-default-fgColor-disabled);
-    --shadow-floating-large: 0 0 0 1px #d1d9e0, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
-    --shadow-floating-medium: 0 0 0 1px #d1d9e0, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
+    --shadow-floating-large: 0 0 0 1px #d1d9e000, 0 40px 80px 0 #25292e3d; /** Large floating shadow for modals and dialogs */
+    --shadow-floating-medium: 0 0 0 1px #d1d9e000, 0 8px 16px -4px #25292e14, 0 4px 32px -4px #25292e14, 0 24px 48px -12px #25292e14, 0 48px 96px -24px #25292e14; /** Medium floating shadow for popovers and action menus */
     --shadow-floating-small: 0 0 0 1px #d1d9e080, 0 6px 12px -3px #25292e0a, 0 6px 18px 0 #25292e1f; /** Small floating shadow for dropdowns, tooltips, and small overlays */
-    --shadow-floating-xlarge: 0 0 0 1px #d1d9e0, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+    --shadow-floating-xlarge: 0 0 0 1px #d1d9e000, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
+    --border-draft-muted: 0.0625rem solid #d1d9e0b3;
     --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
     --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
     --button-outline-borderColor-active: var(--button-outline-borderColor-hover);

package/dist/docs/functional/size/radius.json

@@ -102,7 +102,7 @@
         "value": 12,
         "unit": "px"
       },
-      "$description": "Large border radius (12px). Use for larger containers, dialogs, or when more visual softness is desired. Always use this for buttons.",
+      "$description": "Large border radius (12px). Use for larger containers, dialogs, or when more visual softness is desired.",
       "$type": "dimension",
       "$extensions": {
         "org.primer.figma": {
@@ -124,7 +124,7 @@
     "path": ["borderRadius", "large"],
     "value": "0.75rem",
     "type": "dimension",
-    "description": "Large border radius (12px). Use for larger containers, dialogs, or when more visual softness is desired. Always use this for buttons."
+    "description": "Large border radius (12px). Use for larger containers, dialogs, or when more visual softness is desired."
   },
   "borderRadius-medium": {
     "key": "{borderRadius.medium}",

package/dist/docs/functional/size/size-coarse.json

@@ -28,9 +28,50 @@
     "type": "dimension",
     "description": "Minimum touch target size for coarse pointer devices (touch screens)"
   },
+  "controlStack-large-gap-auto": {
+    "key": "{controlStack.large.gap.auto}",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
+      "org.primer.llm": {
+        "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
+        "rules": "Use for spacing between interactive controls on touch devices in large layouts. Provides adequate touch separation. Do NOT use for desktop/mouse interfaces."
+      }
+    },
+    "filePath": "src/tokens/functional/size/size-coarse.json5",
+    "isSource": true,
+    "original": {
+      "$value": "{base.size.12}",
+      "$type": "dimension",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
+        "org.primer.llm": {
+          "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
+          "rules": "Use for spacing between interactive controls on touch devices in large layouts. Provides adequate touch separation. Do NOT use for desktop/mouse interfaces."
+        }
+      },
+      "$description": "Gap between stacked controls in large density layouts for touch devices",
+      "key": "{controlStack.large.gap.auto}"
+    },
+    "name": "controlStack-large-gap-auto",
+    "attributes": {},
+    "path": ["controlStack", "large", "gap", "auto"],
+    "value": "0.75rem",
+    "type": "dimension",
+    "description": "Gap between stacked controls in large density layouts for touch devices"
+  },
   "controlStack-medium-gap-auto": {
     "key": "{controlStack.medium.gap.auto}",
     "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
       "org.primer.llm": {
         "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
         "rules": "Use for spacing between interactive controls on touch devices in standard layouts. Do NOT use for desktop/mouse interfaces."
@@ -41,13 +82,17 @@
     "original": {
       "$value": "{base.size.12}",
       "$type": "dimension",
-      "$description": "Gap between stacked controls in medium density layouts for touch devices",
       "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
         "org.primer.llm": {
           "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
           "rules": "Use for spacing between interactive controls on touch devices in standard layouts. Do NOT use for desktop/mouse interfaces."
         }
       },
+      "$description": "Gap between stacked controls in medium density layouts for touch devices",
       "key": "{controlStack.medium.gap.auto}"
     },
     "name": "controlStack-medium-gap-auto",
@@ -60,6 +105,10 @@
   "controlStack-small-gap-auto": {
     "key": "{controlStack.small.gap.auto}",
     "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
       "org.primer.llm": {
         "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
         "rules": "Use for spacing between interactive controls on touch devices in compact layouts. Provides adequate touch separation. Do NOT use for desktop/mouse interfaces."
@@ -70,13 +119,17 @@
     "original": {
       "$value": "{base.size.16}",
       "$type": "dimension",
-      "$description": "Gap between stacked controls in small density layouts for touch devices",
       "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
         "org.primer.llm": {
           "usage": ["touch-control-spacing", "mobile-form-gap", "stacked-buttons"],
           "rules": "Use for spacing between interactive controls on touch devices in compact layouts. Provides adequate touch separation. Do NOT use for desktop/mouse interfaces."
         }
       },
+      "$description": "Gap between stacked controls in small density layouts for touch devices",
       "key": "{controlStack.small.gap.auto}"
     },
     "name": "controlStack-small-gap-auto",

package/dist/docs/functional/size/size-fine.json

@@ -28,9 +28,50 @@
     "type": "dimension",
     "description": "Minimum target size for fine pointer devices (mouse)"
   },
+  "controlStack-large-gap-auto": {
+    "key": "{controlStack.large.gap.auto}",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
+      "org.primer.llm": {
+        "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
+        "rules": "Use for spacing between interactive controls on desktop in large layouts. Do NOT use for mobile/touch interfaces."
+      }
+    },
+    "filePath": "src/tokens/functional/size/size-fine.json5",
+    "isSource": true,
+    "original": {
+      "$value": "{base.size.8}",
+      "$type": "dimension",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
+        "org.primer.llm": {
+          "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
+          "rules": "Use for spacing between interactive controls on desktop in large layouts. Do NOT use for mobile/touch interfaces."
+        }
+      },
+      "$description": "Gap between stacked controls in large density layouts for mouse interfaces",
+      "key": "{controlStack.large.gap.auto}"
+    },
+    "name": "controlStack-large-gap-auto",
+    "attributes": {},
+    "path": ["controlStack", "large", "gap", "auto"],
+    "value": "0.5rem",
+    "type": "dimension",
+    "description": "Gap between stacked controls in large density layouts for mouse interfaces"
+  },
   "controlStack-medium-gap-auto": {
     "key": "{controlStack.medium.gap.auto}",
     "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
       "org.primer.llm": {
         "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
         "rules": "Use for spacing between interactive controls on desktop in standard layouts. Do NOT use for mobile/touch interfaces."
@@ -41,13 +82,17 @@
     "original": {
       "$value": "{base.size.8}",
       "$type": "dimension",
-      "$description": "Gap between stacked controls in medium density layouts for mouse interfaces",
       "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
         "org.primer.llm": {
           "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
           "rules": "Use for spacing between interactive controls on desktop in standard layouts. Do NOT use for mobile/touch interfaces."
         }
       },
+      "$description": "Gap between stacked controls in medium density layouts for mouse interfaces",
       "key": "{controlStack.medium.gap.auto}"
     },
     "name": "controlStack-medium-gap-auto",
@@ -60,6 +105,10 @@
   "controlStack-small-gap-auto": {
     "key": "{controlStack.small.gap.auto}",
     "$extensions": {
+      "org.primer.figma": {
+        "collection": "pattern/size",
+        "scopes": ["gap"]
+      },
       "org.primer.llm": {
         "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
         "rules": "Use for spacing between interactive controls on desktop in compact layouts. Tighter spacing than touch devices. Do NOT use for mobile/touch interfaces."
@@ -70,13 +119,17 @@
     "original": {
       "$value": "{base.size.8}",
       "$type": "dimension",
-      "$description": "Gap between stacked controls in small density layouts for mouse interfaces",
       "$extensions": {
+        "org.primer.figma": {
+          "collection": "pattern/size",
+          "scopes": ["gap"]
+        },
         "org.primer.llm": {
           "usage": ["desktop-control-spacing", "form-gap", "stacked-buttons"],
           "rules": "Use for spacing between interactive controls on desktop in compact layouts. Tighter spacing than touch devices. Do NOT use for mobile/touch interfaces."
         }
       },
+      "$description": "Gap between stacked controls in small density layouts for mouse interfaces",
       "key": "{controlStack.small.gap.auto}"
     },
     "name": "controlStack-small-gap-auto",