kuinetic 0.1.3 → 0.2.0

package/dist/esm/chunk-U43BX5O2.mjs

@@ -0,0 +1,2984 @@
+// src/core/target.ts
+function selectorBreadth(selector, doc) {
+  try {
+    if (doc.documentElement.matches(selector)) return "document-wide";
+    if (doc.body?.matches(selector)) return "document-wide";
+    return "ok";
+  } catch {
+    return "invalid";
+  }
+}
+function resolveTarget(selector, ctx, effect) {
+  if (!selector) return selector;
+  const breadth = selectorBreadth(selector, ctx.doc);
+  if (breadth === "invalid") {
+    ctx.warn(`${effect} target "${selector}" is not a valid selector and will be ignored`);
+    return "";
+  }
+  if (breadth === "document-wide") {
+    ctx.warn(`${effect} target "${selector}" matches the whole document and will be ignored`);
+    return "";
+  }
+  return selector;
+}
+var SCOPE_PARAM = {
+  type: "keyword",
+  default: "",
+  cssProperty: "--kui-scope",
+  keywords: ["self", "page"]
+};
+function scopeParam(params, fallback) {
+  const authored = params.text("scope");
+  if (authored === "page") return "page";
+  if (authored === "self") return "self";
+  return fallback;
+}
+function queryScoped(el, ctx, selector, scope) {
+  return [...(scope === "page" ? ctx.doc : el).querySelectorAll(selector)];
+}
+
+// src/core/event-sources.ts
+function createEventSourceBindings() {
+  const bindings = /* @__PURE__ */ new Map();
+  function retain(source, type, run) {
+    let types = bindings.get(source);
+    if (!types) {
+      types = /* @__PURE__ */ new Map();
+      bindings.set(source, types);
+    }
+    let binding = types.get(type);
+    if (!binding) {
+      const runs = /* @__PURE__ */ new Set();
+      const listener = () => {
+        for (const callback of [...runs]) callback();
+      };
+      binding = { listener, runs };
+      types.set(type, binding);
+      source.addEventListener(type, listener, { passive: true });
+    }
+    binding.runs.add(run);
+    let retained = true;
+    return () => {
+      if (!retained) return;
+      retained = false;
+      binding.runs.delete(run);
+      if (binding.runs.size > 0) return;
+      source.removeEventListener(type, binding.listener);
+      types?.delete(type);
+      if (types?.size === 0) bindings.delete(source);
+    };
+  }
+  return {
+    bind({ sources, types, run }) {
+      const cleanups = [];
+      for (const source of sources) {
+        for (const type of types) cleanups.push(retain(source, type, run));
+      }
+      return () => {
+        for (const cleanup of cleanups) cleanup();
+      };
+    },
+    destroy() {
+      for (const [source, types] of bindings) {
+        for (const [type, binding] of types) source.removeEventListener(type, binding.listener);
+      }
+      bindings.clear();
+    }
+  };
+}
+function resolveEventSources({ el, from, reporter }) {
+  if (!from) return [el];
+  const doc = el.ownerDocument;
+  const breadth = selectorBreadth(from, doc);
+  if (breadth !== "ok") {
+    const reason = breadth === "invalid" ? "is not a valid selector" : "matches the whole document";
+    reporter?.warn(`activation source "${from}" ${reason} and will be ignored`, el);
+    return [];
+  }
+  const sources = [...doc.querySelectorAll(from)];
+  if (sources.length === 0) reporter?.warn(`activation source "${from}" matched nothing`, el);
+  return sources;
+}
+
+// src/core/threshold-reachability.ts
+var RATIO_EPSILON = 1e-6;
+function maxReachableRatio(entry) {
+  const root = entry.rootBounds;
+  const box = entry.boundingClientRect;
+  if (!root || box.width <= 0 || box.height <= 0) return void 0;
+  return Math.min(1, root.width / box.width) * Math.min(1, root.height / box.height);
+}
+function formatThreshold(ratio) {
+  return `${Math.round(ratio * 1e3) / 10}%`;
+}
+function checkThresholdReachability(binding, entry, ratio) {
+  const reporter = binding.reporter;
+  if (!reporter || ratio <= 0 || binding.thresholdWarned) return;
+  if (entry.isIntersecting) {
+    binding.sawIntersecting = true;
+    return;
+  }
+  if (!binding.sawIntersecting || binding.entered) return;
+  const max = maxReachableRatio(entry);
+  if (max === void 0 || max >= ratio - RATIO_EPSILON) return;
+  binding.thresholdWarned = true;
+  reporter.warn(
+    `threshold:${formatThreshold(ratio)} can never be met on this element \u2014 it is larger than the root it scrolls through, so its intersection ratio maxes out around ${formatThreshold(max)} and never reaches ${formatThreshold(ratio)}. An IntersectionObserver only reports ratio crossings, so the library cannot soften this from here \u2014 author a smaller threshold, or make the element (or its scrolling root) fit the other.`,
+    entry.target
+  );
+}
+
+// src/core/travel.ts
+var TRAVEL_WINDOW_MS = 200;
+function createTravelTracker() {
+  const positions = /* @__PURE__ */ new WeakMap();
+  let side;
+  let at = Number.NEGATIVE_INFINITY;
+  let holders = 0;
+  const onScroll = (event) => {
+    const target = event.target;
+    const now = scrollPositionOf(target);
+    if (!now) return;
+    const last = positions.get(target);
+    positions.set(target, now);
+    if (!last) return;
+    const dy = now.y - last.y;
+    const dx = now.x - last.x;
+    const delta = Math.abs(dy) >= Math.abs(dx) ? dy : dx;
+    if (delta === 0) return;
+    side = delta > 0 ? "after" : "before";
+    at = event.timeStamp;
+  };
+  const stop = () => {
+    holders = 0;
+    side = void 0;
+    at = Number.NEGATIVE_INFINITY;
+    if (typeof window !== "undefined") {
+      window.removeEventListener("scroll", onScroll, { capture: true });
+    }
+  };
+  return {
+    arrivedFrom: (time2) => time2 - at <= TRAVEL_WINDOW_MS ? side : void 0,
+    retain() {
+      if (holders++ > 0 || typeof window === "undefined") return;
+      window.addEventListener("scroll", onScroll, { capture: true, passive: true });
+      const start = scrollPositionOf(window.document);
+      if (start) positions.set(window.document, start);
+    },
+    release() {
+      if (holders === 0 || --holders > 0) return;
+      stop();
+    },
+    reset: stop
+  };
+}
+function scrollPositionOf(target) {
+  if (target === window || target === window.document) {
+    return { x: window.scrollX, y: window.scrollY };
+  }
+  if (target instanceof Element) return { x: target.scrollLeft, y: target.scrollTop };
+  return void 0;
+}
+
+// src/core/activation.ts
+var PAIR_SEPARATOR = "/";
+var NAMED_TRIGGERS = {
+  load: { kind: "immediate" },
+  manual: { kind: "manual" },
+  enter: { kind: "observed", when: "enter" },
+  leave: { kind: "observed", when: "leave" },
+  hover: { kind: "events", types: ["pointerenter", "focusin"] },
+  unhover: { kind: "events", types: ["pointerleave", "focusout"] },
+  focus: { kind: "events", types: ["focusin"] },
+  blur: { kind: "events", types: ["focusout"] },
+  click: { kind: "events", types: ["click"] }
+};
+var SUPPORT_PROXIES = {
+  load: ["load"],
+  manual: ["manual"],
+  enter: ["enter"],
+  leave: ["enter"],
+  hover: ["hover"],
+  unhover: ["hover"],
+  focus: ["focus"],
+  blur: ["focus"],
+  click: ["click"]
+};
+var EVENT_DRIVEN = ["hover", "focus", "click"];
+var KNOWN_EVENTS = [
+  "click",
+  "dblclick",
+  "auxclick",
+  "contextmenu",
+  "pointerdown",
+  "pointerup",
+  "pointerenter",
+  "pointerleave",
+  "pointerover",
+  "pointerout",
+  "pointermove",
+  "pointercancel",
+  "gotpointercapture",
+  "lostpointercapture",
+  "mousedown",
+  "mouseup",
+  "mouseenter",
+  "mouseleave",
+  "mouseover",
+  "mouseout",
+  "mousemove",
+  "focusin",
+  "focusout",
+  "focus",
+  "blur",
+  "keydown",
+  "keyup",
+  "keypress",
+  "input",
+  "beforeinput",
+  "change",
+  "submit",
+  "reset",
+  "invalid",
+  "select",
+  "search",
+  "touchstart",
+  "touchend",
+  "touchmove",
+  "touchcancel",
+  "wheel",
+  "scroll",
+  "scrollend",
+  "dragstart",
+  "drag",
+  "dragend",
+  "dragenter",
+  "dragover",
+  "dragleave",
+  "drop",
+  "animationstart",
+  "animationend",
+  "animationiteration",
+  "animationcancel",
+  "transitionstart",
+  "transitionend",
+  "transitionrun",
+  "transitioncancel",
+  "play",
+  "playing",
+  "pause",
+  "ended",
+  "timeupdate",
+  "seeked",
+  "volumechange",
+  "ratechange",
+  "loadeddata",
+  "loadedmetadata",
+  "canplay",
+  "canplaythrough",
+  "waiting",
+  "stalled",
+  "toggle",
+  "beforetoggle",
+  "close",
+  "cancel",
+  "copy",
+  "cut",
+  "paste",
+  "load",
+  "error",
+  "abort",
+  "resize",
+  "fullscreenchange"
+];
+var EVENT_NAME_RE = /^[A-Za-z][A-Za-z0-9._:-]*$/;
+var SUGGESTION_DISTANCE = 2;
+function isNamedActivation(name) {
+  return Object.hasOwn(NAMED_TRIGGERS, name);
+}
+function triggerFor(name) {
+  if (isNamedActivation(name)) return NAMED_TRIGGERS[name];
+  return { kind: "events", types: [name] };
+}
+function resolveActivationSpec(activation) {
+  const names = String(activation).split(PAIR_SEPARATOR);
+  const [start = "", end] = names;
+  return {
+    source: activation,
+    names,
+    start: triggerFor(start),
+    ...end === void 0 ? {} : { end: triggerFor(end) }
+  };
+}
+function validateActivation(value) {
+  const names = value.split(PAIR_SEPARATOR);
+  if (names.length > 2) {
+    return [
+      `activation "${value}" has more than one "${PAIR_SEPARATOR}" \u2014 expected "start${PAIR_SEPARATOR}end"`
+    ];
+  }
+  const malformed = names.filter((name) => !EVENT_NAME_RE.test(name));
+  if (malformed.length > 0) {
+    return [`activation "${value}" is not an event name or a "start${PAIR_SEPARATOR}end" pair`];
+  }
+  const end = names[1];
+  if (end !== void 0 && (end === "load" || end === "manual")) {
+    return [`activation "${value}" cannot end on "${end}" \u2014 an exit needs an event to fire on`];
+  }
+  return [];
+}
+function startKindOf(activation) {
+  return resolveActivationSpec(activation).start.kind;
+}
+function isOneShot(spec) {
+  return spec.end === void 0 && spec.start.kind === "observed";
+}
+function authorisingActivations(name) {
+  return isNamedActivation(name) ? SUPPORT_PROXIES[name] : EVENT_DRIVEN;
+}
+function isKnownEventType(type) {
+  if (/[-:.]/.test(type)) return true;
+  return KNOWN_EVENTS.includes(type);
+}
+function suggestActivation(name) {
+  let best;
+  let bestDistance = SUGGESTION_DISTANCE + 1;
+  for (const candidate of [...Object.keys(NAMED_TRIGGERS), ...KNOWN_EVENTS]) {
+    const distance2 = editDistance(name, candidate);
+    if (distance2 >= bestDistance) continue;
+    bestDistance = distance2;
+    best = candidate;
+  }
+  return bestDistance <= SUGGESTION_DISTANCE && bestDistance * 2 < name.length ? best : void 0;
+}
+function editDistance(a, b) {
+  let previous = Array.from({ length: b.length + 1 }, (_, i) => i);
+  for (let i = 1; i <= a.length; i++) {
+    const row = [i];
+    for (let j = 1; j <= b.length; j++) {
+      const substitution = previous[j - 1] + (a[i - 1] === b[j - 1] ? 0 : 1);
+      row.push(Math.min(previous[j] + 1, row[j - 1] + 1, substitution));
+    }
+    previous = row;
+  }
+  return previous[b.length];
+}
+var NOOP = () => {
+};
+var RATIO_EPSILON2 = 1e-6;
+function meetsThreshold(entry, ratio) {
+  if (!entry.isIntersecting) return false;
+  if (ratio <= 0) return true;
+  return entry.intersectionRatio >= ratio - RATIO_EPSILON2;
+}
+function deliverEntry(binding, entry, ratio, arrivedFrom) {
+  checkThresholdReachability(binding, entry, ratio);
+  if (binding.onCross) return deliverCrossing(binding, entry, ratio, arrivedFrom);
+  const inside = meetsThreshold(entry, ratio);
+  if (inside === binding.entered) return;
+  binding.entered = inside;
+  const side = inside ? binding.onEnter : binding.onLeave;
+  if (!side) return;
+  side();
+  if (binding.oneShot) binding.release();
+}
+function deliverCrossing(binding, entry, ratio, arrivedFrom) {
+  const side = sideOf(entry);
+  if (!meetsThreshold(entry, ratio)) return deliverLeaving(binding, side, arrivedFrom);
+  if (binding.entered) return;
+  const crossing = (arrivedFrom ?? binding.outside) === "before" ? "enter-back" : "enter";
+  binding.entered = true;
+  binding.outside = void 0;
+  binding.onCross?.(crossing);
+}
+function deliverLeaving(binding, side, arrivedFrom) {
+  if (side) binding.outside = side;
+  if (!binding.entered) return;
+  binding.entered = false;
+  const leavingTo = side ?? oppositeSide(arrivedFrom);
+  binding.onCross?.(leavingTo === "after" ? "leave-back" : "leave");
+}
+function oppositeSide(side) {
+  if (!side) return void 0;
+  return side === "after" ? "before" : "after";
+}
+function sideOf(entry) {
+  const root = entry.rootBounds;
+  const box = entry.boundingClientRect;
+  if (!root || !box) return void 0;
+  if (box.bottom <= root.top || box.right <= root.left) return "before";
+  if (box.top >= root.bottom || box.left >= root.right) return "after";
+  return void 0;
+}
+function createActivationBinder(options = {}) {
+  const observers = /* @__PURE__ */ new Map();
+  const callbacks = /* @__PURE__ */ new WeakMap();
+  const eventBindings = createEventSourceBindings();
+  const createObserver = options.createObserver ?? defaultObserverFactory();
+  const travel = createTravelTracker();
+  const reporter = options.reporter;
+  function observerFor(threshold) {
+    if (!createObserver) return void 0;
+    const ratio = toThresholdRatio(threshold);
+    const key = String(ratio);
+    const existing = observers.get(key);
+    if (existing) return { key, shared: existing };
+    const observer = createObserver(
+      (entries) => {
+        for (const entry of entries) {
+          const binding = callbacks.get(entry.target);
+          if (binding) deliverEntry(binding, entry, ratio, travel.arrivedFrom(entry.time));
+        }
+      },
+      { threshold: ratio }
+    );
+    const shared = { observer, count: 0 };
+    observers.set(key, shared);
+    return { key, shared };
+  }
+  function bindObserved(el, spec, request) {
+    const binding = observerFor(request.threshold);
+    if (!binding) {
+      if (spec.failOpen) request.activate();
+      return NOOP;
+    }
+    const { key, shared } = binding;
+    const tracksTravel = Boolean(spec.onCross);
+    if (tracksTravel) travel.retain();
+    let active = true;
+    const release = () => {
+      if (!active) return;
+      active = false;
+      if (tracksTravel) travel.release();
+      callbacks.delete(el);
+      shared.observer.unobserve(el);
+      shared.count--;
+      if (shared.count > 0) return;
+      shared.observer.disconnect();
+      observers.delete(key);
+    };
+    callbacks.set(el, {
+      onEnter: spec.onEnter,
+      onLeave: spec.onLeave,
+      ...spec.onCross ? { onCross: spec.onCross } : {},
+      oneShot: spec.oneShot,
+      release,
+      entered: false,
+      reporter,
+      sawIntersecting: false,
+      thresholdWarned: false
+    });
+    shared.count++;
+    shared.observer.observe(el);
+    return release;
+  }
+  return {
+    bind(el, activation, request) {
+      const spec = resolveActivationSpec(activation);
+      const sides = sidesOf(spec, request);
+      const cleanups = [];
+      let eventSources;
+      const observed = observedSides(sides);
+      if (observed) {
+        const failOpen = spec.start.kind === "observed";
+        const crossing = request.cross;
+        cleanups.push(
+          bindObserved(
+            el,
+            {
+              ...observed,
+              ...crossing ? { onCross: crossing } : {},
+              oneShot: crossing ? false : isOneShot(spec),
+              failOpen
+            },
+            request
+          )
+        );
+      }
+      for (const side of sides) {
+        const { trigger } = side;
+        if (trigger.kind === "events") {
+          eventSources ??= resolveEventSources({ el, from: request.from, reporter });
+          cleanups.push(eventBindings.bind({ sources: eventSources, types: trigger.types, run: side.run }));
+        } else if (trigger.kind === "immediate") side.run();
+      }
+      return cleanups.length === 0 ? NOOP : () => {
+        for (const cleanup of cleanups) cleanup();
+      };
+    },
+    destroy() {
+      for (const { observer } of observers.values()) observer.disconnect();
+      observers.clear();
+      eventBindings.destroy();
+      travel.reset();
+    }
+  };
+}
+function sidesOf(spec, request) {
+  const sides = [{ trigger: spec.start, run: () => request.activate() }];
+  const deactivate = request.deactivate;
+  if (spec.end && deactivate) sides.push({ trigger: spec.end, run: () => deactivate() });
+  return sides;
+}
+function observedSides(sides) {
+  const observed = {};
+  let found = false;
+  for (const side of sides) {
+    if (side.trigger.kind !== "observed") continue;
+    found = true;
+    if (side.trigger.when === "enter") observed.onEnter = side.run;
+    else observed.onLeave = side.run;
+  }
+  return found ? observed : void 0;
+}
+function toThresholdRatio(raw) {
+  const value = Number.parseFloat(raw);
+  if (Number.isNaN(value)) return 0;
+  const ratio = raw.includes("%") ? value / 100 : value;
+  return Math.min(1, Math.max(0, ratio));
+}
+function defaultObserverFactory() {
+  if (typeof IntersectionObserver === "undefined") return void 0;
+  return (callback, init) => new IntersectionObserver(callback, init);
+}
+function warnAboutActivation(request) {
+  warnUnsupported(request);
+  warnUnknownEvents(request);
+}
+function warnUnsupported({ el, spec, supported, reporter }) {
+  if (supported.length === 0) return;
+  for (const name of spec.names) {
+    if (authorisingActivations(name).some((named) => supported.includes(named))) continue;
+    reporter.warn(
+      `activation "${name}" is not supported by this effect (supports: ${supported.join(", ")})`,
+      el
+    );
+  }
+}
+function warnUnknownEvents({ el, spec, reporter }) {
+  if (!("onclick" in el)) return;
+  for (const name of spec.names) {
+    if (isNamedActivation(name) || isKnownEventType(name) || `on${name}` in el) continue;
+    const suggestion = suggestActivation(name);
+    const hint = suggestion ? `; did you mean "${suggestion}"?` : "";
+    const problem = `no DOM event named "${name}" \u2014 data-kui-on binds it anyway, so nothing will start it`;
+    reporter.warn(`${problem}${hint}`, el);
+  }
+}
+
+// src/core/attrs.ts
+var ATTR = {
+  /** Authored. The rich grammar. */
+  source: "data-kui",
+  /**
+   * Authored. Names the composition in this element's {@link source} so other elements can reuse
+   * it by name. An element carrying it is a definition — data, never animated. See `core/bundles.ts`.
+   */
+  define: "data-kui-define",
+  /** Library-owned and unstable: normalized effect names, for CSS hooks and debugging. */
+  normalized: "data-kui-fx",
+  state: "data-kui-state",
+  on: "data-kui-on",
+  timeline: "data-kui-timeline",
+  threshold: "data-kui-threshold",
+  stagger: "data-kui-stagger",
+  cloak: "data-kui-cloak",
+  /** Reduced-motion policy, stamped from the primitive so the CSS layer can act on it. */
+  rm: "data-kui-rm",
+  /** Library-owned: comma list of `target:` selectors on this host that matched nothing (D). */
+  unmatched: "data-kui-unmatched",
+  /** Library-owned: a structural role the library assigned to a child (`front`,`back`,`control`,`bar`). */
+  part: "data-kui-part"
+};
+
+// src/core/types.ts
+var CHANNEL = {
+  opacity: "opacity",
+  translate: "translate",
+  scale: "scale",
+  rotate: "rotate",
+  filter: "filter",
+  clip: "clip",
+  background: "background",
+  color: "color",
+  stroke: "stroke",
+  text: "text",
+  /**
+   * Skew is the one transform CSS never gave an independent property to — there is no `skew:`
+   * beside `translate:`/`rotate:`/`scale:`, so it can only be written through the `transform`
+   * shorthand. That makes it its own channel: anything writing `transform` clobbers the whole
+   * shorthand, so every primitive that does is on this channel, whatever the transform is for.
+   * `scroll-skew` is one member; `flip-face` (`effects/three-d`) and `flip-3d`
+   * (`effects/catalog/core`, the `flip-in-*`/`flip-out-*` family) are the other two — both need
+   * the `perspective()` transform *function* for an element to have depth on itself, which
+   * likewise only exists inside `transform`.
+   */
+  skew: "skew"
+};
+function inertInstance(destroy = () => {
+}) {
+  return {
+    activate() {
+    },
+    cancel() {
+    },
+    finish() {
+    },
+    finished: Promise.resolve(),
+    destroy
+  };
+}
+var SEGMENT_HOIST_KEYS = [
+  "activation",
+  "actions",
+  "timeline",
+  "threshold",
+  "cascade",
+  "spread",
+  "order",
+  "cols",
+  "along"
+];
+
+// src/core/registry.ts
+var Registry = class {
+  primitives = /* @__PURE__ */ new Map();
+  presets = /* @__PURE__ */ new Map();
+  /** Sorted-name key → preset that renders that combination as one tested keyframe. */
+  combos = /* @__PURE__ */ new Map();
+  registerPrimitive(primitive) {
+    if (this.primitives.has(primitive.id)) {
+      throw new Error(`kuinetic: primitive "${primitive.id}" is already registered`);
+    }
+    this.primitives.set(primitive.id, namespaceTiming(primitive));
+    return this;
+  }
+  registerPreset(preset) {
+    if (this.presets.has(preset.name)) {
+      throw new Error(`kuinetic: effect "${preset.name}" is already registered`);
+    }
+    if (!this.primitives.has(preset.primitive)) {
+      throw new Error(
+        `kuinetic: effect "${preset.name}" references unknown primitive "${preset.primitive}"`
+      );
+    }
+    for (const segment of preset.transitions ?? []) {
+      if (segment.property === "all" || segment.property === "none") {
+        throw new Error(
+          `kuinetic: effect "${preset.name}" declares a transition on "${segment.property}", which would swallow every other preset's segment in the merged transition list \u2014 name the real property instead`
+        );
+      }
+    }
+    this.presets.set(preset.name, preset);
+    return this;
+  }
+  registerPresets(presets) {
+    for (const preset of presets) this.registerPreset(preset);
+    return this;
+  }
+  registerPrimitives(primitives) {
+    for (const primitive of primitives) this.registerPrimitive(primitive);
+    return this;
+  }
+  /**
+   * Declare that a set of effect names has a purpose-built single-keyframe implementation.
+   * Checked before channel conflict analysis, so `fade-up` + `blur-in` can resolve to the
+   * tested `fade-blur-up` rather than being rejected for both writing `opacity`.
+   */
+  registerCombo(names, presetName) {
+    this.combos.set(comboKey(names), presetName);
+    return this;
+  }
+  resolve(name) {
+    const preset = this.presets.get(name);
+    if (!preset) return void 0;
+    const primitive = this.primitives.get(preset.primitive);
+    return { preset, primitive };
+  }
+  findCombo(names) {
+    const comboName = this.combos.get(comboKey(names));
+    return comboName ? this.resolve(comboName) : void 0;
+  }
+  has(name) {
+    return this.presets.has(name);
+  }
+  /** All registered effect names, for docs generation and dev-mode "did you mean" hints. */
+  names() {
+    return [...this.presets.keys()].sort((a, b) => a.localeCompare(b));
+  }
+  getPrimitive(id) {
+    return this.primitives.get(id);
+  }
+};
+var TIMING_PARAMS = ["duration", "delay", "ease"];
+function timingProperty(primitiveId, name) {
+  return `--kui-${primitiveId}-${name}`;
+}
+function namespaceTiming(primitive) {
+  const parameters = { ...primitive.parameters };
+  for (const name of TIMING_PARAMS) {
+    const spec = parameters[name];
+    if (spec) parameters[name] = { ...spec, cssProperty: timingProperty(primitive.id, name) };
+  }
+  return { ...primitive, parameters };
+}
+function comboKey(names) {
+  return [...names].sort((a, b) => a.localeCompare(b)).join("+");
+}
+function suggest(name, candidates) {
+  let best;
+  let bestScore = Infinity;
+  for (const candidate of candidates) {
+    const score = distance(name, candidate);
+    if (score < bestScore) {
+      bestScore = score;
+      best = candidate;
+    }
+  }
+  return bestScore <= Math.max(2, Math.floor(name.length / 3)) ? best : void 0;
+}
+function distance(a, b) {
+  const rows = a.length + 1;
+  const cols = b.length + 1;
+  let prev = Array.from({ length: cols }, (_, i) => i);
+  for (let i = 1; i < rows; i++) {
+    const curr = [i, ...Array(cols - 1).fill(0)];
+    for (let j = 1; j < cols; j++) {
+      const cost = a[i - 1] === b[j - 1] ? 0 : 1;
+      curr[j] = Math.min(curr[j - 1] + 1, prev[j] + 1, prev[j - 1] + cost);
+    }
+    prev = curr;
+  }
+  return prev[cols - 1];
+}
+
+// src/core/breakpoints.ts
+var BREAKPOINTS = {
+  sm: "40rem",
+  md: "48rem",
+  lg: "64rem",
+  xl: "80rem",
+  "2xl": "96rem"
+};
+var BREAKPOINT_NAMES = Object.keys(BREAKPOINTS);
+var GATE_AXES = [
+  ["above", "below"],
+  ["wide", "narrow"]
+];
+function axisOf(direction) {
+  return GATE_AXES.find((axis) => axis.includes(direction));
+}
+function isBreakpoint(value) {
+  return Object.hasOwn(BREAKPOINTS, value);
+}
+function breakpointRank(name) {
+  return BREAKPOINT_NAMES.indexOf(name);
+}
+function gateProperty(direction, breakpoint) {
+  return `--kui-${direction}-${breakpoint}`;
+}
+function breakpointQuery(breakpoint) {
+  return `(min-width: ${BREAKPOINTS[breakpoint]})`;
+}
+function gatedAnimationName(keyframes, gate) {
+  if (!gate) return keyframes;
+  let expression = keyframes;
+  if (gate.narrow) expression = `var(${gateProperty("narrow", gate.narrow)}, ${expression})`;
+  if (gate.wide) expression = `var(${gateProperty("wide", gate.wide)}, ${expression})`;
+  if (gate.below) expression = `var(${gateProperty("below", gate.below)}, ${expression})`;
+  if (gate.above) expression = `var(${gateProperty("above", gate.above)}, ${expression})`;
+  return expression;
+}
+function gateMatches(gate, win) {
+  if (!gate) return true;
+  if (typeof win?.matchMedia !== "function") return true;
+  const atLeast = (breakpoint) => win.matchMedia(breakpointQuery(breakpoint)).matches;
+  if (gate.above && !atLeast(gate.above)) return false;
+  if (gate.below && atLeast(gate.below)) return false;
+  return true;
+}
+function gatesOverlap(a, b) {
+  if (!a || !b) return true;
+  const span = (gate, [upper, lower]) => [
+    gate[upper] ? breakpointRank(gate[upper]) : -1,
+    gate[lower] ? breakpointRank(gate[lower]) : BREAKPOINT_NAMES.length
+  ];
+  const overlapsOn = (axis) => {
+    const [aStart, aEnd] = span(a, axis);
+    const [bStart, bEnd] = span(b, axis);
+    return aStart < bEnd && bStart < aEnd;
+  };
+  return GATE_AXES.every(overlapsOn);
+}
+function breakpointsIn(gates) {
+  const named = /* @__PURE__ */ new Set();
+  for (const gate of gates) {
+    if (gate.above) named.add(gate.above);
+    if (gate.below) named.add(gate.below);
+  }
+  return [...named];
+}
+function createGateWatcher(win, onChange) {
+  const watched = /* @__PURE__ */ new Map();
+  const bound = /* @__PURE__ */ new Map();
+  function bind(breakpoint) {
+    if (typeof win?.matchMedia !== "function" || bound.has(breakpoint)) return;
+    const query = win.matchMedia(breakpointQuery(breakpoint));
+    if (typeof query.addEventListener !== "function") return;
+    const handler = () => {
+      for (const [el, names] of [...watched]) {
+        if (names.includes(breakpoint)) onChange(el);
+      }
+    };
+    query.addEventListener("change", handler);
+    bound.set(breakpoint, () => query.removeEventListener("change", handler));
+  }
+  return {
+    watch(el, breakpoints) {
+      if (breakpoints.length === 0) {
+        watched.delete(el);
+        return;
+      }
+      watched.set(el, [...breakpoints]);
+      for (const breakpoint of breakpoints) bind(breakpoint);
+    },
+    unwatch(el) {
+      watched.delete(el);
+    },
+    destroy() {
+      for (const unbind of bound.values()) unbind();
+      bound.clear();
+      watched.clear();
+    }
+  };
+}
+
+// src/core/spring.ts
+var DEFAULT_SPRING = {
+  stiffness: 180,
+  damping: 24,
+  mass: 1,
+  restVelocity: 0.05,
+  restDisplacement: 0.05
+};
+var SUBSTEP = 1 / 240;
+var MAX_STEP = 0.25;
+function stepSpring(state, target, config, dt) {
+  let { value, velocity } = state;
+  let remaining = Math.min(Math.max(dt, 0), MAX_STEP);
+  while (remaining > 0) {
+    const step = Math.min(SUBSTEP, remaining);
+    const force = -config.stiffness * (value - target) - config.damping * velocity;
+    velocity += force / config.mass * step;
+    value += velocity * step;
+    remaining -= step;
+  }
+  return { value, velocity };
+}
+function isSettled(state, target, config) {
+  return Math.abs(state.velocity) < config.restVelocity && Math.abs(state.value - target) < config.restDisplacement;
+}
+var MAX_SETTLE_MS = 1e4;
+function createSpringRunner(config, onChange, deps) {
+  const safeConfig = validConfig(config) ? config : DEFAULT_SPRING;
+  if (safeConfig !== config) deps.warn?.("invalid spring configuration; using defaults");
+  let state = { value: 0, velocity: 0 };
+  let target = 0;
+  let handle = null;
+  let lastTime = 0;
+  let startedAt = 0;
+  function frame(time2) {
+    handle = null;
+    const dt = (time2 - lastTime) / 1e3;
+    lastTime = time2;
+    state = stepSpring(state, target, safeConfig, dt);
+    if (!finiteState(state) || !Number.isFinite(target)) {
+      abortRun("spring produced non-finite state");
+      return;
+    }
+    if (time2 - startedAt >= MAX_SETTLE_MS) {
+      abortRun(`spring exceeded ${MAX_SETTLE_MS}ms settle budget`);
+      return;
+    }
+    if (isSettled(state, target, safeConfig)) {
+      state = { value: target, velocity: 0 };
+      onChange(state.value, true);
+      return;
+    }
+    onChange(state.value, false);
+    schedule();
+  }
+  function schedule() {
+    if (handle !== null) return;
+    handle = deps.requestFrame(frame);
+  }
+  function start() {
+    startedAt = deps.now();
+    if (handle === null) lastTime = startedAt;
+    schedule();
+  }
+  function abortRun(message) {
+    state = { value: Number.isFinite(target) ? target : 0, velocity: 0 };
+    deps.warn?.(message);
+    onChange(state.value, true);
+  }
+  return {
+    to(next, velocity) {
+      target = next;
+      if (velocity !== void 0) state = { ...state, velocity };
+      start();
+    },
+    set(value, velocity = 0) {
+      state = { value, velocity };
+    },
+    current: () => ({ ...state }),
+    stop() {
+      if (handle !== null) deps.cancelFrame(handle);
+      handle = null;
+    }
+  };
+}
+function validConfig(config) {
+  return Object.values(config).every(Number.isFinite) && config.stiffness > 0 && config.damping > 0 && config.mass > 0 && config.restVelocity > 0 && config.restDisplacement > 0;
+}
+function finiteState(state) {
+  return Number.isFinite(state.value) && Number.isFinite(state.velocity);
+}
+function defaultSpringDeps() {
+  const raf = globalThis.requestAnimationFrame;
+  if (typeof raf !== "function") {
+    return {
+      requestFrame: (callback) => globalThis.setTimeout(() => callback(Date.now()), 16),
+      cancelFrame: (handle) => globalThis.clearTimeout(handle),
+      now: () => Date.now()
+    };
+  }
+  return {
+    requestFrame: (callback) => raf(callback),
+    cancelFrame: (handle) => globalThis.cancelAnimationFrame(handle),
+    now: () => performance.now()
+  };
+}
+
+// src/core/easing.ts
+var NATIVE_EASINGS = /* @__PURE__ */ new Set([
+  "linear",
+  "ease",
+  "ease-in",
+  "ease-out",
+  "ease-in-out",
+  "step-start",
+  "step-end"
+]);
+var SPRING_PREFIX = "spring(";
+var DEFAULT_RATIO = 2 / 3;
+var DEFAULT_STIFFNESS = 180;
+var DEFAULT_MASS = 1;
+var DEFAULT_DAMPING = 2 * DEFAULT_RATIO * Math.sqrt(DEFAULT_STIFFNESS * DEFAULT_MASS);
+var MIN_RATIO = 0.15;
+var MAX_RATIO = 4;
+var MAX_BOUNCE = 1 - MIN_RATIO;
+var PHYSICS_KEYS = ["stiffness", "damping", "mass"];
+var SPRING_KEYS = ["bounce", ...PHYSICS_KEYS];
+var SIM_STEP = 1 / 240;
+var MAX_SIM_STEPS = 4e4;
+var REST_DISPLACEMENT = 1e-3;
+var REST_VELOCITY = 1e-3;
+var MIN_SAMPLES = 16;
+var MAX_SAMPLES = 64;
+var SAMPLES_PER_PERIOD = 10;
+var PRECISION = 1e3;
+function isSpringToken(token) {
+  return token.startsWith(SPRING_PREFIX) && token.endsWith(")");
+}
+function cssEasingValue(easing) {
+  if (NATIVE_EASINGS.has(easing)) return easing;
+  if (isSpringToken(easing)) return springLinearCurve(springDampingRatio(easing));
+  if (easing.includes("(")) return easing;
+  return `var(--kui-ease-${easing}, ease-out)`;
+}
+var WAAPI_FALLBACK = "ease-out";
+function waapiEasingValue(easing, el, warn) {
+  if (!easing) return void 0;
+  if (NATIVE_EASINGS.has(easing)) return easing;
+  if (isSpringToken(easing)) return springLinearCurve(springDampingRatio(easing));
+  if (easing.includes("(")) return easing;
+  const defined = customEasing(easing, el);
+  if (defined) return defined;
+  warn(`easing "${easing}" has no --kui-ease-${easing} definition \u2014 using ${WAAPI_FALLBACK}`);
+  return WAAPI_FALLBACK;
+}
+function customEasing(name, el) {
+  const view = el.ownerDocument.defaultView;
+  if (!view) return "";
+  return view.getComputedStyle(el).getPropertyValue(`--kui-ease-${name}`).trim();
+}
+function springTokenProblems(token) {
+  if (!isSpringToken(token)) return [];
+  const { values, problems } = readArguments(token);
+  resolveRatio(values, problems);
+  return problems;
+}
+function springDampingRatio(token) {
+  const { values, problems } = readArguments(token);
+  return resolveRatio(values, problems);
+}
+function readArguments(token) {
+  const values = /* @__PURE__ */ new Map();
+  const problems = [];
+  const body = token.slice(SPRING_PREFIX.length, -1).trim();
+  if (body) {
+    for (const part of body.split(/\s+/)) readArgument(part, values, problems);
+  }
+  return { values, problems };
+}
+function readArgument(part, values, problems) {
+  const colon = part.indexOf(":");
+  const key = colon < 0 ? part : part.slice(0, colon);
+  const raw = colon < 0 ? "" : part.slice(colon + 1);
+  if (!SPRING_KEYS.includes(key)) {
+    problems.push(`unknown spring parameter "${part}" \u2014 expected ${SPRING_KEYS.join(", ")}`);
+    return;
+  }
+  const numeric = Number(raw);
+  if (raw === "" || !Number.isFinite(numeric) || numeric < 0) {
+    problems.push(`spring "${key}" expects a non-negative number \u2014 got "${raw}"`);
+    return;
+  }
+  if (values.has(key)) problems.push(`duplicate spring parameter "${key}"`);
+  values.set(key, numeric);
+}
+function resolveRatio(values, problems) {
+  const bounce = values.get("bounce");
+  const hasPhysics = PHYSICS_KEYS.some((key) => values.has(key));
+  if (bounce !== void 0) {
+    if (hasPhysics) {
+      problems.push(
+        `spring "bounce" and "${PHYSICS_KEYS.join('"/"')}" describe the same curve two ways \u2014 "bounce" wins`
+      );
+    }
+    return 1 - clampBounce(bounce, problems);
+  }
+  if (!hasPhysics) return DEFAULT_RATIO;
+  const stiffness = values.get("stiffness") ?? DEFAULT_STIFFNESS;
+  const mass = values.get("mass") ?? DEFAULT_MASS;
+  const damping = values.get("damping") ?? DEFAULT_DAMPING;
+  return clampRatio(damping / (2 * Math.sqrt(stiffness * mass)), problems);
+}
+function clampBounce(bounce, problems) {
+  if (bounce <= MAX_BOUNCE) return bounce;
+  problems.push(
+    `spring "bounce:${bounce}" is past ${MAX_BOUNCE} \u2014 a spring that bouncy never settles inside one animation, so it is capped at ${MAX_BOUNCE}`
+  );
+  return MAX_BOUNCE;
+}
+function clampRatio(ratio, problems) {
+  if (!Number.isFinite(ratio)) {
+    problems.push("spring constants do not describe a spring \u2014 using the default curve");
+    return DEFAULT_RATIO;
+  }
+  if (ratio >= MIN_RATIO && ratio <= MAX_RATIO) return ratio;
+  const clamped = Math.min(Math.max(ratio, MIN_RATIO), MAX_RATIO);
+  problems.push(
+    `spring damping ratio ${round(ratio)} is outside ${MIN_RATIO}\u2013${MAX_RATIO} \u2014 clamped to ${round(clamped)} so the curve settles`
+  );
+  return clamped;
+}
+var curves = /* @__PURE__ */ new Map();
+function springLinearCurve(dampingRatio) {
+  const key = Math.round(dampingRatio * PRECISION);
+  const cached = curves.get(key);
+  if (cached !== void 0) return cached;
+  const curve = buildCurve(key / PRECISION);
+  curves.set(key, curve);
+  return curve;
+}
+function buildCurve(ratio) {
+  const trajectory = simulate(ratio);
+  const count = sampleCount(ratio, (trajectory.length - 1) * SIM_STEP);
+  const stops = [];
+  for (let index = 0; index <= count; index++) {
+    stops.push(String(round(sampleAt(trajectory, index / count))));
+  }
+  stops[0] = "0";
+  stops[count] = "1";
+  return `linear(${stops.join(", ")})`;
+}
+function simulate(ratio) {
+  const config = {
+    stiffness: 1,
+    damping: 2 * ratio,
+    mass: 1,
+    restVelocity: REST_VELOCITY,
+    restDisplacement: REST_DISPLACEMENT
+  };
+  const values = [0];
+  let state = { value: 0, velocity: 0 };
+  for (let step = 0; step < MAX_SIM_STEPS; step++) {
+    state = stepSpring(state, 1, config, SIM_STEP);
+    values.push(state.value);
+    if (isSettled(state, 1, config)) break;
+  }
+  return values;
+}
+function sampleCount(ratio, settleTime) {
+  if (ratio >= 1) return MIN_SAMPLES;
+  const period = 2 * Math.PI / Math.sqrt(1 - ratio * ratio);
+  const stops = MIN_SAMPLES + Math.round(SAMPLES_PER_PERIOD * settleTime / period);
+  return Math.min(stops, MAX_SAMPLES);
+}
+function sampleAt(values, fraction) {
+  const position = fraction * (values.length - 1);
+  const low = Math.floor(position);
+  const high = Math.min(low + 1, values.length - 1);
+  const start = values[low];
+  return start + (values[high] - start) * (position - low);
+}
+function round(value) {
+  return Math.round(value * PRECISION) / PRECISION;
+}
+
+// src/core/repeat.ts
+var INFINITE = "infinite";
+var COUNT_RE = /^(?:\d+(?:\.\d+)?|\.\d+)$/;
+var PROGRESS_DRIVEN = /* @__PURE__ */ new Set(["view", "scroll", "pin"]);
+var PLAYBACK_KEYS = /* @__PURE__ */ new Set(["repeat", "yoyo"]);
+function isPlaybackKey(key) {
+  return PLAYBACK_KEYS.has(key);
+}
+function applyPlayback(spec, key, value, context) {
+  if (spec[key] !== void 0) {
+    context.warn(`duplicate parameter "${key}" in "${context.segment}"`);
+  }
+  if (key === "yoyo") applyYoyo(spec, value, context);
+  else applyRepeat(spec, value, context);
+}
+function applyRepeat(spec, value, context) {
+  if (value === INFINITE) {
+    spec.repeat = INFINITE;
+    return;
+  }
+  if (!COUNT_RE.test(value)) {
+    context.warn(countRefusal(value, context.segment));
+    return;
+  }
+  if (Number(value) === 0) {
+    context.warn(
+      `"repeat:0" in "${context.segment}" means the effect never plays \u2014 with animation-fill-mode: both it jumps straight to its end state. Write "repeat:1" to play it once, or drop the key.`
+    );
+  }
+  spec.repeat = value;
+}
+function applyYoyo(spec, value, context) {
+  if (value !== "true" && value !== "false") {
+    context.warn(
+      `"yoyo:${value}" in "${context.segment}" is not a boolean \u2014 expected yoyo:true or yoyo:false`
+    );
+    return;
+  }
+  spec.yoyo = value === "true";
+}
+function countRefusal(value, segment) {
+  if (value.startsWith("-")) {
+    return `"repeat:${value}" in "${segment}" is negative \u2014 a play count cannot be. Write "repeat:infinite" to loop forever, or a non-negative number such as repeat:3.`;
+  }
+  return `"repeat:${value}" in "${segment}" is not a play count \u2014 expected a non-negative number such as repeat:3, or repeat:infinite`;
+}
+function resolvePlayback(input) {
+  const warnings = [];
+  if (input.repeat === void 0 && input.yoyo === void 0) return { warnings };
+  if (input.renderer !== "css-keyframes") return { warnings: [rendererRefusal(input)] };
+  if (input.repeat === INFINITE && PROGRESS_DRIVEN.has(input.timeline)) {
+    warnings.push(infiniteTimelineRefusal(input.name, input.timeline));
+    return { yoyo: input.yoyo, warnings };
+  }
+  const hidden = endsHidden(input);
+  if (hidden) warnings.push(hidden);
+  return { repeat: input.repeat, yoyo: input.yoyo, warnings };
+}
+function endsHidden(input) {
+  if (!input.cloak || input.yoyo !== true) return null;
+  const count = repeatCount(input.repeat);
+  if (count === void 0 || count === 0 || count % 2 !== 0) return null;
+  return `"${input.name}" with yoyo:true and an even repeat:${input.repeat} ends on a reversed iteration, and this effect's from-state is one the visitor is not meant to see \u2014 the element finishes hidden. Use an odd count (repeat:${count + 1}) to end at the rest state.`;
+}
+function rendererRefusal(input) {
+  const authored = [
+    input.repeat === void 0 ? "" : `repeat:${input.repeat}`,
+    input.yoyo === void 0 ? "" : `yoyo:${input.yoyo}`
+  ].filter(Boolean).join(" and ");
+  return `"${input.name}" is rendered in JavaScript and compiles no animation-iteration-count, so ${authored} does nothing \u2014 it plays once. Repeat is a CSS-keyframes capability; a JS-rendered effect that loops does it through a parameter of its own (typewriter's "loop:"), if it has one.`;
+}
+function infiniteTimelineRefusal(name, timeline) {
+  const because = timeline === "pin" ? `a pin scrubs a single playthrough with a negative animation-delay, so no iteration past the first is ever reachable` : `a "${timeline}" timeline is a finite range driven by scroll position rather than a clock, and an infinite iteration count collapses the animation's active duration to zero there \u2014 the element renders frozen at its end state`;
+  return `"${name}" has repeat:infinite on a "${timeline}" timeline: ${because}. Dropping the repeat, so it plays once across the range \u2014 put an infinite loop on a "time" timeline instead.`;
+}
+function repeatCount(repeat) {
+  if (repeat === void 0 || repeat === INFINITE) return void 0;
+  return Number(repeat);
+}
+function isInfiniteRepeat(repeat) {
+  return repeat === INFINITE;
+}
+function directionValue(yoyo) {
+  return yoyo ? "alternate" : "normal";
+}
+function playbackExpression(duration, repeat) {
+  const count = repeatCount(repeat);
+  if (count === void 0 || count === 1) return duration;
+  return `${duration} * ${count}`;
+}
+
+// src/core/toggle-actions.ts
+var CROSSINGS = ["enter", "leave", "enter-back", "leave-back"];
+var VERBS = /* @__PURE__ */ new Set([
+  "play",
+  "pause",
+  "resume",
+  "reverse",
+  "reset",
+  "restart",
+  "complete",
+  "none"
+]);
+var PLAYHEAD_VERBS = /* @__PURE__ */ new Set([
+  "pause",
+  "resume",
+  "reset",
+  "restart",
+  "complete"
+]);
+var SEPARATOR = "/";
+function parseToggleActions(value, warnings = []) {
+  const parts = value.split(SEPARATOR);
+  if (parts.length > CROSSINGS.length) {
+    warnings.push(
+      `"actions:${value}" has ${String(parts.length)} verbs \u2014 there are four crossings (${CROSSINGS.join(SEPARATOR)}), so the extras are ignored`
+    );
+  }
+  const actions = {
+    "enter": "none",
+    "leave": "none",
+    "enter-back": "none",
+    "leave-back": "none"
+  };
+  for (const [index, crossing] of CROSSINGS.entries()) {
+    const raw = parts[index]?.trim();
+    if (raw === void 0 || raw === "") continue;
+    actions[crossing] = toVerb(raw, crossing, warnings);
+  }
+  return actions;
+}
+function toVerb(raw, crossing, warnings) {
+  if (VERBS.has(raw)) return raw;
+  warnings.push(
+    `unrecognised action "${raw}" for the "${crossing}" crossing \u2014 expected ${[...VERBS].join(", ")}`
+  );
+  return "none";
+}
+function validateToggleActions(value) {
+  const warnings = [];
+  parseToggleActions(value, warnings);
+  return warnings;
+}
+function usesPlayhead(actions) {
+  for (const crossing of CROSSINGS) {
+    if (PLAYHEAD_VERBS.has(actions[crossing])) return actions[crossing];
+  }
+  return void 0;
+}
+function warnAboutToggleActions(request) {
+  if (!request.observed) {
+    return [
+      `"actions:" describes the four crossings of a scroll trigger, but this element activates on "${request.activation}" \u2014 nothing here is ever reached. Use on:enter or on:enter/leave`
+    ];
+  }
+  const verb = usesPlayhead(request.actions);
+  if (verb === void 0) return [];
+  const warnings = [];
+  if (request.progressDriven) {
+    warnings.push(
+      `"actions:" asks to ${verb} an element whose progress is driven by scroll position rather than by a clock \u2014 its playhead belongs to the scroller and would be overwritten on the next frame`
+    );
+  }
+  const js = request.jsEffectNames;
+  if (js.length > 0) {
+    const one = js.length === 1;
+    warnings.push(
+      `"actions:" asks to ${verb}, which needs a playhead, and "${js.join(" ")}" ${one ? "is" : "are"} rendered in JavaScript and expose${one ? "s" : ""} none \u2014 that crossing does nothing for ${one ? "it" : "them"}`
+    );
+  }
+  return warnings;
+}
+function applyToggleVerb(verb, target) {
+  if (verb === "play") target.activate();
+  else if (verb === "reverse") target.reverse();
+  else if (PLAYHEAD_VERBS.has(verb)) applyPlayheadVerb(verb, target);
+}
+function applyPlayheadVerb(verb, target) {
+  if (!target.started) {
+    if (startsIt(verb)) target.activate();
+    return;
+  }
+  if (verb === "restart" || verb === "complete") target.activate();
+  for (const control2 of target.controls) applyToPlayhead(verb, control2);
+}
+function startsIt(verb) {
+  return verb === "resume" || verb === "restart" || verb === "complete";
+}
+function applyToPlayhead(verb, control2) {
+  if (verb === "pause") control2.pause();
+  else if (verb === "resume") control2.resume();
+  else if (verb === "complete") control2.seek(1);
+  else {
+    control2.seek(0);
+    if (verb === "reset") control2.pause();
+    else control2.resume();
+  }
+}
+
+// src/core/parse.ts
+var TIME_RE = /^-?(?:\d+(?:\.\d+)?|\.\d+)(?:ms|s)$/;
+var EASING_FUNCTIONS = ["cubic-bezier(", "steps(", "linear(", "spring("];
+var EASING_KEYWORDS = /* @__PURE__ */ new Set([
+  "linear",
+  "ease",
+  "ease-in",
+  "ease-out",
+  "ease-in-out",
+  "step-start",
+  "step-end",
+  "expo-in",
+  "expo-out",
+  "expo-in-out",
+  "back-in",
+  "back-out",
+  "back-in-out",
+  "quart-out",
+  "circ-out",
+  "spring",
+  "bounce"
+]);
+function splitTopLevel(input, delimiter, warnings = []) {
+  const parts = [];
+  const scanner = { depth: 0, quote: null, escaped: false };
+  let buffer = "";
+  for (const char of input) {
+    if (isSeparator(char, delimiter, scanner)) {
+      if (buffer.trim()) parts.push(buffer.trim());
+      buffer = "";
+      continue;
+    }
+    buffer += char;
+  }
+  if (buffer.trim()) parts.push(buffer.trim());
+  if (scanner.quote) warnings.push(`unterminated ${scanner.quote} quote in "${input}"`);
+  else if (scanner.depth > 0) warnings.push(`unclosed "(" in "${input}"`);
+  return parts;
+}
+function isSeparator(char, delimiter, scanner) {
+  if (scanner.quote) return advanceQuote(char, scanner);
+  if (char === '"' || char === "'") {
+    scanner.quote = char;
+    return false;
+  }
+  if (char === "(") scanner.depth++;
+  else if (char === ")") scanner.depth = Math.max(0, scanner.depth - 1);
+  if (scanner.depth !== 0) return false;
+  return delimiter === " " ? /\s/.test(char) : char === delimiter;
+}
+function advanceQuote(char, scanner) {
+  if (scanner.escaped) scanner.escaped = false;
+  else if (char === "\\") scanner.escaped = true;
+  else if (char === scanner.quote) scanner.quote = null;
+  return false;
+}
+function splitPair(token) {
+  let depth = 0;
+  for (let i = 0; i < token.length; i++) {
+    const char = token[i];
+    if (char === "(") depth++;
+    else if (char === ")") depth = Math.max(0, depth - 1);
+    else if (char === ":" && depth === 0) {
+      const key = token.slice(0, i).trim();
+      const value = unquote(token.slice(i + 1).trim());
+      return key && value ? [key, value] : null;
+    }
+  }
+  return null;
+}
+function unquote(value) {
+  const first = value[0];
+  if ((first === '"' || first === "'") && value.endsWith(first) && value.length > 1) {
+    return value.slice(1, -1).replaceAll(`\\${first}`, first);
+  }
+  return value;
+}
+function parseActivationAttribute(input) {
+  const warnings = [];
+  const tokens = splitTopLevel(input ?? "", " ", warnings);
+  const [activation, ...options] = tokens;
+  if (!activation) return { warnings };
+  warnings.push(...validateActivation(activation));
+  let from;
+  for (const option of options) {
+    const pair = splitPair(option);
+    if (!pair || pair[0] !== "from") {
+      warnings.push(`unrecognised activation option "${option}"`);
+      continue;
+    }
+    if (from !== void 0) {
+      warnings.push(`duplicate activation option "from" in "${input}"`);
+      continue;
+    }
+    from = pair[1];
+  }
+  if (warnings.length > 0) return { warnings };
+  return { activation, ...from === void 0 ? {} : { from }, warnings };
+}
+function classify(token) {
+  const pair = splitPair(token);
+  if (pair) return { kind: "pair", key: pair[0], value: pair[1] };
+  if (TIME_RE.test(token)) return { kind: "time", value: token };
+  if (isEasing(token)) return { kind: "easing", value: token };
+  return { kind: "unknown", value: token };
+}
+function isEasing(token) {
+  if (EASING_KEYWORDS.has(token)) return true;
+  return EASING_FUNCTIONS.some((fn) => token.startsWith(fn) && token.endsWith(")"));
+}
+function parse(input) {
+  const result = { specs: [], warnings: [] };
+  for (const segment of splitTopLevel(input ?? "", ",", result.warnings)) {
+    const spec = parseSegment(segment, result);
+    if (spec) result.specs.push(spec);
+  }
+  return result;
+}
+function parseSegment(segment, result) {
+  const tokens = splitTopLevel(segment, " ", result.warnings);
+  const name = tokens.shift();
+  if (splitPair(name)) {
+    if (applyGroupOnlySegment(name, tokens, result)) return null;
+    result.warnings.push(`effect name expected, got "${name}"`);
+    return null;
+  }
+  const spec = { name, params: {} };
+  let timeCount = 0;
+  const sink = hasTargetToken(tokens) ? { specs: [], warnings: [] } : null;
+  for (const raw of tokens) {
+    const token = classify(raw);
+    if (token.kind === "time") timeCount = applyTime(spec, token.value, timeCount, result.warnings);
+    else applyToken(token, spec, { segment, result, sink });
+  }
+  attachSegmentHoists(spec, sink, result);
+  return spec;
+}
+function attachSegmentHoists(spec, sink, result) {
+  if (!sink) return;
+  result.warnings.push(...sink.warnings);
+  const hoists = collectHoists(sink);
+  if (hoists) spec.hoists = hoists;
+}
+function hasTargetToken(tokens) {
+  return tokens.some((t) => splitPair(t)?.[0] === "target");
+}
+function collectHoists(sink) {
+  const hoists = {};
+  let any = false;
+  for (const key of SEGMENT_HOIST_KEYS) {
+    const value = sink[key];
+    if (value === void 0) continue;
+    hoists[key] = value;
+    any = true;
+  }
+  return any ? hoists : void 0;
+}
+var SEGMENT_SCOPABLE_HOISTS = /* @__PURE__ */ new Set([
+  "on",
+  "actions",
+  "timeline",
+  "threshold",
+  "cascade",
+  "spread",
+  "order",
+  "cols",
+  "along"
+]);
+function applyGroupOnlySegment(first, rest, result) {
+  const pairs = [];
+  for (const token of [first, ...rest]) {
+    const pair = splitPair(token);
+    if (!pair || !GROUP_ONLY_HOISTS.has(pair[0]) || !Object.hasOwn(HOISTS, pair[0])) return false;
+    pairs.push(pair);
+  }
+  for (const [key, value] of pairs) HOISTS[key](result, value);
+  return true;
+}
+var GROUP_ONLY_HOISTS = /* @__PURE__ */ new Set([
+  "cascade",
+  "spread",
+  "order",
+  "cols",
+  "along"
+]);
+function applyTime(spec, value, seen, warnings) {
+  if (seen === 0) spec.duration = value;
+  else if (seen === 1) spec.delay = value;
+  else warnings.push(`third time value "${value}" ignored (expected duration then delay)`);
+  return seen + 1;
+}
+function applyToken(token, spec, context) {
+  const { segment, result, sink } = context;
+  if (token.kind === "easing") {
+    applyEasing(token.value, spec, segment, result);
+    return;
+  }
+  if (token.kind === "unknown") {
+    result.warnings.push(
+      `unrecognised token "${token.value}" in "${segment}" \u2014 expected [duration] [delay] [easing] or key:value`
+    );
+    return;
+  }
+  if (applyLifted(token.key, token.value, spec, context)) return;
+  if (Object.hasOwn(HOISTS, token.key)) {
+    const dest = sink && SEGMENT_SCOPABLE_HOISTS.has(token.key) ? sink : result;
+    HOISTS[token.key](dest, token.value);
+    return;
+  }
+  if (token.key in spec.params) {
+    result.warnings.push(`duplicate parameter "${token.key}" in "${segment}"`);
+  }
+  spec.params[token.key] = token.value;
+}
+function applyEasing(value, spec, segment, result) {
+  if (spec.easing) result.warnings.push(`duplicate easing "${value}" in "${segment}"`);
+  for (const problem of springTokenProblems(value)) {
+    result.warnings.push(`${problem} in "${segment}"`);
+  }
+  spec.easing = value;
+}
+function applyLifted(key, value, spec, context) {
+  const { segment, result } = context;
+  if (key === "at") {
+    if (spec.at !== void 0) result.warnings.push(`duplicate parameter "at" in "${segment}"`);
+    spec.at = value;
+    return true;
+  }
+  if (isGateDirection(key)) {
+    applyGate(spec, key, value, context);
+    return true;
+  }
+  if (isPlaybackKey(key)) {
+    applyPlayback(spec, key, value, {
+      segment,
+      warn: (message) => result.warnings.push(message)
+    });
+    return true;
+  }
+  return false;
+}
+var GATE_DIRECTIONS = /* @__PURE__ */ new Set(["above", "below", "wide", "narrow"]);
+function isGateDirection(key) {
+  return GATE_DIRECTIONS.has(key);
+}
+function applyGate(spec, direction, value, context) {
+  const { segment, result } = context;
+  if (!isBreakpoint(value)) {
+    result.warnings.push(
+      `unknown breakpoint "${value}" in "${segment}" \u2014 expected one of ${BREAKPOINT_NAMES.join(", ")}`
+    );
+    return;
+  }
+  const gate = spec.gate ??= {};
+  if (gate[direction] !== void 0) {
+    result.warnings.push(`duplicate parameter "${direction}" in "${segment}"`);
+  }
+  gate[direction] = value;
+  warnOnEmptyBand(gate, axisOf(direction), segment, result);
+}
+function warnOnEmptyBand(gate, axis, segment, result) {
+  const [upperName, lowerName] = axis;
+  const upperValue = gate[upperName];
+  const lowerValue = gate[lowerName];
+  if (!upperValue || !lowerValue || breakpointRank(upperValue) < breakpointRank(lowerValue)) return;
+  result.warnings.push(
+    `"${upperName}:${upperValue} ${lowerName}:${lowerValue}" in "${segment}" can never match \u2014 "${upperName}" must name a smaller breakpoint than "${lowerName}"`
+  );
+}
+var RM_POLICIES = /* @__PURE__ */ new Set(["shorten", "crossfade", "disable"]);
+var HOISTS = {
+  /**
+   * The activation list is open: any event type `addEventListener` accepts starts an animation,
+   * and `start/end` pairs it with an exit. So this no longer checks the value against a closed set
+   * of six names — `on:input` and `on:cart:updated` are both legitimate and unguessable from here.
+   *
+   * What it still rejects is text that cannot be an event type at all, because that is where the
+   * open list would otherwise turn a typo into silence rather than a warning. The complementary
+   * check — "this document has never heard of that event" — needs an element and lives in
+   * `animator.ts`.
+   */
+  on(result, value) {
+    const problems = validateActivation(value);
+    if (problems.length > 0) {
+      result.warnings.push(...problems);
+      return;
+    }
+    assignOnce(result, "activation", value, "activations");
+  },
+  timeline(result, value) {
+    assignOnce(result, "timeline", value, "timelines");
+  },
+  /**
+   * What to do at each of a scroll trigger's four crossings —
+   * `actions:play/pause/resume/reset`, in the order enter, leave, enter-back, leave-back.
+   *
+   * Element-scoped for `on:`'s reason and then some: it *refines* `on:`, and an element has one
+   * activation to refine. Validated here against the closed verb set, exactly as `rm:` is and for
+   * the same reason — there is nothing a later stage could know about the word `pasue` that this
+   * one does not. The checks that need the element's compiled plan (is this activation even
+   * observed? can these effects be paused at all?) live in `toggle-actions.ts` and run from
+   * `animator.ts`.
+   */
+  actions(result, value) {
+    const problems = validateToggleActions(value);
+    if (problems.length > 0) {
+      result.warnings.push(...problems);
+      return;
+    }
+    assignOnce(result, "actions", value, "crossing actions");
+  },
+  threshold(result, value) {
+    assignOnce(result, "threshold", value, "thresholds");
+  },
+  /**
+   * Deliberately unvalidated here. `data-kui-stagger` has always written its step straight into
+   * `--kui-stagger`, which is what makes `var(--speed)` and `calc(90ms * 2)` work today, and the
+   * two spellings have to accept the same values or "move it into `data-kui`" would silently be a
+   * narrowing. `stagger.ts` owns the one screen both spellings get.
+   */
+  cascade(result, value) {
+    warnStepMode(result, "spread", "cascade", value);
+    assignOnce(result, "cascade", value, "stagger steps");
+  },
+  /**
+   * The total-time spelling of the same setting — GSAP's `stagger.amount` beside `cascade`'s
+   * `stagger.each`. `cascade:50ms` on a 200-item list takes ten seconds; `spread:600ms` takes six
+   * hundred milliseconds however many items there are, because `stagger.ts` divides the budget by
+   * the group's largest rank.
+   *
+   * Unvalidated here for exactly `cascade`'s reason: the value is divided inside a `calc()` and
+   * written to `--kui-stagger`, so `var(--speed)` and `calc(1s - 200ms)` have to survive.
+   */
+  spread(result, value) {
+    warnStepMode(result, "cascade", "spread", value);
+    assignOnce(result, "spread", value, "stagger budgets");
+  },
+  /**
+   * Also unvalidated here, for a different reason: the legal set depends on the *group size*
+   * (`order:7` is in range for eight children and clamped for three), which only `stagger.ts`
+   * knows. Validating the keyword half here and the index half there would split one diagnostic
+   * across two modules.
+   */
+  order(result, value) {
+    assignOnce(result, "order", value, "stagger orders");
+  },
+  /**
+   * The group's column count, which is what makes `order:center` mean the middle *cell* rather than
+   * the middle *index*. Unvalidated here for `order`'s reason: `cols:auto` is only resolvable
+   * against a laid-out group, and the count that is legal depends on the group size, so the whole
+   * diagnostic lives in `stagger.ts` where both are known.
+   */
+  cols(result, value) {
+    assignOnce(result, "cols", value, "stagger column counts");
+  },
+  /**
+   * The axis a grid stagger is restricted to.
+   *
+   * Spelled `along:` rather than GSAP's `axis:` for the same reason `order:` is not `from:`: `axis`
+   * is a parameter on four primitives (`parallax`, `slat-assemble`, and both draggables) and a
+   * hoisted key never reaches `spec.params`, so lifting the word element-wide would make
+   * `data-kui="parallax-y axis:x"` unwritable. `data-kui-stagger` accepts both spellings.
+   */
+  along(result, value) {
+    assignOnce(result, "along", value, "stagger axes");
+  },
+  /**
+   * The one hoist that is not a move.
+   *
+   * `data-kui-rm` is *output*, not input: `style-plan.ts` stamps it from `plan.reducedMotion`,
+   * which `compile.ts` folds out of the composed primitives' own declared policies, and ~40
+   * selectors in `base.css` key on it. No author has ever written it, so there was nothing to
+   * hoist — what this adds is the ability to *choose* the policy, which the library had no
+   * spelling for at all. The stamped attribute keeps its exact meaning ("the policy in force
+   * here"), so every one of those selectors is untouched.
+   *
+   * Validated against the closed set here rather than in `compile.ts`, so a typo (`rm:disabled`)
+   * is named at the point the author's text is read, next to every other grammar diagnostic.
+   */
+  rm(result, value) {
+    if (!RM_POLICIES.has(value)) {
+      result.warnings.push(
+        `unrecognised "rm:${value}" \u2014 expected ${[...RM_POLICIES].join(", ")}`
+      );
+      return;
+    }
+    assignOnce(result, "rm", value, "reduced-motion policies");
+  },
+  /**
+   * The name of a global function to call when this element's effects finish.
+   *
+   * Element-scoped for the same reason `on:` is: one element has one lifecycle, so a second,
+   * different `func:` across the comma list would be describing a completion this element only
+   * reaches once. `assignOnce` names that conflict rather than letting token order pick a winner.
+   *
+   * Unvalidated here, and there is nothing useful to validate. `window['my-fn'] = …` is legal
+   * JavaScript, so an identifier-shaped regex would reject working names; and whether the name
+   * resolves at all depends on script order at *runtime*, which this module cannot see. `callback.ts`
+   * owns the lookup, the `typeof` check, and the one diagnostic — see the security note at the top
+   * of that file before putting `func:` anywhere a CMS field can reach.
+   */
+  func(result, value) {
+    assignOnce(result, "func", value, "callbacks");
+  }
+};
+function warnStepMode(result, other, key, value) {
+  const written = result[other];
+  if (written === void 0) return;
+  result.warnings.push(
+    `"${other}:${written}" and "${key}:${value}" are two ways to set one stagger step \u2014 the total budget ("spread:") wins`
+  );
+}
+function assignOnce(result, key, value, label) {
+  const current = result[key];
+  if (current === void 0) {
+    result[key] = value;
+    return;
+  }
+  if (current !== value) {
+    result.warnings.push(`conflicting ${label} "${String(current)}" and "${String(value)}"`);
+  }
+}
+
+// src/core/play.ts
+function resolveTargets(target, root) {
+  if (typeof target === "string") return [...root.querySelectorAll(target)];
+  if (target instanceof Element) return [target];
+  return [...target];
+}
+function time(value) {
+  if (value === void 0) return void 0;
+  return typeof value === "number" ? `${value}ms` : value;
+}
+var STRUCTURAL_RE = /[\s,()"']/;
+function quoteIfNeeded(value) {
+  if (!STRUCTURAL_RE.test(value)) return value;
+  const escaped = value.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+  return `"${escaped}"`;
+}
+function hasTopLevelColon(value) {
+  let depth = 0;
+  for (const char of value) {
+    if (char === "(") depth++;
+    else if (char === ")") depth = Math.max(0, depth - 1);
+    else if (char === ":" && depth === 0) return true;
+  }
+  return false;
+}
+function assertBareToken(label, value) {
+  const warnings = [];
+  const bySpace = splitTopLevel(value, " ", warnings);
+  const byComma = splitTopLevel(value, ",", warnings);
+  const isSingleToken = bySpace.length === 1 && bySpace[0] === value;
+  const safe = warnings.length === 0 && isSingleToken && byComma.length === 1 && !hasTopLevelColon(value);
+  if (!safe) {
+    throw new Error(
+      `play(): ${label} "${value}" cannot be serialized \u2014 it contains a space, comma, colon, quote, or unbalanced parenthesis the parser cannot read back as one token`
+    );
+  }
+}
+function toAttributeValue(effect, options = {}) {
+  assertBareToken("effect", effect);
+  const { duration, delay, ease, ...rest } = options;
+  delete rest.stagger;
+  const parts = [effect];
+  const resolvedDelay = time(delay);
+  const resolvedDuration = time(duration);
+  if (resolvedDuration) {
+    assertBareToken("duration", resolvedDuration);
+    parts.push(resolvedDuration);
+  }
+  if (resolvedDelay) {
+    assertBareToken("delay", resolvedDelay);
+    parts.push(resolvedDuration ? resolvedDelay : `delay:${resolvedDelay}`);
+  }
+  if (ease) {
+    assertBareToken("easing", ease);
+    parts.push(ease);
+  }
+  for (const [key, value] of Object.entries(rest)) {
+    if (value === void 0) continue;
+    assertBareToken("parameter name", key);
+    parts.push(`${key}:${quoteIfNeeded(String(value))}`);
+  }
+  return parts.join(" ");
+}
+function play(request, options = {}) {
+  const { animator, root, target, effect } = request;
+  const elements = resolveTargets(target, root);
+  const stagger = time(options.stagger);
+  const source = toAttributeValue(effect, options);
+  for (const [index, el] of elements.entries()) {
+    if (stagger) {
+      ;
+      el.style.setProperty("--kui-stagger", stagger);
+      el.style.setProperty("--kui-i", String(index));
+    }
+    animator.reset(el);
+    if (!el.hasAttribute(ATTR.on)) el.setAttribute(ATTR.on, "manual");
+    el.setAttribute(ATTR.source, source);
+    animator.process(el);
+    animator.activate(el);
+  }
+  const instancesOf = (el) => [el, ...animator.derivedOf(el)].flatMap((each) => animator.stateOf(each)?.instances ?? []);
+  const finished = Promise.all(
+    elements.flatMap((el) => instancesOf(el).map((instance) => instance.finished))
+  ).then(() => void 0);
+  return {
+    elements,
+    finished,
+    cancel() {
+      for (const el of elements) animator.cancel(el);
+    },
+    finish() {
+      for (const el of elements) for (const instance of instancesOf(el)) instance.finish();
+    }
+  };
+}
+
+// src/core/control.ts
+var MEASURABLE_SPAN_MS = 0;
+function clamp01(value) {
+  return Math.min(1, Math.max(0, value));
+}
+function finiteMs(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : 0;
+}
+function endTimeOf(animation) {
+  return finiteMs(animation.effect?.getComputedTiming?.().endTime);
+}
+function spanOf(animations) {
+  let span = MEASURABLE_SPAN_MS;
+  for (const animation of animations) span = Math.max(span, endTimeOf(animation));
+  return span;
+}
+function mergePlayStates(states) {
+  if (states.length === 0) return "idle";
+  if (states.includes("running")) return "running";
+  if (states.includes("paused")) return "paused";
+  return states.every((state) => state === "finished") ? "finished" : "idle";
+}
+function quietly(operation) {
+  try {
+    operation();
+  } catch {
+  }
+}
+function createCssControl(animations, ledger) {
+  return {
+    pause() {
+      ledger.set("animation-play-state", "paused");
+    },
+    resume() {
+      ledger.set("animation-play-state", "running");
+    },
+    /**
+     * Flip this instance's playback rate and keep running — "turn around", whichever way it was
+     * going.
+     *
+     * No longer the route `ControlHandle.reverse()` takes, and deliberately so: that call is about
+     * the *element's* direction of travel, which only the animator owns, and it needs the absolute
+     * "play out to the from-state" of `EffectInstance.reverse` rather than this relative flip.
+     * Retained because `InstanceControl` is a published interface and this is the honest meaning of
+     * `reverse` at the level of one playhead — a caller holding a single instance's control has no
+     * element-wide direction to speak of.
+     */
+    reverse() {
+      for (const animation of animations()) quietly(() => animation.reverse());
+      ledger.set("animation-play-state", "running");
+    },
+    seek(progress) {
+      const list = animations();
+      const span = spanOf(list);
+      if (span === MEASURABLE_SPAN_MS) return;
+      const at = clamp01(progress) * span;
+      for (const animation of list) {
+        quietly(() => {
+          animation.currentTime = Math.min(at, endTimeOf(animation));
+        });
+      }
+    },
+    rate(playbackRate) {
+      for (const animation of animations()) animation.playbackRate = playbackRate;
+    },
+    get progress() {
+      const list = animations();
+      const span = spanOf(list);
+      if (span === MEASURABLE_SPAN_MS) return 0;
+      let at = 0;
+      for (const animation of list) at = Math.max(at, finiteMs(animation.currentTime));
+      return clamp01(at / span);
+    },
+    get playState() {
+      return mergePlayStates(animations().map((animation) => animation.playState));
+    }
+  };
+}
+function bindElement(animator, el) {
+  const state = animator.stateOf(el);
+  if (!state) {
+    return {
+      el,
+      controls: [],
+      unreachable: [],
+      refused: true,
+      note: "no kUInetic effect is installed on this element \u2014 it has no playhead to control"
+    };
+  }
+  if (state.progressDriven) {
+    return {
+      el,
+      controls: [],
+      unreachable: [...state.fxNames],
+      refused: true,
+      note: `"${state.fxNames.join(" ")}" is driven by scroll position rather than a clock, so its playhead belongs to the scroller \u2014 pausing or seeking it would be overwritten on the next frame`
+    };
+  }
+  const controls = state.instances.map((instance) => instance.control).filter((control2) => control2 !== void 0);
+  const unreachable = [...state.jsEffectNames];
+  if (unreachable.length === 0) return { el, controls, unreachable };
+  return {
+    el,
+    controls,
+    unreachable,
+    note: `"${unreachable.join(" ")}" ${unreachable.length === 1 ? "is" : "are"} rendered in JavaScript and expose${unreachable.length === 1 ? "s" : ""} no playhead, so pause, seek and timeScale do not reach ${unreachable.length === 1 ? "it" : "them"}`
+  };
+}
+function withDerived(animator, elements) {
+  const seen = /* @__PURE__ */ new Set();
+  const out = [];
+  for (const el of elements) {
+    for (const each of [el, ...animator.derivedOf(el)]) {
+      if (seen.has(each)) continue;
+      seen.add(each);
+      out.push(each);
+    }
+  }
+  return out;
+}
+function control(request) {
+  const { animator, root, target } = request;
+  const elements = resolveTargets(target, root);
+  const reach = withDerived(animator, elements);
+  const bounds = reach.map((el) => bindElement(animator, el));
+  for (const [index, bound] of bounds.entries()) {
+    if (bound.note) animator.reporter.warn(`control(): ${bound.note}`, reach[index]);
+  }
+  const each = (operation) => {
+    for (const bound of bounds) for (const instance of bound.controls) operation(instance);
+    return handle;
+  };
+  const reject2 = (call, value) => {
+    animator.reporter.warn(`control(): ${call} ignored \u2014 ${String(value)} is not a finite number`);
+    return handle;
+  };
+  const reverseAll = () => {
+    for (const bound of bounds) if (!bound.refused) animator.reverseFrom(bound.el);
+    return handle;
+  };
+  const handle = {
+    elements,
+    get uncontrolled() {
+      return bounds.flatMap((bound) => bound.unreachable);
+    },
+    pause: () => each((instance) => instance.pause()),
+    play: () => each((instance) => instance.resume()),
+    reverse: () => reverseAll(),
+    seek: (progress) => Number.isFinite(progress) ? each((instance) => instance.seek(progress)) : reject2("seek()", progress),
+    timeScale: (rate) => Number.isFinite(rate) ? each((instance) => instance.rate(rate)) : reject2("timeScale()", rate),
+    get progress() {
+      let lowest = 1;
+      let found = false;
+      for (const bound of bounds) {
+        for (const instance of bound.controls) {
+          lowest = Math.min(lowest, instance.progress);
+          found = true;
+        }
+      }
+      return found ? lowest : 0;
+    },
+    get state() {
+      return mergePlayStates(
+        bounds.flatMap((bound) => bound.controls.map((instance) => instance.playState))
+      );
+    }
+  };
+  return handle;
+}
+var KUI_EVENT = {
+  /** The element's effects have started. Fires once per activation. */
+  start: "kui:start",
+  /** Every finite effect on the element has completed. */
+  finish: "kui:finish",
+  /**
+   * The element has finished playing *backwards* and is sitting at its from-state again.
+   *
+   * A separate name rather than a second `kui:finish` with a different `reason`, because the
+   * commonest thing an author does with `kui:finish` is chain the next reveal off it, and a
+   * listener that has to remember to re-check `event.detail.reason` before doing so is a trap
+   * rather than an API — the one time they forget, a hover-out plays the next section in. Filtering
+   * by *name* is what `addEventListener` is for, and it is what a delegated document-level listener
+   * can do without reading the detail at all.
+   *
+   * The exit half of a paired activation (`data-kui-on="pointerenter/pointerleave"`) settles here,
+   * and so does a programmatic `control(el).reverse()`. Before this existed, a completed reverse
+   * dispatched nothing whatsoever, which left "the element is back where it started" the one
+   * lifecycle moment an author could only discover by polling `data-kui-state`.
+   */
+  reverseFinish: "kui:reverse-finish",
+  /** The element's effects were torn down or cancelled before completing. */
+  cancel: "kui:cancel"
+};
+function emitLifecycle(el, type, detail) {
+  const Ctor = el.ownerDocument?.defaultView?.CustomEvent ?? globalThis.CustomEvent;
+  if (typeof Ctor !== "function") return;
+  el.dispatchEvent(new Ctor(type, { detail, bubbles: true, composed: true }));
+}
+
+// src/core/params.ts
+var DANGEROUS = /[;<]|\/\*|url\s*\(|expression\s*\(|@import|image-set\s*\(/i;
+var ABSOLUTE_OR_PROTOCOL_RELATIVE = /^(?:[a-z][a-z0-9+.-]*:|[/\\]{2})/i;
+var MAX_VALUE_LENGTH = 200;
+var MAX_PATH_LENGTH = 2e3;
+var PATH_DATA = /^[MmZzLlHhVvCcSsQqTtAa0-9eE.,+\-\s]+$/;
+var NUM = String.raw`-?(?:\d+(?:\.\d+)?|\.\d+)`;
+var LENGTH_UNITS = "px|rem|em|vh|vw|vmin|vmax|ch|ex|cm|mm|in|pt|pc|q|%";
+var PATTERNS = {
+  length: new RegExp(`^(?:0|${NUM}(?:${LENGTH_UNITS}))$`, "i"),
+  time: new RegExp(`^${NUM}(?:ms|s)$`, "i"),
+  number: new RegExp(`^${NUM}$`),
+  percentage: new RegExp(`^${NUM}%$`),
+  angle: new RegExp(`^${NUM}(?:deg|rad|turn|grad)$`, "i")
+};
+var BARE_ANGLE = new RegExp(`^(${NUM})d?$`, "i");
+function withAngleUnit(value) {
+  const match = BARE_ANGLE.exec(value);
+  return match ? `${match[1]}deg` : value;
+}
+var BARE_NUMBER = /^([+-]?)(\d+(?:\.\d+)?|\.\d+)(?:e([+-]?\d+))?$/i;
+var HEX_COLOR = /^#[0-9a-f]{3,8}$/i;
+var COLOR_FUNCTIONS = /^(?:rgba?|hsla?|okl(?:ch|ab)|l(?:ch|ab)|color)\([^()]*\)$/i;
+var COLOR_KEYWORDS = /* @__PURE__ */ new Set([
+  // Lowercase throughout, matching how the only reader spells the lookup: `value.toLowerCase()`.
+  // CSS keywords are ASCII case-insensitive, so `Canvas`, `canvas` and `CANVAS` are one value.
+  "accentcolor",
+  "accentcolortext",
+  "activetext",
+  "buttonborder",
+  "buttonface",
+  "buttontext",
+  "canvas",
+  "canvastext",
+  "field",
+  "fieldtext",
+  "graytext",
+  "highlight",
+  "highlighttext",
+  "linktext",
+  "mark",
+  "marktext",
+  "selecteditem",
+  "selecteditemtext",
+  "visitedtext",
+  "transparent",
+  "currentcolor",
+  "aliceblue",
+  "antiquewhite",
+  "aqua",
+  "aquamarine",
+  "azure",
+  "beige",
+  "bisque",
+  "black",
+  "blanchedalmond",
+  "blue",
+  "blueviolet",
+  "brown",
+  "burlywood",
+  "cadetblue",
+  "chartreuse",
+  "chocolate",
+  "coral",
+  "cornflowerblue",
+  "cornsilk",
+  "crimson",
+  "cyan",
+  "darkblue",
+  "darkcyan",
+  "darkgoldenrod",
+  "darkgray",
+  "darkgreen",
+  "darkgrey",
+  "darkkhaki",
+  "darkmagenta",
+  "darkolivegreen",
+  "darkorange",
+  "darkorchid",
+  "darkred",
+  "darksalmon",
+  "darkseagreen",
+  "darkslateblue",
+  "darkslategray",
+  "darkslategrey",
+  "darkturquoise",
+  "darkviolet",
+  "deeppink",
+  "deepskyblue",
+  "dimgray",
+  "dimgrey",
+  "dodgerblue",
+  "firebrick",
+  "floralwhite",
+  "forestgreen",
+  "fuchsia",
+  "gainsboro",
+  "ghostwhite",
+  "gold",
+  "goldenrod",
+  "gray",
+  "green",
+  "greenyellow",
+  "grey",
+  "honeydew",
+  "hotpink",
+  "indianred",
+  "indigo",
+  "ivory",
+  "khaki",
+  "lavender",
+  "lavenderblush",
+  "lawngreen",
+  "lemonchiffon",
+  "lightblue",
+  "lightcoral",
+  "lightcyan",
+  "lightgoldenrodyellow",
+  "lightgray",
+  "lightgreen",
+  "lightgrey",
+  "lightpink",
+  "lightsalmon",
+  "lightseagreen",
+  "lightskyblue",
+  "lightslategray",
+  "lightslategrey",
+  "lightsteelblue",
+  "lightyellow",
+  "lime",
+  "limegreen",
+  "linen",
+  "magenta",
+  "maroon",
+  "mediumaquamarine",
+  "mediumblue",
+  "mediumorchid",
+  "mediumpurple",
+  "mediumseagreen",
+  "mediumslateblue",
+  "mediumspringgreen",
+  "mediumturquoise",
+  "mediumvioletred",
+  "midnightblue",
+  "mintcream",
+  "mistyrose",
+  "moccasin",
+  "navajowhite",
+  "navy",
+  "oldlace",
+  "olive",
+  "olivedrab",
+  "orange",
+  "orangered",
+  "orchid",
+  "palegoldenrod",
+  "palegreen",
+  "paleturquoise",
+  "palevioletred",
+  "papayawhip",
+  "peachpuff",
+  "peru",
+  "pink",
+  "plum",
+  "powderblue",
+  "purple",
+  "rebeccapurple",
+  "red",
+  "rosybrown",
+  "royalblue",
+  "saddlebrown",
+  "salmon",
+  "sandybrown",
+  "seagreen",
+  "seashell",
+  "sienna",
+  "silver",
+  "skyblue",
+  "slateblue",
+  "slategray",
+  "slategrey",
+  "snow",
+  "springgreen",
+  "steelblue",
+  "tan",
+  "teal",
+  "thistle",
+  "tomato",
+  "turquoise",
+  "violet",
+  "wheat",
+  "white",
+  "whitesmoke",
+  "yellow",
+  "yellowgreen"
+]);
+var EASING_KEYWORD = /^(?:linear|ease|step-start|step-end|spring|bounce|[a-z]+-(?:in|out|in-out))$/i;
+var EASING_FUNCTION = /^(?:cubic-bezier|steps|linear|spring)\([^()]*\)$/i;
+var UNION_GRAMMARS = {
+  "number|percentage": ["number", "percentage"],
+  "length|percentage": ["length", "percentage"],
+  "angle|keyword": ["angle"]
+};
+function grammarsFor(type) {
+  return UNION_GRAMMARS[type] ?? [type];
+}
+var CALC_TYPES = /* @__PURE__ */ new Set(["length", "percentage", "number"]);
+var BOUNDED_TYPES = /* @__PURE__ */ new Set(["number", "number|percentage"]);
+var CALC_CHARACTER = /^[\d.\s+\-*/%a-z,]$/i;
+var CUSTOM_PROPERTY_NAME = /^--[\w-]+$/;
+function validate(raw, spec) {
+  const value = raw.trim();
+  const rejection = screen(value, spec);
+  if (rejection) return rejection;
+  const word = checkKeywordHalf(value, spec);
+  if (word) return word;
+  if (spec.type === "text") return { value, ok: true };
+  if (spec.type === "path") return checkPath(value, spec);
+  const typed = normalise(value, spec.type);
+  if (isAcceptable(typed, spec.type)) return checkNumericConstraints(typed, spec);
+  return reject(spec, `not a valid ${describeType(spec)}`);
+}
+function checkKeywordHalf(value, spec) {
+  if (spec.type !== "keyword" && spec.type !== "angle|keyword") return null;
+  if (spec.keywords?.includes(value)) return { value, ok: true };
+  if (spec.type !== "keyword") return null;
+  return reject(spec, `expected one of ${spec.keywords?.join(", ") || "(none declared)"}`);
+}
+function normalise(value, type) {
+  if (type === "angle" || type === "angle|keyword") return withAngleUnit(value);
+  if (type === "number|percentage") return withoutPercentage(value);
+  return value;
+}
+function withoutPercentage(value) {
+  if (!PATTERNS.percentage.test(value)) return value;
+  return decimalNumber(value.slice(0, -1), -2) ?? value;
+}
+function decimalNumber(raw, shift = 0) {
+  const match = BARE_NUMBER.exec(raw);
+  if (!match || raw.length > MAX_VALUE_LENGTH) return void 0;
+  const [, sign, coefficient, exponent] = match;
+  const digits = coefficient.replace(".", "");
+  const dot = coefficient.indexOf(".");
+  const position = (dot < 0 ? digits.length : dot) + Number(exponent ?? 0) + shift;
+  if (Math.abs(position) + digits.length > 190) return void 0;
+  const padded = "0".repeat(Math.max(0, -position)) + digits + "0".repeat(Math.max(0, position - digits.length));
+  const split = Math.max(0, position);
+  const integer = padded.slice(0, split).replace(/^0+/, "") || "0";
+  const fraction = fractionalPart(padded, split);
+  return `${sign === "-" ? "-" : ""}${integer}${fraction}`;
+}
+function fractionalPart(digits, start) {
+  let end = digits.length;
+  while (end > start && digits[end - 1] === "0") end--;
+  return end > start ? "." + digits.slice(start, end) : "";
+}
+function isSafeCssValue(value) {
+  return value.length <= MAX_VALUE_LENGTH && !DANGEROUS.test(value);
+}
+function checkPath(value, spec) {
+  if (!PATH_DATA.test(value)) return reject(spec, "path data contains an unsupported character");
+  if (!/^[Mm]/.test(value)) return reject(spec, "path data must start with a moveto (M or m)");
+  return { value: `"${value}"`, ok: true };
+}
+function screen(value, spec) {
+  if (!value) return reject(spec, "empty value");
+  const limit = spec.type === "path" ? MAX_PATH_LENGTH : MAX_VALUE_LENGTH;
+  if (value.length > limit) {
+    return reject(spec, `value exceeds ${limit} characters`);
+  }
+  if (DANGEROUS.test(value)) return reject(spec, "value contains disallowed CSS syntax");
+  return null;
+}
+function isAcceptable(value, type) {
+  if (type === "color") return isColor(value);
+  if (type === "easing") return EASING_KEYWORD.test(value) || EASING_FUNCTION.test(value);
+  const grammars = grammarsFor(type);
+  if (grammars.some((grammar) => PATTERNS[grammar]?.test(value))) return true;
+  if (!grammars.some((grammar) => CALC_TYPES.has(grammar))) return false;
+  return isSafeCalc(value) && isWellFormedCalc(value);
+}
+function describeType(spec) {
+  if (spec.type === "angle|keyword") {
+    return `angle or one of ${spec.keywords?.join(", ") || "(none declared)"}`;
+  }
+  return spec.type.replace("|", " or ");
+}
+function isColor(value) {
+  return HEX_COLOR.test(value) || COLOR_FUNCTIONS.test(value) || COLOR_KEYWORDS.has(value.toLowerCase());
+}
+function isSameOriginPath(value) {
+  return !ABSOLUTE_OR_PROTOCOL_RELATIVE.test(value);
+}
+function checkNumericConstraints(value, spec) {
+  if (!BOUNDED_TYPES.has(spec.type)) return { value, ok: true };
+  const numeric = Number(value);
+  if (spec.finite && !Number.isFinite(numeric)) return reject(spec, "expected a finite number");
+  if (spec.integer && !Number.isInteger(numeric)) return reject(spec, "expected an integer");
+  if (spec.minimum !== void 0 && numeric < spec.minimum) {
+    return reject(spec, `expected at least ${spec.minimum}`);
+  }
+  if (spec.maximum !== void 0 && numeric > spec.maximum) {
+    return reject(spec, `expected at most ${spec.maximum}`);
+  }
+  return { value, ok: true };
+}
+function reject(spec, reason) {
+  return { value: spec.default, ok: false, reason };
+}
+function isSafeCalc(value) {
+  if (!value.startsWith("calc(") || !value.endsWith(")")) return false;
+  const end = value.length - 1;
+  let index = "calc(".length;
+  while (index < end) {
+    index = nextCalcToken(value, index, end);
+    if (index < 0) return false;
+  }
+  return true;
+}
+function nextCalcToken(value, index, end) {
+  if (value.startsWith("var(", index)) return consumeVar(value, index, end);
+  return CALC_CHARACTER.test(value[index]) ? index + 1 : -1;
+}
+function consumeVar(value, start, end) {
+  const close = value.indexOf(")", start + "var(".length);
+  if (close < 0 || close >= end) return -1;
+  const name = value.slice(start + "var(".length, close);
+  return CUSTOM_PROPERTY_NAME.test(name) ? close + 1 : -1;
+}
+function isWellFormedCalc(value) {
+  const body = value.slice("calc(".length, -1).trim();
+  return body !== "" && !/[+\-*/]$/.test(body);
+}
+function resolveParams(authored, schema, warn) {
+  const out = {};
+  for (const [key, raw] of Object.entries(authored)) {
+    const spec = Object.hasOwn(schema, key) ? schema[key] : void 0;
+    if (!spec) {
+      warn(`unknown parameter "${key}" (known: ${Object.keys(schema).join(", ") || "none"})`);
+      continue;
+    }
+    if (spec.type === "text") continue;
+    const result = validate(raw, spec);
+    if (!result.ok) {
+      warn(`parameter "${key}": ${result.reason} \u2014 got "${raw}", using default "${spec.default}"`);
+      continue;
+    }
+    out[spec.cssProperty] = cssValueFor(result.value, spec, key, warn);
+  }
+  return out;
+}
+function cssValueFor(value, spec, key, warn) {
+  if (spec.type !== "easing") return value;
+  for (const problem of springTokenProblems(value)) warn(`parameter "${key}": ${problem}`);
+  return cssEasingValue(value);
+}
+
+// src/core/js-params.ts
+var ABSOLUTE_BASIS = {
+  viewportWidth: 0,
+  viewportHeight: 0,
+  percentBasis: 0,
+  fontSize: 16,
+  rootFontSize: 16
+};
+var STATIC_UNITS = {
+  px: 1,
+  cm: 96 / 2.54,
+  mm: 96 / 25.4,
+  q: 96 / 101.6,
+  in: 96,
+  pt: 96 / 72,
+  pc: 16
+};
+var BASIS_UNITS = {
+  vh: (b) => b.viewportHeight / 100,
+  vw: (b) => b.viewportWidth / 100,
+  vmin: (b) => Math.min(b.viewportWidth, b.viewportHeight) / 100,
+  vmax: (b) => Math.max(b.viewportWidth, b.viewportHeight) / 100,
+  "%": (b) => b.percentBasis / 100,
+  em: (b) => b.fontSize,
+  rem: (b) => b.rootFontSize,
+  ch: (b) => b.fontSize * 0.5,
+  ex: (b) => b.fontSize * 0.5
+};
+var NUMBER_WITH_UNIT = /^(-?(?:\d+(?:\.\d+)?|\.\d+))([a-z%]*)$/i;
+function readParams(authored, schema, warn) {
+  const out = {};
+  for (const [name, spec] of Object.entries(schema)) out[name] = spec.default;
+  for (const [name, raw] of Object.entries(authored)) {
+    const spec = Object.hasOwn(schema, name) ? schema[name] : void 0;
+    if (!spec) {
+      warn(`unknown parameter "${name}" (known: ${Object.keys(schema).join(", ") || "none"})`);
+      continue;
+    }
+    const result = validate(raw, spec);
+    out[name] = result.value;
+    if (!result.ok) {
+      warn(`parameter "${name}": ${result.reason} \u2014 got "${raw}", using default "${spec.default}"`);
+    }
+  }
+  return out;
+}
+function toMilliseconds(value, fallback = 0) {
+  const parts = NUMBER_WITH_UNIT.exec(value.trim());
+  if (!parts) return fallback;
+  const amount = Number.parseFloat(parts[1]);
+  const unit = parts[2].toLowerCase();
+  if (unit === "ms") return amount;
+  if (unit === "s") return amount * 1e3;
+  return fallback;
+}
+function toPixels(value, basis, fallback = 0) {
+  const parts = NUMBER_WITH_UNIT.exec(value.trim());
+  if (!parts) return fallback;
+  const amount = Number.parseFloat(parts[1]);
+  const unit = parts[2].toLowerCase();
+  if (unit === "") return amount === 0 ? 0 : fallback;
+  const staticFactor = STATIC_UNITS[unit];
+  if (staticFactor !== void 0) return amount * staticFactor;
+  const basisFactor = BASIS_UNITS[unit];
+  return basisFactor ? amount * basisFactor(basis) : fallback;
+}
+function toNumber(value, fallback = 0) {
+  const parts = NUMBER_WITH_UNIT.exec(value.trim());
+  if (!parts) return fallback;
+  const amount = Number.parseFloat(parts[1]);
+  const unit = parts[2];
+  if (unit === "") return amount;
+  if (unit === "%") return amount / 100;
+  return fallback;
+}
+var EASING_SPEC = { type: "easing", default: "", cssProperty: "--kui-ease" };
+function timingMs(raw, label, warn) {
+  if (raw === void 0) return void 0;
+  const ms = toMilliseconds(raw, Number.NaN);
+  if (Number.isFinite(ms)) return ms;
+  warn(`${label} "${raw}" is not a valid time \u2014 ignored`);
+  return void 0;
+}
+function timingEasing(raw, warn) {
+  if (raw === void 0) return void 0;
+  const result = validate(raw, EASING_SPEC);
+  if (result.ok) return result.value;
+  warn(`easing "${raw}": ${result.reason} \u2014 ignored`);
+  return void 0;
+}
+function readEffectTiming(spec, warn) {
+  return {
+    durationMs: timingMs(spec.duration, "duration", warn),
+    delayMs: timingMs(spec.delay, "delay", warn),
+    easing: timingEasing(spec.easing, warn)
+  };
+}
+function effectDurationMs(params, fallback) {
+  return params.timing.durationMs ?? params.ms("duration", fallback);
+}
+function createParams(values, timing = {}) {
+  return {
+    text: (name, fallback = "") => values[name] ?? fallback,
+    ms: (name, fallback = 0) => toMilliseconds(values[name] ?? "", fallback),
+    num: (name, fallback = 0) => toNumber(values[name] ?? "", fallback),
+    is: (name, value = "true") => (values[name] ?? "") === value,
+    timing
+  };
+}
+function readEffectParams(authored, schema, warn, timing = {}) {
+  return createParams(readParams(authored, schema, warn), timing);
+}
+
+// src/core/scroll-scheduler.ts
+function defaultDeps() {
+  const raf = globalThis.requestAnimationFrame;
+  if (typeof raf !== "function") {
+    return {
+      requestFrame: (callback) => globalThis.setTimeout(callback, 16),
+      cancelFrame: (handle) => globalThis.clearTimeout(handle)
+    };
+  }
+  return {
+    requestFrame: (callback) => raf(callback),
+    cancelFrame: (handle) => globalThis.cancelAnimationFrame(handle)
+  };
+}
+function createScrollScheduler(deps = defaultDeps()) {
+  const entries = /* @__PURE__ */ new Map();
+  let epoch = 0;
+  let pending = null;
+  function schedule(entry) {
+    if (entry) entry.dirty = true;
+    else for (const other of entries.values()) other.dirty = true;
+    if (pending !== null) return;
+    pending = deps.requestFrame(runFrame);
+  }
+  function runFrame() {
+    pending = null;
+    for (const entry of entries.values()) {
+      if (!entry.dirty || entry.subscribers.size === 0) continue;
+      entry.dirty = false;
+      const frame = { metrics: entry.root.metrics(), epoch };
+      for (const subscriber of [...entry.subscribers]) subscriber(frame);
+    }
+  }
+  function attach(root) {
+    const existing = entries.get(root.key);
+    if (existing) return existing;
+    const entry = { root, subscribers: /* @__PURE__ */ new Set(), detach: [], dirty: false };
+    entry.detach.push(root.onScroll(() => schedule(entry)));
+    entry.detach.push(
+      root.onResize(() => {
+        epoch++;
+        schedule();
+      })
+    );
+    entries.set(root.key, entry);
+    return entry;
+  }
+  function release(entry) {
+    if (entry.subscribers.size > 0) return;
+    for (const detach of entry.detach) detach();
+    entries.delete(entry.root.key);
+  }
+  return {
+    subscribe(root, onFrame) {
+      const entry = attach(root);
+      entry.subscribers.add(onFrame);
+      schedule(entry);
+      return () => {
+        entry.subscribers.delete(onFrame);
+        release(entry);
+      };
+    },
+    invalidate() {
+      epoch++;
+      schedule();
+    },
+    rootCount: () => entries.size,
+    destroy() {
+      if (pending !== null) deps.cancelFrame(pending);
+      pending = null;
+      for (const entry of entries.values()) {
+        entry.subscribers.clear();
+        for (const detach of entry.detach) detach();
+      }
+      entries.clear();
+    }
+  };
+}
+function windowScrollRoot(win) {
+  return {
+    key: "window",
+    metrics: () => ({
+      scrollTop: win.scrollY,
+      scrollLeft: win.scrollX,
+      viewportWidth: win.innerWidth,
+      viewportHeight: win.innerHeight,
+      viewportTop: 0,
+      viewportLeft: 0
+    }),
+    onScroll: (handler) => listen(win, "scroll", handler),
+    /*
+     * The document's own height counts as a resize, not just the window's.
+     *
+     * `elementScrollRoot` has observed its element's size since it was written, for the reason
+     * stated three doc comments down: "images loading, fonts swapping, a container changing size,
+     * or content being inserted". Every one of those applies at least as strongly to the page
+     * itself, and the page root was the one that only listened for `window.resize` — so on any
+     * document with lazy-loaded media below the fold, every cached content offset silently drifted
+     * by however much the page grew after it was measured, with no epoch bump to correct it.
+     *
+     * Measured on `demo/scroll.html` (32,000px of lazy screenshots): the horizontal track's stage
+     * moved ~840px between page load and reaching it, which is a third of that effect's whole
+     * scroll range. Nothing was wrong with the maths; the number it was doing the maths on was
+     * taken before forty images existed.
+     */
+    onResize: (handler) => observeSize(win.document.documentElement, win, handler)
+  };
+}
+function elementScrollRoot(el, win) {
+  return {
+    key: `el:${rootId(el)}`,
+    metrics: () => {
+      const rect = el.getBoundingClientRect();
+      return {
+        scrollTop: el.scrollTop,
+        scrollLeft: el.scrollLeft,
+        viewportWidth: el.clientWidth,
+        viewportHeight: el.clientHeight,
+        viewportTop: rect.top,
+        viewportLeft: rect.left
+      };
+    },
+    onScroll: (handler) => listen(el, "scroll", handler),
+    // Window resize alone misses the cases that actually invalidate a nested scroller: images
+    // loading, fonts swapping, a container changing size, or content being inserted.
+    onResize: (handler) => observeSize(el, win, handler)
+  };
+}
+function listen(target, type, handler) {
+  target.addEventListener(type, handler, { passive: true });
+  return () => target.removeEventListener(type, handler);
+}
+function observeSize(el, win, handler) {
+  const stopWindow = listen(win, "resize", handler);
+  if (typeof ResizeObserver === "undefined") return stopWindow;
+  const observer = new ResizeObserver(handler);
+  observer.observe(el);
+  return () => {
+    stopWindow();
+    observer.disconnect();
+  };
+}
+var nextRootId = 0;
+var rootIds = /* @__PURE__ */ new WeakMap();
+function rootId(el) {
+  const existing = rootIds.get(el);
+  if (existing) return existing;
+  const id = String(++nextRootId);
+  rootIds.set(el, id);
+  return id;
+}
+function createRootResolver(options) {
+  const { win } = options;
+  const isScrollable = options.isScrollable ?? defaultIsScrollable(win);
+  const windowRoot = windowScrollRoot(win);
+  return (el) => {
+    for (let node = el.parentElement; node; node = node.parentElement) {
+      if (isScrollable(node)) return elementScrollRoot(node, win);
+    }
+    return windowRoot;
+  };
+}
+var SCROLLABLE_OVERFLOW = /* @__PURE__ */ new Set(["auto", "scroll", "overlay"]);
+function defaultIsScrollable(win) {
+  return (el) => {
+    const style = win.getComputedStyle(el);
+    const vertical = SCROLLABLE_OVERFLOW.has(style.overflowY) && el.scrollHeight > el.clientHeight;
+    const horizontal = SCROLLABLE_OVERFLOW.has(style.overflowX) && el.scrollWidth > el.clientWidth;
+    return vertical || horizontal;
+  };
+}
+function clamp012(value) {
+  if (Number.isNaN(value)) return 0;
+  return Math.min(1, Math.max(0, value));
+}
+function createMeasureCache(measure) {
+  let cachedEpoch = -1;
+  let cached;
+  return {
+    read(epoch) {
+      if (cachedEpoch !== epoch || cached === void 0) {
+        cached = measure();
+        cachedEpoch = epoch;
+      }
+      return cached;
+    },
+    clear() {
+      cachedEpoch = -1;
+      cached = void 0;
+    }
+  };
+}
+
+// src/core/time-scale.ts
+var TIME_SCALE_ATTR = "data-kui-time-scale";
+function timeScaleOf(el) {
+  const host = el.closest(`[${TIME_SCALE_ATTR}]`);
+  const value = host?.getAttribute(TIME_SCALE_ATTR)?.trim();
+  if (!value) return 1;
+  const parsed = Number(value);
+  if (!Number.isFinite(parsed)) return 1;
+  return Math.min(4, Math.max(0.05, parsed));
+}
+
+// src/core/instances.ts
+function animationsOf(el) {
+  const getAnimations = el.getAnimations;
+  return typeof getAnimations === "function" ? getAnimations.call(el) : [];
+}
+function ownedAnimationsOf(el, names) {
+  return animationsOf(el).filter((animation) => {
+    const name = animation.animationName;
+    return typeof name === "string" && names.has(name);
+  });
+}
+function flushComputedAnimationName(el) {
+  return getComputedStyle(el).animationName;
+}
+function restartCssAnimation(el, ledger) {
+  const name = el.style.getPropertyValue("animation-name");
+  ledger.set("animation-name", "none");
+  flushComputedAnimationName(el);
+  ledger.set("animation-name", name);
+}
+function watchCompletion(animations, settle) {
+  if (animations.length === 0) {
+    settle();
+    return;
+  }
+  void Promise.all(animations.map((a) => a.finished.catch(() => void 0))).then(() => settle());
+}
+function startCssAnimations(el, ledger, ownedNames, activatedBefore) {
+  let animations = ownedAnimationsOf(el, ownedNames);
+  if (!activatedBefore) {
+    restartCssAnimation(el, ledger);
+    ledger.set("animation-play-state", "running");
+    animations = ownedAnimationsOf(el, ownedNames);
+    const scale = timeScaleOf(el);
+    if (scale !== 1) {
+      for (const animation of animations) animation.playbackRate = scale;
+    }
+    return animations;
+  }
+  const stale = animations.filter((animation) => animation.playState === "finished");
+  if (stale.length > 0) {
+    for (const animation of stale) animation.reverse();
+  } else {
+    ledger.set("animation-play-state", "running");
+  }
+  return animations;
+}
+function createCssInstance(el, ledger, animationNames, scrubbed = false) {
+  const ownedNames = new Set(animationNames);
+  let settle;
+  let finished = new Promise((resolve) => {
+    settle = resolve;
+  });
+  let activatedBefore = false;
+  const watch = (animations) => watchCompletion(animations, () => settle?.());
+  function drive(rate) {
+    if (scrubbed) return;
+    const animations = ownedAnimationsOf(el, ownedNames);
+    finished = new Promise((resolve) => {
+      settle = resolve;
+    });
+    for (const animation of animations) {
+      animation.playbackRate = rate * timeScaleOf(el);
+      animation.play();
+    }
+    ledger.set("animation-play-state", "running");
+    watch(animations);
+  }
+  return {
+    // Attached unconditionally, including for a scrubbed instance. Whether control is *allowed*
+    // here is a policy question about the element's timeline, not a capability question about this
+    // instance — a scrubbed animation has a perfectly real playhead, it just belongs to the
+    // scroller. Keeping that decision in one place (`InstanceState.progressDriven`, read by
+    // `control.ts`) beats splitting it across both files and letting them drift.
+    control: createCssControl(() => ownedAnimationsOf(el, ownedNames), ledger),
+    activate() {
+      finished = new Promise((resolve) => {
+        settle = resolve;
+      });
+      if (scrubbed) {
+        settle?.();
+        return;
+      }
+      const animations = startCssAnimations(el, ledger, ownedNames, activatedBefore);
+      activatedBefore = true;
+      watch(animations);
+    },
+    play() {
+      drive(1);
+    },
+    reverse() {
+      drive(-1);
+    },
+    cancel() {
+      for (const animation of ownedAnimationsOf(el, ownedNames)) animation.cancel();
+      settle?.();
+    },
+    finish() {
+      for (const animation of ownedAnimationsOf(el, ownedNames)) animation.finish();
+      settle?.();
+    },
+    get finished() {
+      return finished;
+    },
+    destroy() {
+      settle?.();
+    }
+  };
+}
+function continuousSetup(cleanup) {
+  return { cleanup, continuous: true };
+}
+function cleanupOf(result) {
+  if (result === void 0) return void 0;
+  return typeof result === "function" ? result : result.cleanup;
+}
+function deferredInstance(setup) {
+  let running;
+  let settle;
+  let finished = Promise.resolve();
+  const teardown = () => {
+    cleanupOf(running)?.();
+    running = void 0;
+    settle?.();
+  };
+  return createJsInstance({
+    activate() {
+      if (running !== void 0) teardown();
+      running = setup();
+      if (typeof running === "function" || "continuous" in running) return;
+      const work = running.finished;
+      finished = new Promise((resolve) => {
+        settle = resolve;
+      });
+      void work.then(() => settle?.());
+    },
+    cancel: teardown,
+    finish() {
+      if (typeof running === "object" && "finish" in running) running.finish?.();
+      settle?.();
+    },
+    destroy: teardown,
+    finished: () => finished,
+    // Only an explicit marker counts. A bare `Cleanup` deliberately does not — see
+    // `ContinuousSetup` above for why the two cannot be told apart by shape.
+    continuous: () => typeof running === "object" && "continuous" in running
+  });
+}
+function deferPrepare(setup) {
+  return (...args) => deferredInstance(() => setup(...args));
+}
+function createJsInstance(hooks) {
+  let active = false;
+  let run = 0;
+  return {
+    activate() {
+      if (active) return;
+      hooks.activate();
+      active = true;
+      const id = ++run;
+      if (hooks.continuous?.()) return;
+      void (hooks.finished?.() ?? Promise.resolve()).then(() => {
+        if (id === run) active = false;
+      });
+    },
+    cancel() {
+      hooks.cancel?.();
+      active = false;
+    },
+    finish() {
+      hooks.finish?.();
+    },
+    get finished() {
+      return hooks.finished?.() ?? Promise.resolve();
+    },
+    get continuous() {
+      return hooks.continuous?.() ?? false;
+    },
+    destroy() {
+      active = false;
+      hooks.destroy();
+    }
+  };
+}
+
+export {
+  selectorBreadth,
+  resolveTarget,
+  SCOPE_PARAM,
+  scopeParam,
+  queryScoped,
+  resolveActivationSpec,
+  startKindOf,
+  isOneShot,
+  createActivationBinder,
+  warnAboutActivation,
+  ATTR,
+  gatedAnimationName,
+  gateMatches,
+  gatesOverlap,
+  breakpointsIn,
+  createGateWatcher,
+  DEFAULT_SPRING,
+  createSpringRunner,
+  defaultSpringDeps,
+  cssEasingValue,
+  waapiEasingValue,
+  resolvePlayback,
+  repeatCount,
+  isInfiniteRepeat,
+  directionValue,
+  playbackExpression,
+  parseToggleActions,
+  warnAboutToggleActions,
+  applyToggleVerb,
+  CHANNEL,
+  inertInstance,
+  SEGMENT_HOIST_KEYS,
+  splitTopLevel,
+  parseActivationAttribute,
+  parse,
+  assignOnce,
+  Registry,
+  timingProperty,
+  suggest,
+  resolveTargets,
+  toAttributeValue,
+  play,
+  control,
+  KUI_EVENT,
+  emitLifecycle,
+  validate,
+  decimalNumber,
+  isSafeCssValue,
+  isSameOriginPath,
+  resolveParams,
+  ABSOLUTE_BASIS,
+  toMilliseconds,
+  toPixels,
+  readEffectTiming,
+  effectDurationMs,
+  readEffectParams,
+  createScrollScheduler,
+  createRootResolver,
+  clamp012 as clamp01,
+  createMeasureCache,
+  TIME_SCALE_ATTR,
+  timeScaleOf,
+  createCssInstance,
+  continuousSetup,
+  deferredInstance,
+  deferPrepare
+};