@astryxdesign/core 0.7.7 → 0.7.8-canary.0d54fd3

package/dist/motion/uikit/picker.d.ts

@@ -0,0 +1,96 @@
+export declare const picker: {
+    readonly geometry: {
+        /**
+         * Row pitch: rows sit at k × 32 pt in each column's table.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, UIPickerView table offsets and cell frames, Oct 23 2026
+         */
+        readonly rowHeight: 32;
+        /**
+         * The picker's height (its intrinsic content size).
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, UIPickerView frame, Oct 23 2026
+         */
+        readonly height: 216;
+        /**
+         * d of the rubber band past the first or last row. The column's table view
+         * is 291 pt tall in a 216 pt picker. With c = 0.55, scroll.rubberBand's
+         * formula puts 10, 50 and 110 pt of finger travel past the end at 5.4, 25.1
+         * and 50.1 pt. The measured values are 5.3, 25 and 50.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, UIPickerTableView frame and offsets during drags
+         *   20, 60 and 120 pt past the last row, Oct 23 2026
+         */
+        readonly rubberBandDimension: 291;
+    };
+    readonly release: {
+        /**
+         * The speed at which a coast ends. The scroll view projects the target at
+         * offset + (v − this) × r ÷ (1 − r), with r = scroll.decelerationRate
+         * .normal. That gives 461.33, 502.67 and 266.67 pt for v = 0.9334, 1.0162
+         * and 0.5436, all three to 0.3 pt. The coast onto the row it snaps to keeps
+         * the release velocity. It re-solves the rate so that the speed reaches
+         * this exactly at that row, where it stops. Two coasts fit it to 0.4 and
+         * 0.3 pt RMS, ending within 30 ms of the measured end.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, scrollViewWillEndDragging targets and per-frame
+         *   offsets to rest, Oct 23 2026
+         */
+        readonly stopSpeed: 0.0089;
+        /**
+         * Below this release speed (pt/ms, a scroll view's release velocity), a
+         * release inside the rows carries no velocity. The wheel then snaps to the
+         * nearest row instead of coasting. Past the first or last row the velocity
+         * is kept, however small (0.0816 kept). A pause before the lift does not
+         * zero it: the velocity changes only when the finger moves.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, steady 100 pt drags mid-list lifted while moving: zeroed
+         *   at 100 to 250 pt/s both ways, passed from 260 pt/s (0.2577 the
+         *   smallest velocity handed on); a 300 pt/s drag held still 300 ms
+         *   still coasted, Oct 23 2026
+         */
+        readonly minimumSpeed: 0.25;
+    };
+    /**
+     * A release without velocity, or a coast already on a row, eases onto the
+     * nearest row exponentially. Each millisecond it covers this fraction of the
+     * distance left: e^(−0.011 t), done in about 0.3 s. Snaps of 4, 6 and 8 pt
+     * fit 0.0099, 0.0107 and 0.0123.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, per-frame offsets after three slow releases between
+     *   rows, Oct 23 2026
+     */
+    readonly snapRate: 0.011;
+    readonly tapSpin: {
+        /**
+         * A tap on a row turns the wheel onto it in this long (setContentOffset
+         * animated), on Core Animation's ease-in-ease-out (timing.curves.move). The
+         * row is selected on arrival. A tap on the band's row does nothing.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, per-frame offsets after a tap two rows below the band
+         *   (6.8, 25.1, 50.2, 75.4, 93.7 % at 50 ms steps, arriving at 300 ms;
+         *   the same with Reduce Motion and Prefer Cross-Fade on), Oct 23 2026
+         */
+        readonly durationMs: 300;
+    };
+    readonly selectionTick: {
+        /**
+         * One selection haptic per row whose centre reaches the band's centre,
+         * at most one per this interval. Not during a tap's spin.
+         * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+         *   iPhone 17 Pro, selectionChangedAtLocation: and the feedback
+         *   generator's minimum interval (0.040 s) logged during drags and
+         *   coasts, Oct 23 2026
+         */
+        readonly minimumIntervalMs: 40;
+    };
+};
+/**
+ * Registers the tap spin's duration as an internal motion role,
+ * `picker.tapSpin.durationMs`. Every other value stays an internal measured
+ * constant. The tap spin's curve is the shared role `timing.curves.move`, and
+ * the bounce at an end is `scroll.bounce`. Nothing registers on import, and
+ * registering again does nothing.
+ */
+export declare function registerPickerTable(): void;
+//# sourceMappingURL=picker.d.ts.map

package/dist/motion/uikit/picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker.d.ts","sourceRoot":"","sources":["../../../src/motion/uikit/picker.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,MAAM;;QAEf;;;;WAIG;;QAEH;;;;WAIG;;QAEH;;;;;;;;WAQG;;;;QAIH;;;;;;;;;;;WAWG;;QAEH;;;;;;;;;;;WAWG;;;IAGL;;;;;;;;OAQG;;;QAGD;;;;;;;;WAQG;;;;QAIH;;;;;;;WAOG;;;CAGG,CAAC;AAEX;;;;;;GAMG;AACH,wBAAgB,mBAAmB,IAAI,IAAI,CAE1C"}

package/dist/motion/uikit/picker.js

@@ -0,0 +1,117 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file picker.ts
+ * @input Nothing; data only
+ * @output `picker`, UIPickerView's measured constants, and
+ *   `registerPickerTable`, which makes the tap spin's duration a motion role
+ * @position The picker domain of the UIKit table (motion/uikit); read by
+ *   DateInput's wheelPhysics.ts, wheelStrip.ts and PickerWheel.tsx
+ *
+ * Lengths are pt at UIKit's scale, times ms and velocities pt/ms. Every leaf
+ * carries one `@source`, as uikit.test.ts enforces.
+ *
+ * SYNC: When modified, update motion/MEASUREMENTS.md and PickerWheel.tsx.
+ */
+
+import { registerMotionTable } from "../roles.js";
+export const picker = {
+  geometry: {
+    /**
+     * Row pitch: rows sit at k × 32 pt in each column's table.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, UIPickerView table offsets and cell frames, Oct 23 2026
+     */
+    rowHeight: 32,
+    /**
+     * The picker's height (its intrinsic content size).
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, UIPickerView frame, Oct 23 2026
+     */
+    height: 216,
+    /**
+     * d of the rubber band past the first or last row. The column's table view
+     * is 291 pt tall in a 216 pt picker. With c = 0.55, scroll.rubberBand's
+     * formula puts 10, 50 and 110 pt of finger travel past the end at 5.4, 25.1
+     * and 50.1 pt. The measured values are 5.3, 25 and 50.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, UIPickerTableView frame and offsets during drags
+     *   20, 60 and 120 pt past the last row, Oct 23 2026
+     */
+    rubberBandDimension: 291
+  },
+  release: {
+    /**
+     * The speed at which a coast ends. The scroll view projects the target at
+     * offset + (v − this) × r ÷ (1 − r), with r = scroll.decelerationRate
+     * .normal. That gives 461.33, 502.67 and 266.67 pt for v = 0.9334, 1.0162
+     * and 0.5436, all three to 0.3 pt. The coast onto the row it snaps to keeps
+     * the release velocity. It re-solves the rate so that the speed reaches
+     * this exactly at that row, where it stops. Two coasts fit it to 0.4 and
+     * 0.3 pt RMS, ending within 30 ms of the measured end.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, scrollViewWillEndDragging targets and per-frame
+     *   offsets to rest, Oct 23 2026
+     */
+    stopSpeed: 0.0089,
+    /**
+     * Below this release speed (pt/ms, a scroll view's release velocity), a
+     * release inside the rows carries no velocity. The wheel then snaps to the
+     * nearest row instead of coasting. Past the first or last row the velocity
+     * is kept, however small (0.0816 kept). A pause before the lift does not
+     * zero it: the velocity changes only when the finger moves.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, steady 100 pt drags mid-list lifted while moving: zeroed
+     *   at 100 to 250 pt/s both ways, passed from 260 pt/s (0.2577 the
+     *   smallest velocity handed on); a 300 pt/s drag held still 300 ms
+     *   still coasted, Oct 23 2026
+     */
+    minimumSpeed: 0.25
+  },
+  /**
+   * A release without velocity, or a coast already on a row, eases onto the
+   * nearest row exponentially. Each millisecond it covers this fraction of the
+   * distance left: e^(−0.011 t), done in about 0.3 s. Snaps of 4, 6 and 8 pt
+   * fit 0.0099, 0.0107 and 0.0123.
+   * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+   *   iPhone 17 Pro, per-frame offsets after three slow releases between
+   *   rows, Oct 23 2026
+   */
+  snapRate: 0.011,
+  tapSpin: {
+    /**
+     * A tap on a row turns the wheel onto it in this long (setContentOffset
+     * animated), on Core Animation's ease-in-ease-out (timing.curves.move). The
+     * row is selected on arrival. A tap on the band's row does nothing.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, per-frame offsets after a tap two rows below the band
+     *   (6.8, 25.1, 50.2, 75.4, 93.7 % at 50 ms steps, arriving at 300 ms;
+     *   the same with Reduce Motion and Prefer Cross-Fade on), Oct 23 2026
+     */
+    durationMs: 300
+  },
+  selectionTick: {
+    /**
+     * One selection haptic per row whose centre reaches the band's centre,
+     * at most one per this interval. Not during a tap's spin.
+     * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+     *   iPhone 17 Pro, selectionChangedAtLocation: and the feedback
+     *   generator's minimum interval (0.040 s) logged during drags and
+     *   coasts, Oct 23 2026
+     */
+    minimumIntervalMs: 40
+  }
+};
+
+/**
+ * Registers the tap spin's duration as an internal motion role,
+ * `picker.tapSpin.durationMs`. Every other value stays an internal measured
+ * constant. The tap spin's curve is the shared role `timing.curves.move`, and
+ * the bounce at an end is `scroll.bounce`. Nothing registers on import, and
+ * registering again does nothing.
+ */
+export function registerPickerTable() {
+  registerMotionTable('picker', picker, {
+    roles: ['tapSpin.durationMs']
+  });
+}

package/dist/privateAttributes/pressGroupItem.stylex.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @file privateAttributes/pressGroupItem.stylex.ts
+ * @input Nothing: the private press-group-item attribute
+ * @output pressGroupItemProps, which marks an action a group's tracker
+ *   follows with the pointers it follows, and isTrackedByGroup, which reads
+ *   the mark
+ * @position Owner module of the private press-group-item attribute: the only
+ *   file that writes its name. AlertDialog marks its actions, and the press
+ *   controller (utils/pressFeedback.ts) leaves a press of those pointers to
+ *   the group's tracker. No package entry exports it.
+ */
+/**
+ * Spread on each action that a group's tracker follows. It names the pointer
+ * types the tracker follows, such as `['touch', 'pen']`.
+ */
+export declare function pressGroupItemProps(pointerTypes: ReadonlyArray<string>): Readonly<Record<string, string>>;
+/**
+ * Whether a group's tracker paints the press on `element` or an ancestor: a
+ * press of `pointerType`, or any press when it is null.
+ */
+export declare function isTrackedByGroup(element: Element, pointerType?: string | null): boolean;
+//# sourceMappingURL=pressGroupItem.stylex.d.ts.map

package/dist/privateAttributes/pressGroupItem.stylex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pressGroupItem.stylex.d.ts","sourceRoot":"","sources":["../../src/privateAttributes/pressGroupItem.stylex.ts"],"names":[],"mappings":"AACA;;;;;;;;;;GAUG;AAIH;;;GAGG;AACH,wBAAgB,mBAAmB,CACjC,YAAY,EAAE,aAAa,CAAC,MAAM,CAAC,GAClC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAElC;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,OAAO,EAChB,WAAW,GAAE,MAAM,GAAG,IAAW,GAChC,OAAO,CAWT"}

package/dist/privateAttributes/pressGroupItem.stylex.js

@@ -0,0 +1,36 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+/**
+ * @file privateAttributes/pressGroupItem.stylex.ts
+ * @input Nothing: the private press-group-item attribute
+ * @output pressGroupItemProps, which marks an action a group's tracker
+ *   follows with the pointers it follows, and isTrackedByGroup, which reads
+ *   the mark
+ * @position Owner module of the private press-group-item attribute: the only
+ *   file that writes its name. AlertDialog marks its actions, and the press
+ *   controller (utils/pressFeedback.ts) leaves a press of those pointers to
+ *   the group's tracker. No package entry exports it.
+ */
+
+const PRESS_GROUP_ITEM = 'data-astryx-press-group-item';
+
+/**
+ * Spread on each action that a group's tracker follows. It names the pointer
+ * types the tracker follows, such as `['touch', 'pen']`.
+ */
+export function pressGroupItemProps(pointerTypes) {
+  return {
+    [PRESS_GROUP_ITEM]: pointerTypes.join(' ')
+  };
+}
+
+/**
+ * Whether a group's tracker paints the press on `element` or an ancestor: a
+ * press of `pointerType`, or any press when it is null.
+ */
+export function isTrackedByGroup(element, pointerType = null) {
+  const marked = element.closest(`[${PRESS_GROUP_ITEM}]`);
+  if (marked == null) {
+    return false;
+  }
+  return pointerType == null || (marked.getAttribute(PRESS_GROUP_ITEM) ?? '').split(' ').includes(pointerType);
+}

package/dist/privateAttributes/reducedMotion.stylex.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @file privateAttributes/reducedMotion.stylex.ts
+ * @input Whether a theme reduces motion for everyone
+ * @output reducedMotionMarkProps and setRootReducedMotionMark, which write the
+ *   mark, and themeReducesMotion, which reads it
+ * @position Owner module of the private reduced-motion attribute: the only
+ *   file that writes its name. Theme marks its root, and the root theme marks
+ *   `<html>`; the animator, reducedMotionFade and the layout glide read it as
+ *   the person's Reduce Motion setting. No package entry exports it.
+ */
+/** Spread on a theme's root when the theme reduces motion for everyone. */
+export declare function reducedMotionMarkProps(isMarked: boolean): Readonly<Record<string, string>>;
+/**
+ * Marks or unmarks `<html>` for the root theme, so a layer portaled outside
+ * the theme's root reads the mark too.
+ */
+export declare function setRootReducedMotionMark(root: HTMLElement, isMarked: boolean): void;
+/**
+ * Whether the theme `element` is in reduces motion for everyone: its root,
+ * or `<html>` for the root theme, carries the mark.
+ */
+export declare function themeReducesMotion(element: Element | null | undefined): boolean;
+//# sourceMappingURL=reducedMotion.stylex.d.ts.map

package/dist/privateAttributes/reducedMotion.stylex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reducedMotion.stylex.d.ts","sourceRoot":"","sources":["../../src/privateAttributes/reducedMotion.stylex.ts"],"names":[],"mappings":"AACA;;;;;;;;;GASG;AAIH,2EAA2E;AAC3E,wBAAgB,sBAAsB,CACpC,QAAQ,EAAE,OAAO,GAChB,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAElC;AAED;;;GAGG;AACH,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,WAAW,EACjB,QAAQ,EAAE,OAAO,GAChB,IAAI,CAMN;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,GAClC,OAAO,CAET"}

package/dist/privateAttributes/reducedMotion.stylex.js

@@ -0,0 +1,40 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+/**
+ * @file privateAttributes/reducedMotion.stylex.ts
+ * @input Whether a theme reduces motion for everyone
+ * @output reducedMotionMarkProps and setRootReducedMotionMark, which write the
+ *   mark, and themeReducesMotion, which reads it
+ * @position Owner module of the private reduced-motion attribute: the only
+ *   file that writes its name. Theme marks its root, and the root theme marks
+ *   `<html>`; the animator, reducedMotionFade and the layout glide read it as
+ *   the person's Reduce Motion setting. No package entry exports it.
+ */
+
+const REDUCED_MOTION = 'data-astryx-reduced-motion';
+
+/** Spread on a theme's root when the theme reduces motion for everyone. */
+export function reducedMotionMarkProps(isMarked) {
+  return isMarked ? {
+    [REDUCED_MOTION]: ''
+  } : {};
+}
+
+/**
+ * Marks or unmarks `<html>` for the root theme, so a layer portaled outside
+ * the theme's root reads the mark too.
+ */
+export function setRootReducedMotionMark(root, isMarked) {
+  if (isMarked) {
+    root.setAttribute(REDUCED_MOTION, '');
+  } else {
+    root.removeAttribute(REDUCED_MOTION);
+  }
+}
+
+/**
+ * Whether the theme `element` is in reduces motion for everyone: its root,
+ * or `<html>` for the root theme, carries the mark.
+ */
+export function themeReducesMotion(element) {
+  return element?.closest?.(`[${REDUCED_MOTION}]`) != null;
+}

package/dist/theme/Theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/theme/Theme.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAgD,MAAM,OAAO,CAAC;AAGrE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAEvC,OAAO,EAAmB,KAAK,YAAY,EAAC,MAAM,eAAe,CAAC;AAMlE;;GAEG;AACH,UAAU,UAAU;IAClB,+BAA+B;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,kDAAkD;IAClD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yBAAyB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AA0BD;;;;;;;;GAQG;AACH,eAAO,MAAM,mBAAmB,wBAA6B,CAAC;AA6I9D;;;;;;;;;;;;GAYG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAe,EACf,QAAQ,GACT,EAAE,UAAU,GAAG,KAAK,CAAC,YAAY,CA+BjC;yBAnCe,KAAK"}
+{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/theme/Theme.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAgD,MAAM,OAAO,CAAC;AAGrE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAEvC,OAAO,EAAmB,KAAK,YAAY,EAAC,MAAM,eAAe,CAAC;AAWlE;;GAEG;AACH,UAAU,UAAU;IAClB,+BAA+B;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,kDAAkD;IAClD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yBAAyB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AA+BD;;;;;;;;GAQG;AACH,eAAO,MAAM,mBAAmB,wBAA6B,CAAC;AA4J9D;;;;;;;;;;;;GAYG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAe,EACf,QAAQ,GACT,EAAE,UAAU,GAAG,KAAK,CAAC,YAAY,CAwCjC;yBA5Ce,KAAK"}

package/dist/theme/Theme.js

@@ -44,6 +44,8 @@ import { registerTheme } from "./themeRegistry.js";
 import { dataAttr } from "../naming.js";
 import { ThemeContext } from "./useTheme.js";
 import { warnOnce } from "../utils/devWarning.js";
+import { REDUCED_MOTION_PROPERTY, resolveMotionKnobs } from "./themeMotion.js";
+import { reducedMotionMarkProps, setRootReducedMotionMark } from "../privateAttributes/reducedMotion.stylex.js";
 
 /**
  * Theme provider props
@@ -70,6 +72,10 @@ const wrapperStyles = {
   system: {
     kQNsl9: "x108lcm5",
     $$css: true
+  },
+  reducedMotion: {
+    "--_astryx-reduced-motion": "x1e3mt4b",
+    $$css: true
   }
 };
 
@@ -104,6 +110,8 @@ const THEME_LAYER_ORDER = '@layer reset, astryx-base, astryx-theme;';
  */
 function useThemeStyleInjection(theme) {
   const id = useId();
+
+  // Syncs the document's stylesheets with the runtime theme CSS.
   useInsertionEffect(() => {
     // Built themes have their CSS in a separate file — skip injection
     if (theme.__built) {
@@ -178,8 +186,13 @@ function useThemeStyleInjection(theme) {
  *
  * - 'light' | 'dark' → sets data-theme="light" | "dark"
  * - 'system' → removes data-theme (reset.css defaults to color-scheme: light dark)
+ *
+ * A theme that reduces motion for everyone also marks `<html>` with
+ * `data-astryx-reduced-motion` and its custom property, so layers portaled
+ * outside the wrapper reduce their motion too.
  */
-function useRootThemeSync(isNested, mode, themeName) {
+function useRootThemeSync(isNested, mode, themeName, reducesMotion) {
+  // Syncs the theme attributes on the root `<html>` element.
   useIsomorphicLayoutEffect(() => {
     if (isNested) {
       return;
@@ -196,11 +209,19 @@ function useRootThemeSync(isNested, mode, themeName) {
 
     // Sync theme name so @scope rules reach portals/fallback viewports.
     document.documentElement.setAttribute(dataAttr('theme'), themeName);
+    setRootReducedMotionMark(document.documentElement, reducesMotion);
+    if (reducesMotion) {
+      document.documentElement.style.setProperty(REDUCED_MOTION_PROPERTY, '1');
+    } else {
+      document.documentElement.style.removeProperty(REDUCED_MOTION_PROPERTY);
+    }
     return () => {
       document.documentElement.removeAttribute('data-theme');
       document.documentElement.removeAttribute(dataAttr('theme'));
+      setRootReducedMotionMark(document.documentElement, false);
+      document.documentElement.style.removeProperty(REDUCED_MOTION_PROPERTY);
     };
-  }, [isNested, mode, themeName]);
+  }, [isNested, mode, themeName, reducesMotion]);
 }
 
 // =============================================================================
@@ -228,7 +249,10 @@ export function Theme({
   const isNested = use(ThemeNestingContext);
   registerTheme(theme);
   useThemeStyleInjection(theme);
-  useRootThemeSync(isNested, mode, theme.name);
+  // resolveMotionKnobs resolves no public theme to 'always', so no theme
+  // marks its root.
+  const reducesMotion = resolveMotionKnobs(theme.__axes?.motion).reducedMotion === 'always';
+  useRootThemeSync(isNested, mode, theme.name, reducesMotion);
 
   // Get color-scheme style
   const colorSchemeStyle = mode === 'dark' ? wrapperStyles.dark : mode === 'light' ? wrapperStyles.light : wrapperStyles.system;
@@ -243,8 +267,9 @@ export function Theme({
     children: /*#__PURE__*/_jsx(ThemeNestingContext, {
       value: true,
       children: /*#__PURE__*/_jsx("div", {
-        ...stylex.props(wrapperStyles.base, colorSchemeStyle),
+        ...stylex.props(wrapperStyles.base, colorSchemeStyle, reducesMotion && wrapperStyles.reducedMotion),
         "data-astryx-theme": theme.name,
+        ...reducedMotionMarkProps(reducesMotion),
         "data-theme": mode === 'system' ? undefined : mode,
         children: children
       })

package/dist/theme/generateThemeRules.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generateThemeRules.d.ts","sourceRoot":"","sources":["../../src/theme/generateThemeRules.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,EAAC,iBAAiB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACnE,OAAO,EAGL,KAAK,2BAA2B,EACjC,MAAM,oBAAoB,CAAC;AAmH5B;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,+EAA+E;IAC/E,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,kFAAkF;IAClF,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,SAAS,EAAE,MAAM,CAAC;CACnB;AAyhBD,sFAAsF;AACtF,wBAAgB,iCAAiC,CAC/C,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAC9B,WAAW,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,EACxC,KAAK,GAAE,aAAa,CAAC,2BAA2B,CAAM,GACrD,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,CAqDpB;AA+OD;;;;;GAKG;AACH;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B,sCAAsC;IACtC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,0CAA0C;IAC1C,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AA4FD,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,eAAe,EACtB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,EAAE,CA6DV;AAoZD;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,eAAe,CAejB;AA8BD;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,CA+GR;AAmDD;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAgGhB;AAOD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAWhB"}
+{"version":3,"file":"generateThemeRules.d.ts","sourceRoot":"","sources":["../../src/theme/generateThemeRules.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,EAAC,iBAAiB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACnE,OAAO,EAGL,KAAK,2BAA2B,EACjC,MAAM,oBAAoB,CAAC;AAmH5B;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,+EAA+E;IAC/E,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,kFAAkF;IAClF,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,SAAS,EAAE,MAAM,CAAC;CACnB;AA2hBD,sFAAsF;AACtF,wBAAgB,iCAAiC,CAC/C,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAC9B,WAAW,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,EACxC,KAAK,GAAE,aAAa,CAAC,2BAA2B,CAAM,GACrD,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,CAqDpB;AA+OD;;;;;GAKG;AACH;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B,sCAAsC;IACtC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,0CAA0C;IAC1C,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AA4FD,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,eAAe,EACtB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,EAAE,CA6DV;AAoZD;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,eAAe,CAejB;AA8BD;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,MAAM,CA+GR;AAmDD;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAgGhB;AAOD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,YAAY,EACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,GAClB,cAAc,CAWhB"}

package/dist/theme/generateThemeRules.js

@@ -354,24 +354,25 @@ function joinDeclarations(entries, location, sink, mapProp = p => p) {
 }
 
 /**
- * Public status roles whose canonical default references an existing semantic
- * source token. StyleX owns the document defaults. A theme that authors a
- * source repeats its omitted role at the theme root so nested Theme regions
- * bind the alias locally without changing authored-token metadata.
+ * Public tokens whose canonical default references another public token: the
+ * status roles and `--duration-exit`. StyleX owns the document defaults. A
+ * theme that authors a source repeats its omitted token at the theme root so
+ * nested Theme regions bind the alias locally without changing authored-token
+ * metadata.
  *
  * Conditional scopes repeat an omitted alias only when the source changes on
  * that scope. Explicit adaptation role writes are replayed after generated
  * aliases (and on media descendants) so authored role precedence survives
  * overlapping conditions without disabling the alias in non-matching states.
  */
-const SCOPED_STATUS_ROLE_DEFAULTS = [['--color-text-info', '--color-text-blue'], ['--color-text-success', '--color-text-green'], ['--color-text-warning', '--color-text-yellow'], ['--color-text-error', '--color-text-red'], ['--color-on-info-muted', '--color-text-blue'], ['--color-on-success-muted', '--color-text-green'], ['--color-on-warning-muted', '--color-text-yellow'], ['--color-on-error-muted', '--color-text-red'],
+const SCOPED_REFERENCE_DEFAULTS = [['--color-text-info', '--color-text-blue'], ['--color-text-success', '--color-text-green'], ['--color-text-warning', '--color-text-yellow'], ['--color-text-error', '--color-text-red'], ['--color-on-info-muted', '--color-text-blue'], ['--color-on-success-muted', '--color-text-green'], ['--color-on-warning-muted', '--color-text-yellow'], ['--color-on-error-muted', '--color-text-red'],
 // Icon and border roles follow the text role, set or derived (INV17).
-['--color-icon-info', '--color-text-info'], ['--color-icon-success', '--color-text-success'], ['--color-icon-warning', '--color-text-warning'], ['--color-icon-error', '--color-text-error'], ['--color-border-info', '--color-text-info'], ['--color-border-success', '--color-text-success'], ['--color-border-warning', '--color-text-warning'], ['--color-border-error', '--color-text-error']];
-const SCOPED_STATUS_ROLE_SOURCES = new Map(SCOPED_STATUS_ROLE_DEFAULTS);
+['--color-icon-info', '--color-text-info'], ['--color-icon-success', '--color-text-success'], ['--color-icon-warning', '--color-text-warning'], ['--color-icon-error', '--color-text-error'], ['--color-border-info', '--color-text-info'], ['--color-border-success', '--color-text-success'], ['--color-border-warning', '--color-text-warning'], ['--color-border-error', '--color-text-error'], ['--duration-exit', '--duration-fast']];
+const SCOPED_REFERENCE_SOURCES = new Map(SCOPED_REFERENCE_DEFAULTS);
 
 /** Colours INV17's derivation measures; a scope that sets one re-derives. */
 const STATUS_MEASURED = /^--color-(?:info|success|warning|error|on-|background-surface|background-card)/;
-const STATUS_ROLE_ORDER = new Map(SCOPED_STATUS_ROLE_DEFAULTS.map(([role], index) => [role, index]));
+const STATUS_ROLE_ORDER = new Map(SCOPED_REFERENCE_DEFAULTS.map(([role], index) => [role, index]));
 function stringifyTokenValue(value) {
   if (typeof value === 'string') {
     return value;
@@ -508,7 +509,7 @@ export function generatedScopedStatusRoleDefaults(tokens, localTokens = {}, rule
     indexes,
     values: effectiveAdaptationTokenValues(tokens, localTokens, entries, rules, indexes)
   }));
-  for (const [role, source] of SCOPED_STATUS_ROLE_DEFAULTS) {
+  for (const [role, source] of SCOPED_REFERENCE_DEFAULTS) {
     const alias = `var(${source})`;
     if (authoredRoot[role] !== undefined || authoredRoot[source] === undefined && !entries.some(([emitted]) => emitted === source)) {
       continue;
@@ -533,7 +534,7 @@ export function generatedScopedStatusRoleDefaults(tokens, localTokens = {}, rule
 }
 function authoredStatusRoleEntries(tokens) {
   const canonicalTokens = createTokenCascade(tokens).values;
-  return SCOPED_STATUS_ROLE_DEFAULTS.flatMap(([role]) => {
+  return SCOPED_REFERENCE_DEFAULTS.flatMap(([role]) => {
     const value = canonicalTokens[role];
     return value === undefined ? [] : [[role, stringifyTokenValue(value)]];
   });
@@ -542,7 +543,7 @@ function tokenValueIsAliasOf(value, source) {
   return analyzeDeclarationValue(stringifyTokenValue(value)).singleVarReference === source;
 }
 function mediaRoleRestorationValue(role, value) {
-  const source = SCOPED_STATUS_ROLE_SOURCES.get(role);
+  const source = SCOPED_REFERENCE_SOURCES.get(role);
   return source !== undefined && tokenValueIsAliasOf(value, source) ? value : 'inherit';
 }
 function generatedAdaptationStatusRoleDefaults(rootTokens, rootLocalTokens, rules, rootAliases) {
@@ -577,7 +578,7 @@ function generatedAdaptationStatusRoleDefaults(rootTokens, rootLocalTokens, rule
       ...authoredRule,
       ...Object.fromEntries(ruleRoles)
     };
-    for (const [role, source] of SCOPED_STATUS_ROLE_DEFAULTS) {
+    for (const [role, source] of SCOPED_REFERENCE_DEFAULTS) {
       const alias = `var(${source})`;
       const rootRole = rootValues[role];
       if (ruleRoles.has(role) || authoredRule[role] !== undefined || ruleSources[source] === undefined && !aliases[index].some(([emitted]) => emitted === source) || rootRole !== undefined) {
@@ -632,7 +633,7 @@ function generatedMediaStatusRoleDefaults(tokens, rootTokens, rootLocalTokens, r
     }
     return stringifyTokenValue(candidate.values[role]);
   };
-  for (const [role, source] of SCOPED_STATUS_ROLE_DEFAULTS) {
+  for (const [role, source] of SCOPED_REFERENCE_DEFAULTS) {
     const alias = `var(${source})`;
     const rootRole = rootValues[role];
     if (authoredMedia[role] !== undefined || authoredMedia[source] === undefined && !aliases.some(([emitted]) => emitted === source) || rootRole !== undefined && !tokenValueIsAliasOf(rootRole, source) && !rootDerived.has(role)) {

package/dist/theme/motionKnobs.d.ts

@@ -16,10 +16,11 @@
 /** How lively a theme's motion feels. */
 export type MotionCharacter = 'crisp' | 'standard' | 'expressive';
 /**
- * Whose Reduce Motion setting a theme follows: `'system'`, each person's own.
- * Internal: no theme sets it until `'always'` ships (`spec:AST-108` FR6).
+ * Whose Reduce Motion setting a theme follows: `'system'`, each person's own,
+ * or `'always'`, reduced for everyone. Internal: `resolveKnobs` resolves
+ * every theme to `'system'` until `'always'` ships (`spec:AST-108` FR6).
  */
-export type ThemeReducedMotion = 'system';
+export type ThemeReducedMotion = 'system' | 'always';
 /** The motion knobs a theme sets (`spec:AST-108` FR1). */
 export interface ThemeMotionKnobs {
     /**

package/dist/theme/motionKnobs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"motionKnobs.d.ts","sourceRoot":"","sources":["../../src/theme/motionKnobs.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;GAcG;AAEH,yCAAyC;AACzC,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,UAAU,GAAG,YAAY,CAAC;AAElE;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAC;AAE1C,0DAA0D;AAC1D,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B;AAED,mEAAmE;AACnE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,aAAa,EAAE,kBAAkB,CAAC;IAC3C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;CAC9B;AAED,uCAAuC;AACvC,eAAO,MAAM,WAAW;;;CAAiC,CAAC;AAQ1D,kEAAkE;AAClE,wBAAgB,YAAY,CAC1B,MAAM,EAAE,gBAAgB,GAAG,SAAS,GACnC,mBAAmB,CAcrB"}
+{"version":3,"file":"motionKnobs.d.ts","sourceRoot":"","sources":["../../src/theme/motionKnobs.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;GAcG;AAEH,yCAAyC;AACzC,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,UAAU,GAAG,YAAY,CAAC;AAElE;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAErD,0DAA0D;AAC1D,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B;AAED,mEAAmE;AACnE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,aAAa,EAAE,kBAAkB,CAAC;IAC3C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;CAC9B;AAED,uCAAuC;AACvC,eAAO,MAAM,WAAW;;;CAAiC,CAAC;AAQ1D,kEAAkE;AAClE,wBAAgB,YAAY,CAC1B,MAAM,EAAE,gBAAgB,GAAG,SAAS,GACnC,mBAAmB,CAcrB"}

package/dist/theme/motionKnobs.js

@@ -19,8 +19,9 @@
 /** How lively a theme's motion feels. */
 
 /**
- * Whose Reduce Motion setting a theme follows: `'system'`, each person's own.
- * Internal: no theme sets it until `'always'` ships (`spec:AST-108` FR6).
+ * Whose Reduce Motion setting a theme follows: `'system'`, each person's own,
+ * or `'always'`, reduced for everyone. Internal: `resolveKnobs` resolves
+ * every theme to `'system'` until `'always'` ships (`spec:AST-108` FR6).
  */
 
 /** The motion knobs a theme sets (`spec:AST-108` FR1). */

package/dist/theme/themeMotion.d.ts

@@ -49,6 +49,12 @@ export declare function resolveMotionKnobs(config: ThemeMotionConfig | undefined
  * multiplies its clock by it.
  */
 export declare const MOTION_TEMPO_PROPERTY = "--_astryx-motion-tempo";
+/**
+ * The custom property a theme whose `reducedMotion` resolves to `'always'`
+ * sets to `1` on its root, and the root theme on `<html>`: styles that cannot
+ * key a selector on the mark read it in a value.
+ */
+export declare const REDUCED_MOTION_PROPERTY = "--_astryx-reduced-motion";
 /** The duration tokens at `tempo`: today's values times it, to the ms. */
 export declare function durationTokensAt(tempo: number): Record<string, string>;
 /**

package/dist/theme/themeMotion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"themeMotion.d.ts","sourceRoot":"","sources":["../../src/theme/themeMotion.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAAoB,KAAK,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AAC9E,OAAO,EAGL,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAC;AAIvB,OAAO,EACL,WAAW,EACX,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,GACxB,MAAM,eAAe,CAAC;AAEvB;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAC3B,gBAAgB,GAAG,CAAC,iBAAiB,GAAG,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,eAAO,MAAM,cAAc;;;;CAIgC,CAAC;AAE5D,kEAAkE;AAClE,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,iBAAiB,GAAG,SAAS,GACpC,mBAAmB,CAErB;AAaD;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,2BAA2B,CAAC;AAE9D,0EAA0E;AAC1E,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAMtE;AAED;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAElD;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,iBAAiB,GACxB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAmCxB;AAED,qDAAqD;AACrD,MAAM,WAAW,WAAW;IAC1B,qCAAqC;IACrC,QAAQ,CAAC,KAAK,EAAE,mBAAmB,CAAC;IACpC,0CAA0C;IAC1C,QAAQ,CAAC,SAAS,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IACrD,8DAA8D;IAC9D,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;CACpD;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,QAAQ,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAC;IACpC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAA;KAAC,CAAC;IACxD,QAAQ,CAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IACpD,QAAQ,CAAC,WAAW,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CAC1D,GAAG,WAAW,CAyCd"}
+{"version":3,"file":"themeMotion.d.ts","sourceRoot":"","sources":["../../src/theme/themeMotion.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAAoB,KAAK,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AAC9E,OAAO,EAGL,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAC;AAIvB,OAAO,EACL,WAAW,EACX,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,GACxB,MAAM,eAAe,CAAC;AAEvB;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAC3B,gBAAgB,GAAG,CAAC,iBAAiB,GAAG,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,eAAO,MAAM,cAAc;;;;CAIgC,CAAC;AAE5D,kEAAkE;AAClE,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,iBAAiB,GAAG,SAAS,GACpC,mBAAmB,CAErB;AAaD;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,2BAA2B,CAAC;AAE9D;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,6BAA6B,CAAC;AAUlE,0EAA0E;AAC1E,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAMtE;AAED;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAElD;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,iBAAiB,GACxB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAmCxB;AAED,qDAAqD;AACrD,MAAM,WAAW,WAAW;IAC1B,qCAAqC;IACrC,QAAQ,CAAC,KAAK,EAAE,mBAAmB,CAAC;IACpC,0CAA0C;IAC1C,QAAQ,CAAC,SAAS,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IACrD,8DAA8D;IAC9D,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;CACpD;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,QAAQ,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAC;IACpC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAA;KAAC,CAAC;IACxD,QAAQ,CAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IACpD,QAAQ,CAAC,WAAW,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CAC1D,GAAG,WAAW,CAyCd"}

package/dist/theme/themeMotion.js

@@ -68,10 +68,23 @@ function msOf(value) {
  */
 export const MOTION_TEMPO_PROPERTY = '--_astryx-motion-tempo';
 
+/**
+ * The custom property a theme whose `reducedMotion` resolves to `'always'`
+ * sets to `1` on its root, and the root theme on `<html>`: styles that cannot
+ * key a selector on the mark read it in a value.
+ */
+export const REDUCED_MOTION_PROPERTY = '--_astryx-reduced-motion';
+
+/**
+ * A reference such as `--duration-exit` follows the token it names, so tempo
+ * writes no value for it.
+ */
+const TIMED_DURATION_DEFAULTS = Object.entries(durationDefaults).filter(([, value]) => !value.startsWith('var('));
+
 /** The duration tokens at `tempo`: today's values times it, to the ms. */
 export function durationTokensAt(tempo) {
   const tokens = {};
-  for (const [name, value] of Object.entries(durationDefaults)) {
+  for (const [name, value] of TIMED_DURATION_DEFAULTS) {
     tokens[name] = `${Math.round(msOf(value) * tempo)}ms`;
   }
   return tokens;
@@ -102,7 +115,7 @@ export function expandThemeMotion(config) {
   const tokens = {};
   if (knobs.tempoIsSet) {
     Object.assign(tokens, durationTokensAt(knobs.tempo));
-    for (const [name, value] of Object.entries(durationDefaults)) {
+    for (const [name, value] of TIMED_DURATION_DEFAULTS) {
       tokens[preTempoName(name)] = value;
     }
     // The press release fade, a fixed clock in the stylesheet, scales by the