@fairgarden/design 0.1.0-alpha.1 → 0.1.0-alpha.2

package/disclosure/accordion/accordion.module.css

@@ -2,7 +2,7 @@
  * Accordion (§10.13). Parts: `base` (the Base UI Root), `item` (its top rule;
  * the last item also closes with one), `header` (the heading), `trigger`
  * (the row), `icon` (optional leading subject symbol), `title`, `glyph`
- * (the LTA disclosure glyph, whose direction and color the Collapsible
+ * (the disclosure glyph, whose direction and color the Collapsible
  * module draws, or the plus/minus `circle`), `panel` and its padded inner
  * `content`. Pure type and line: no fill in any state. Colors are role
  * variables only; local custom properties carry dimensions only.
@@ -45,14 +45,14 @@
     margin: 0;
   }
 
-  /* The row: ≥ --ds-size-control-xl tall, --size-px-3 vertical padding, text aligned to the column. */
+  /* The row: ≥ --fgd-size-control-xl tall, --size-px-3 vertical padding, text aligned to the column. */
   .trigger {
     display: flex;
     align-items: flex-start;
     gap: var(--size-px-3);
     box-sizing: border-box;
     inline-size: 100%;
-    min-block-size: var(--ds-size-control-xl);
+    min-block-size: var(--fgd-size-control-xl);
     margin: 0;
     padding-block: var(--size-px-3);
     padding-inline: 0;
@@ -96,7 +96,7 @@
     color: var(--primary12);
   }
 
-  /* A leading icon indents the panel to the title column (Sofar Sounds). */
+  /* A leading icon indents the panel to the title column. */
   .item:has(.icon) .content {
     padding-inline-start: calc(var(--size-px-4) + var(--size-px-3));
   }
@@ -104,15 +104,15 @@
   @media (prefers-reduced-motion: no-preference) {
     .panel {
       transition-property: block-size;
-      transition-duration: var(--ds-duration-disclosure);
+      transition-duration: var(--fgd-duration-disclosure);
       transition-timing-function: var(--ease-out-3);
     }
 
-    /* Hover transitions [D181]: --ds-duration-quick, --ease-out-3. */
+    /* Hover transitions [D181]: --fgd-duration-quick, --ease-out-3; the circle's weight steps [D205]. */
     .title,
     .circle {
-      transition-property: text-decoration-color, border-width;
-      transition-duration: var(--ds-duration-quick);
+      transition-property: text-decoration-color;
+      transition-duration: var(--fgd-duration-quick);
       transition-timing-function: var(--ease-out-3);
     }
   }
@@ -130,20 +130,20 @@
 }
 
 @layer variants {
-  /* Disclosure (default): the 20 px LTA glyph, centred on the title's first line [D109]. */
+  /* Disclosure (default): the 20 px disclosure glyph, centred on the title's first line [D109]. */
   .disclosure .glyph {
     margin-block: calc((1lh - var(--size-px-4)) / 2);
   }
 
-  /* Strong top: a --border-size-2 --primary12 rule above the first item (turbopuffer). */
+  /* Strong top: a --border-size-2 --primary12 rule above the first item. */
   .headed .item:first-child {
     border-block-start-width: var(--border-size-2);
     border-block-start-color: var(--primary12);
   }
 
-  /* Plus / minus: a --size-px-5 outline circle at --ds-stroke-1-5, outline in both states. */
+  /* Plus / minus: a --size-px-5 outline circle at --border-size-1-5, outline in both states. */
   .plusminus .circle {
-    --accordion-circle-edge: var(--ds-stroke-1-5);
+    --accordion-circle-edge: var(--border-size-1-5);
 
     display: inline-flex;
     align-items: center;

package/disclosure/collapsible/Collapsible.d.ts

@@ -21,14 +21,14 @@ export declare const disclosureGlyphHost: string;
 /** Props for DisclosureGlyph: SVG props (without `children`) and the tier. */
 export type DisclosureGlyphProps = Omit<React.ComponentPropsWithRef<'svg'>, 'children'> & {
     /**
-     * `row` (default): `--size-px-4` (20 px) at `--ds-stroke-1-5`, for trigger
+     * `row` (default): `--size-px-4` (20 px) at `--border-size-1-5`, for trigger
      * rows (Accordion, FAQ). `chrome`: `--size-px-3` (16 px) at
-     * `--ds-stroke-1-25`, for bars, drawer groups and an inline "Show more".
+     * `--border-size-1-25`, for bars, drawer groups and an inline "Show more".
      */
     size?: VariantProps<typeof disclosureGlyph>['size'];
 };
 /**
- * LTA's expand/collapse glyph [D109]: two thin arrows pointing outward from
+ * The expand/collapse glyph [D109]: two thin arrows pointing outward from
  * a short center hairline when collapsed, inward when expanded (§6.10). It
  * reads the state from the nearest Base UI trigger's `data-panel-open`, so
  * place it inside an Accordion or Collapsible trigger. The direction swaps
@@ -72,7 +72,7 @@ export type CollapsiblePanelProps = BaseCollapsible.Panel.Props;
 /**
  * The panel. It stays in the DOM while closed (`hiddenUntilFound`, default
  * `true`), so find-in-page reaches it and print shows it expanded. It opens
- * with a clip reveal at `--ds-duration-disclosure`, instant under reduced
+ * with a clip reveal at `--fgd-duration-disclosure`, instant under reduced
  * motion.
  */
 export declare function CollapsiblePanel(props: CollapsiblePanelProps): React.JSX.Element;

package/disclosure/collapsible/Collapsible.js

@@ -20,12 +20,12 @@ import styles from './collapsible.module.css';
  *   --border-size-2, offset --size-px-1), the glyph unchanged [D109, D181];
  *   `:focus-visible` → ring;
  *   `data-disabled` → label and glyph --role-muted. Panel `data-starting-style`
- *   / `data-ending-style` → the clip reveal at --ds-duration-disclosure,
+ *   / `data-ending-style` → the clip reveal at --fgd-duration-disclosure,
  *   instant under --motionNotOK, never opacity [D91].
  * - Parts: base, trigger, glyph, label, panel (+ `content`, the padded inner box).
  * - Scope: none. Container: none; inherits its context.
  *
- * The disclosure glyph (DisclosureGlyph) is the custom LTA glyph, the one
+ * The disclosure glyph (DisclosureGlyph) is a custom glyph, the one
  * indicator for anything that expands in place [D109]; it is a §1.5.12 /
  * §6.10 exception to Material Symbols and is never `expand_more`.
  */
@@ -57,7 +57,7 @@ export const disclosureGlyph = cva(styles.glyph, {
  */
 export const disclosureGlyphHost = styles.glyphHost;
 /**
- * LTA's expand/collapse glyph [D109]: two thin arrows pointing outward from
+ * The expand/collapse glyph [D109]: two thin arrows pointing outward from
  * a short center hairline when collapsed, inward when expanded (§6.10). It
  * reads the state from the nearest Base UI trigger's `data-panel-open`, so
  * place it inside an Accordion or Collapsible trigger. The direction swaps
@@ -101,7 +101,7 @@ export function CollapsibleTrigger(props) {
 /**
  * The panel. It stays in the DOM while closed (`hiddenUntilFound`, default
  * `true`), so find-in-page reaches it and print shows it expanded. It opens
- * with a clip reveal at `--ds-duration-disclosure`, instant under reduced
+ * with a clip reveal at `--fgd-duration-disclosure`, instant under reduced
  * motion.
  */
 export function CollapsiblePanel(props) {

package/disclosure/collapsible/collapsible.module.css

@@ -1,5 +1,5 @@
 /*
- * Collapsible (§10.13) and the LTA disclosure glyph [D109]. Parts: `base`
+ * Collapsible (§10.13) and the disclosure glyph [D109]. Parts: `base`
  * (the root), `trigger`, `glyph` (the shared disclosure glyph, drawn as
  * inline SVG: `glyphOut` collapsed, `glyphIn` expanded), `label`, `panel`
  * and its padded inner `content`. Pure type and line, so it resolves on any
@@ -53,13 +53,13 @@
     }
   }
 
-  /* The whole trigger is the target, at least --ds-size-hit tall (§9.1). */
+  /* The whole trigger is the target, at least --fgd-size-hit tall (§9.1). */
   .trigger {
     display: inline-flex;
     align-items: center;
     gap: var(--size-px-2);
     box-sizing: border-box;
-    min-block-size: var(--ds-size-hit);
+    min-block-size: var(--fgd-size-hit);
     margin: 0;
     padding: 0;
     border: 0;
@@ -95,15 +95,15 @@
   @media (prefers-reduced-motion: no-preference) {
     .panel {
       transition-property: block-size;
-      transition-duration: var(--ds-duration-disclosure);
+      transition-duration: var(--fgd-duration-disclosure);
       transition-timing-function: var(--ease-out-3);
     }
 
-    /* Hover transitions [D181]: --ds-duration-quick, --ease-out-3. */
+    /* Hover transitions [D181]: --fgd-duration-quick, --ease-out-3; the glyph's weight steps [D205]. */
     .label,
     .glyph {
-      transition-property: text-decoration-color, stroke-width;
-      transition-duration: var(--ds-duration-quick);
+      transition-property: text-decoration-color;
+      transition-duration: var(--fgd-duration-quick);
       transition-timing-function: var(--ease-out-3);
     }
   }
@@ -116,14 +116,14 @@
    */
   .glyphRow {
     --glyph-size: var(--size-px-4);
-    --glyph-stroke: var(--ds-stroke-1-5);
+    --glyph-stroke: var(--border-size-1-5);
     --glyph-stroke-emphasis: var(--border-size-2);
   }
 
   .glyphChrome {
     --glyph-size: var(--size-px-3);
-    --glyph-stroke: var(--ds-stroke-1-25);
-    --glyph-stroke-emphasis: var(--ds-stroke-1-5);
+    --glyph-stroke: var(--border-size-1-25);
+    --glyph-stroke-emphasis: var(--border-size-1-5);
   }
 }
 

package/disclosure/faq/FAQ.d.ts

@@ -20,7 +20,7 @@ export type FAQProps = useRender.ComponentProps<'section'> & {
      */
     kind?: FAQVariants['kind'];
     /**
-     * Shows a `--ds-stroke-3` `--primary12` bar at the start of each open
+     * Shows a `--border-size-2-25` `--primary12` bar at the start of each open
      * item's row: a bolder line, never a fill. Default `false`.
      */
     barred?: FAQVariants['barred'];
@@ -52,7 +52,7 @@ export type FAQTitleProps = useRender.ComponentProps<'h2'>;
 export declare function FAQTitle(props: FAQTitleProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 /** Props for FAQIntro: paragraph props and `render`. */
 export type FAQIntroProps = useRender.ComponentProps<'p'>;
-/** An optional lede under the title, within `--ds-measure-reading`. */
+/** An optional lede under the title, within `--fgd-measure-reading`. */
 export declare function FAQIntro(props: FAQIntroProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 /** Props for FAQContact: paragraph props and `render`. */
 export type FAQContactProps = useRender.ComponentProps<'p'>;
@@ -82,7 +82,7 @@ export type FAQItemProps = Omit<BaseAccordion.Item.Props, 'disabled' | 'title'>
 /**
  * One question and its answer. The question is an `h3` wrapping the trigger;
  * the disclosure glyph trails it, top-aligned to its first line. The answer
- * is `type-body`, within `--ds-measure-reading`. FAQ items are never
+ * is `type-body`, within `--fgd-measure-reading`. FAQ items are never
  * disabled.
  */
 export declare function FAQItem(props: FAQItemProps): React.JSX.Element;

package/disclosure/faq/FAQ.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FAQ.d.ts","sourceRoot":"","sources":["../../src/disclosure/faq/FAQ.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,SAAS,IAAI,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAgC5D,eAAO,MAAM,GAAG;;;;;8EAkBd,CAAA;AAEF,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,GAAG,CAAC,CAAA;AAE3C,kFAAkF;AAClF,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG;IAC3D;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAA;CACrC,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,KAAK,EAAE,QAAQ,0EAelC;AAED,wDAAwD;AACxD,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;AAE/D,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,0EAQ9C;AAED,uEAAuE;AACvE,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA;AAE1D,uEAAuE;AACvE,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,0EAQ5C;AAED,wDAAwD;AACxD,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,CAAA;AAEzD,uEAAuE;AACvE,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,0EAQ5C;AAED,0DAA0D;AAC1D,MAAM,MAAM,eAAe,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,CAAA;AAE3D,uFAAuF;AACvF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,0EAQhD;AAED,uDAAuD;AACvD,MAAM,MAAM,YAAY,CAAC,KAAK,GAAG,OAAO,IAAI,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;AAE3E;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,KAAK,GAAG,OAAO,EAAE,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,qBAUlE;AAED,8FAA8F;AAC9F,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IAChF,sEAAsE;IACtE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yDAAyD;IACzD,UAAU,CAAC,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA;CACzD,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,qBAwB1C"}
+{"version":3,"file":"FAQ.d.ts","sourceRoot":"","sources":["../../src/disclosure/faq/FAQ.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,SAAS,IAAI,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAgC5D,eAAO,MAAM,GAAG;;;;;8EAkBd,CAAA;AAEF,KAAK,WAAW,GAAG,YAAY,CAAC,OAAO,GAAG,CAAC,CAAA;AAE3C,kFAAkF;AAClF,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG;IAC3D;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAA;CACrC,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,KAAK,EAAE,QAAQ,0EAelC;AAED,wDAAwD;AACxD,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;AAE/D,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,0EAQ9C;AAED,uEAAuE;AACvE,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA;AAE1D,uEAAuE;AACvE,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,0EAQ5C;AAED,wDAAwD;AACxD,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,CAAA;AAEzD,wEAAwE;AACxE,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,0EAQ5C;AAED,0DAA0D;AAC1D,MAAM,MAAM,eAAe,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG,CAAC,CAAA;AAE3D,uFAAuF;AACvF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,0EAQhD;AAED,uDAAuD;AACvD,MAAM,MAAM,YAAY,CAAC,KAAK,GAAG,OAAO,IAAI,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;AAE3E;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,KAAK,GAAG,OAAO,EAAE,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,qBAUlE;AAED,8FAA8F;AAC9F,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IAChF,sEAAsE;IACtE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yDAAyD;IACzD,UAAU,CAAC,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA;CACzD,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,qBAwB1C"}

package/disclosure/faq/FAQ.js

@@ -12,7 +12,7 @@ import { useScopeAttributes } from '../../utils/scope';
 import styles from './faq.module.css';
 /*
  * FAQ (§12.5): 4–15 independent question-and-answer pairs that readers scan.
- * Built on the Base UI Accordion in the §10.13 Ruled form (LTA disclosure
+ * Built on the Base UI Accordion in the §10.13 Ruled form (disclosure
  * glyph) with the Strong top rule; motion follows §10.13.
  *
  * Implementation (CSS Modules + CVA)
@@ -94,7 +94,7 @@ export function FAQTitle(props) {
         props: mergeProps({ className: cx(styles.title, className) }, rest),
     });
 }
-/** An optional lede under the title, within `--ds-measure-reading`. */
+/** An optional lede under the title, within `--fgd-measure-reading`. */
 export function FAQIntro(props) {
     const { render, ref, className, ...rest } = props;
     return useRender({
@@ -127,7 +127,7 @@ export function FAQList(props) {
 /**
  * One question and its answer. The question is an `h3` wrapping the trigger;
  * the disclosure glyph trails it, top-aligned to its first line. The answer
- * is `type-body`, within `--ds-measure-reading`. FAQ items are never
+ * is `type-body`, within `--fgd-measure-reading`. FAQ items are never
  * disabled.
  */
 export function FAQItem(props) {

package/disclosure/faq/FAQ.js.map

@@ -1 +1 @@
-{"version":3,"file":"FAQ.js","sourceRoot":"","sources":["../../src/disclosure/faq/FAQ.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FAQ.js","sourceRoot":"","sources":["../../src/disclosure/faq/FAQ.tsx"],"names":[],"mappings":"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"}

package/disclosure/faq/faq.module.css

@@ -2,7 +2,7 @@
  * FAQ (§12.5): the §10.13 Ruled accordion with the Strong top rule, set as a
  * content module. Parts: `base` (the section), `header`, `title`, `intro`,
  * `list` (Accordion Root), `item`, `heading` (the h3), `trigger` (the row),
- * `icon` (keyed only), `question`, `glyph` (the LTA disclosure glyph, drawn
+ * `icon` (keyed only), `question`, `glyph` (the disclosure glyph, drawn
  * by the Collapsible module), `openBar`, `panel`, `answer`, `contact`.
  * Dense module: line semantics only, never a fill on the open item. Colors
  * are role variables only; local custom properties carry dimensions only.
@@ -44,11 +44,11 @@
     color: var(--primary12);
   }
 
-  /* Chapter stack (§3.5 Recipe A): H2, then --ds-space-stack to the first rule. */
+  /* Chapter stack (§3.5 Recipe A): H2, then --fgd-space-stack to the first rule. */
   .header {
     display: grid;
     gap: var(--size-px-5);
-    margin-block-end: var(--ds-space-stack);
+    margin-block-end: var(--fgd-space-stack);
   }
 
   /* Section head in --role-heading; the item heads below are --primary12 [D60]. */
@@ -59,7 +59,7 @@
 
   .intro {
     margin: 0;
-    max-inline-size: var(--ds-measure-reading);
+    max-inline-size: var(--fgd-measure-reading);
     color: var(--primary12);
   }
 
@@ -87,7 +87,7 @@
     margin: 0;
   }
 
-  /* The row: ≥ --ds-size-control-xl tall, --size-px-3 vertical padding. */
+  /* The row: ≥ --fgd-size-control-xl tall, --size-px-3 vertical padding. */
   .trigger {
     position: relative;
     display: flex;
@@ -95,7 +95,7 @@
     gap: var(--size-px-3);
     box-sizing: border-box;
     inline-size: 100%;
-    min-block-size: var(--ds-size-control-xl);
+    min-block-size: var(--fgd-size-control-xl);
     margin: 0;
     padding-block: var(--size-px-3);
     padding-inline: var(--faq-bar-inset) 0;
@@ -123,13 +123,13 @@
     margin-block: calc((1lh - var(--size-px-4)) / 2);
   }
 
-  /* The optional open bar: a --ds-stroke-3 line at the row's start edge, shown under `barred`. */
+  /* The optional open bar: a --border-size-2-25 line at the row's start edge, shown under `barred`. */
   .openBar {
     display: none;
     position: absolute;
     inset-block: 0;
     inset-inline-start: 0;
-    border-inline-start: var(--ds-stroke-3) solid var(--primary12);
+    border-inline-start: var(--border-size-2-25) solid var(--primary12);
   }
 
   /* The §10.13 clip reveal [D91]: the panel's edge wipes open; never a fade. */
@@ -139,9 +139,9 @@
     overflow: clip;
   }
 
-  /* Answers: text serif within the reading measure; --ds-space-12 below the question, --size-px-5 below. */
+  /* Answers: text serif within the reading measure; --size-px-2-5 below the question, --size-px-5 below. */
   .answer {
-    max-inline-size: var(--ds-measure-reading);
+    max-inline-size: var(--fgd-measure-reading);
     padding-block: 0 var(--size-px-5);
     padding-inline-start: var(--faq-bar-inset);
     color: var(--primary12);
@@ -155,14 +155,14 @@
   @media (prefers-reduced-motion: no-preference) {
     .panel {
       transition-property: block-size;
-      transition-duration: var(--ds-duration-disclosure);
+      transition-duration: var(--fgd-duration-disclosure);
       transition-timing-function: var(--ease-out-3);
     }
 
-    /* Hover transition [D181]: --ds-duration-quick, --ease-out-3. */
+    /* Hover transition [D181]: --fgd-duration-quick, --ease-out-3. */
     .question {
       transition-property: text-decoration-color;
-      transition-duration: var(--ds-duration-quick);
+      transition-duration: var(--fgd-duration-quick);
       transition-timing-function: var(--ease-out-3);
     }
   }
@@ -177,17 +177,17 @@
 
   /* Keyed detail: a leading block icon per row; answers indent to the question column. */
   .keyed .icon {
-    margin-block: calc((1lh - var(--ds-size-icon-block)) / 2);
+    margin-block: calc((1lh - var(--fgd-size-icon-block)) / 2);
     color: var(--primary12);
   }
 
   .keyed .answer {
-    padding-inline-start: calc(var(--faq-bar-inset) + var(--ds-size-icon-block) + var(--size-px-3));
+    padding-inline-start: calc(var(--faq-bar-inset) + var(--fgd-size-icon-block) + var(--size-px-3));
   }
 
   /* Barred: every row keeps the bar's inset, so questions stay aligned open or closed. */
   .barred {
-    --faq-bar-inset: var(--ds-space-12);
+    --faq-bar-inset: var(--size-px-2-5);
   }
 
   /* Split (§12.5): a page-grid placement from --lg-n-above, header in 4 of 12 columns, the list in 8. */
@@ -195,7 +195,7 @@
     .split {
       display: grid;
       grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
-      column-gap: var(--ds-space-margin);
+      column-gap: var(--fgd-space-margin);
       align-items: start;
     }
 
@@ -213,9 +213,9 @@
 }
 
 @layer states {
-  /* Expanded: the question-to-answer gap closes to --ds-space-12. */
+  /* Expanded: the question-to-answer gap closes to --size-px-2-5. */
   .trigger[data-panel-open] {
-    padding-block-end: var(--ds-space-12);
+    padding-block-end: var(--size-px-2-5);
   }
 
   .barred .trigger[data-panel-open] .openBar {
@@ -259,7 +259,7 @@
     .trigger,
     .trigger[data-panel-open] {
       min-block-size: 0;
-      padding-block-end: var(--ds-space-12);
+      padding-block-end: var(--size-px-2-5);
     }
 
     .panel,

package/feedback/alert/alert.module.css

@@ -1,6 +1,6 @@
 /*
  * Alert: the inline status block (§10.20) [D110]. On the page ground, never a
- * tinted panel: a --ds-stroke-3 start bar and the glyph in --role-status, a
+ * tinted panel: a --border-size-2-25 start bar and the glyph in --role-status, a
  * type-runin word lead, the message in type-body-ui --primary12, padding
  * --size-px-3 from the bar. The secondary is the status scale, so
  * --role-status resolves to --secondary11 (--primary12 on saturated grounds,
@@ -26,9 +26,9 @@
     grid-template-columns: auto minmax(0, 1fr);
     align-items: start;
     column-gap: var(--size-px-2);
-    row-gap: var(--ds-space-12);
+    row-gap: var(--size-px-2-5);
     border-width: 0;
-    border-inline-start-width: var(--ds-stroke-3);
+    border-inline-start-width: var(--border-size-2-25);
     border-inline-start-color: var(--role-status);
     padding-inline-start: var(--size-px-3);
     color: var(--primary12);
@@ -50,7 +50,7 @@
     color: var(--role-status);
     fill: var(--role-status-fill);
     stroke: var(--role-status-fill);
-    stroke-width: var(--ds-stroke-1-5);
+    stroke-width: var(--border-size-1-5);
     stroke-linecap: round;
     stroke-linejoin: round;
   }

package/feedback/avatar/avatar-group.module.css

@@ -59,7 +59,7 @@
   }
 
   .md {
-    --avatar-group-size: var(--ds-size-control-md);
+    --avatar-group-size: var(--fgd-size-control-md);
   }
 
   .lg {
@@ -67,6 +67,6 @@
   }
 
   .xl {
-    --avatar-group-size: var(--ds-size-avatar-xl);
+    --avatar-group-size: var(--fgd-size-avatar-xl);
   }
 }

package/feedback/avatar/avatar.module.css

@@ -49,10 +49,10 @@
     border-radius: var(--radius-round);
     background-color: var(--primary1);
     color: var(--primary12);
-    font-family: var(--ds-font-ui);
+    font-family: var(--fgd-font-ui);
     font-size: var(--avatar-initials);
     font-weight: var(--font-weight-7);
-    line-height: var(--ds-leading-display);
+    line-height: var(--fgd-leading-display);
     letter-spacing: 0;
     text-transform: uppercase;
     white-space: nowrap;
@@ -83,16 +83,16 @@
     color: var(--role-status);
     fill: var(--primary1);
     stroke: var(--primary1);
-    stroke-width: var(--ds-stroke-1-5);
+    stroke-width: var(--border-size-1-5);
     stroke-linecap: round;
     stroke-linejoin: round;
   }
 
-  /* Hover transition [D181]: --ds-duration-quick, --ease-out-3. */
+  /* Hover transition [D181]: --fgd-duration-quick, --ease-out-3. */
   @media (prefers-reduced-motion: no-preference) {
     .base {
       transition-property: border-color;
-      transition-duration: var(--ds-duration-quick);
+      transition-duration: var(--fgd-duration-quick);
       transition-timing-function: var(--ease-out-3);
     }
   }
@@ -122,12 +122,12 @@
   }
 
   .md {
-    --avatar-size: var(--ds-size-control-md);
+    --avatar-size: var(--fgd-size-control-md);
     --avatar-ring: var(--border-size-1);
     --avatar-initials: var(--font-size-1);
   }
 
-  /* …64 / 128 px a --border-size-2 --primary12 ring (Brad Frost). */
+  /* …64 / 128 px a --border-size-2 --primary12 ring. */
   .lg {
     --avatar-size: var(--size-px-9);
     --avatar-ring: var(--border-size-2);
@@ -137,9 +137,9 @@
   }
 
   .xl {
-    --avatar-size: var(--ds-size-avatar-xl);
+    --avatar-size: var(--fgd-size-avatar-xl);
     --avatar-ring: var(--border-size-2);
-    --avatar-initials: var(--ds-font-size-display);
+    --avatar-initials: var(--fgd-font-size-display);
 
     border-color: var(--primary12);
   }

package/feedback/badge/Badge.d.ts

@@ -16,7 +16,7 @@ export type BadgeStatus = Status;
 export declare const statusWords: Record<BadgeStatus, string>;
 type BadgeKindProps = {
     /**
-     * Omitted: the outline badge (`--ds-stroke-1-5` `--primary12` edge and
+     * Omitted: the outline badge (`--border-size-1-5` `--primary12` edge and
      * label). `solid`: the pill badge, a step-9 fill of the secondary with
      * its edge and a contrast-ink label; on a scale with no step-9 text ink
      * (pink, red, crimson, gold, ruby, tomato) it takes the static fill.

package/feedback/badge/badge.module.css

@@ -21,7 +21,7 @@
 }
 
 @layer base {
-  /* The outline badge: --size-px-5 tall, --ds-space-12 padding, a --ds-stroke-1-5 --primary12 edge, no fill. */
+  /* The outline badge: --size-px-5 tall, --size-px-2-5 padding, a --border-size-1-5 --primary12 edge, no fill. */
   .base {
     display: inline-flex;
     align-items: center;
@@ -31,8 +31,8 @@
     block-size: var(--size-px-5);
     max-inline-size: 100%;
     padding-block: 0;
-    padding-inline: var(--ds-space-12);
-    border-width: var(--ds-stroke-1-5);
+    padding-inline: var(--size-px-2-5);
+    border-width: var(--border-size-1-5);
     border-color: var(--primary12);
     border-radius: var(--radius-round);
     color: var(--primary12);
@@ -59,7 +59,7 @@
     color: var(--role-status);
     fill: var(--role-status-fill);
     stroke: var(--role-status-fill);
-    stroke-width: var(--ds-stroke-1-5);
+    stroke-width: var(--border-size-1-5);
     stroke-linecap: round;
     stroke-linejoin: round;
   }
@@ -100,8 +100,8 @@
   /* The sticker: a nested face scope named --primary1, ring and bold caps --primary12 [D144]. */
   .sticker {
     display: inline-flex;
-    border-block: var(--ds-stroke-1-5) solid var(--primary12);
-    border-inline: var(--ds-stroke-1-5) solid var(--primary12);
+    border-block: var(--border-size-1-5) solid var(--primary12);
+    border-inline: var(--border-size-1-5) solid var(--primary12);
     background-color: var(--primary1);
     color: var(--primary12);
   }
@@ -120,7 +120,7 @@
   .success,
   .warning,
   .danger {
-    padding-inline: var(--size-px-2) var(--ds-space-12);
+    padding-inline: var(--size-px-2) var(--size-px-2-5);
     border-color: var(--role-status);
     background-color: var(--role-status-fill);
     color: var(--role-status-text);

package/feedback/meter/Meter.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Meter as BaseMeter } from '@base-ui/react/meter';
 import { type VariantProps } from 'class-variance-authority';
 export declare const meter: (props?: ({
-    kind?: "ordinal" | "bar" | "steps" | "ring" | null | undefined;
+    kind?: "ordinal" | "bar" | "ring" | "steps" | null | undefined;
     primary?: "ruby" | "brown" | "crimson" | "gold" | "gray" | "indigo" | "olive" | "pink" | "plum" | "purple" | "red" | "tomato" | "violet" | "bronze" | "iris" | "mauve" | "sage" | "sand" | "slate" | null | undefined;
     secondary?: "ruby" | "blue" | "brown" | "crimson" | "cyan" | "gold" | "gray" | "green" | "indigo" | "lime" | "olive" | "orange" | "pink" | "plum" | "purple" | "red" | "teal" | "tomato" | "violet" | "yellow" | "amber" | "bronze" | "grass" | "iris" | "jade" | "mauve" | "mint" | "sage" | "sand" | "sky" | "slate" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -41,7 +41,7 @@ export type MeterProps = Omit<BaseMeter.Root.Props, 'children' | 'value'> & {
      * CSS sets the caps). `min` becomes 0 and `max` the last index.
      */
     stops?: readonly React.ReactNode[];
-    /** A limit, drawn as a --ds-space-12 tick at --border-size-2 across the track (`bar`). */
+    /** A limit, drawn as a --size-px-2-5 tick at --border-size-2 across the track (`bar`). */
     threshold?: number;
     /** The status beside the value; always with `statusText`. */
     status?: MeterStatus;