@yewdiel21/motion-kit 0.16.0 → 0.18.0

package/dist/{chunk-SDQ776LG.js → chunk-Q7IW4FV3.js}

@@ -2578,9 +2578,9 @@ function createSteps(root, options = {}) {
   registerMotion();
   const scope = createScope();
   const { duration = TIMING.onboarding.step, animateFirst = true, target = "[data-mk-flow-item]" } = options;
-  const clamp4 = (value) => Math.min(steps.length - 1, Math.max(0, Math.round(value)));
+  const clamp5 = (value) => Math.min(steps.length - 1, Math.max(0, Math.round(value)));
   const marked3 = steps.findIndex((step) => step.hasAttribute("data-mk-current"));
-  let index = clamp4(options.index ?? (marked3 >= 0 ? marked3 : 0));
+  let index = clamp5(options.index ?? (marked3 >= 0 ? marked3 : 0));
   let wanted = index;
   let running2 = null;
   let stopCounter = () => {
@@ -2633,7 +2633,7 @@ function createSteps(root, options = {}) {
     }
   };
   const goTo = (to) => {
-    wanted = clamp4(to);
+    wanted = clamp5(to);
     if (wanted === index && !running2) return Promise.resolve();
     running2 ??= change();
     return running2;
@@ -2700,7 +2700,7 @@ function createQuantity(root, options = {}) {
   const step = Number.isFinite(options.step) && options.step > 0 ? options.step : 1;
   const steps = Math.floor((max - min) / step + 1e-9);
   const upper = Math.min(max, Number((min + steps * step).toFixed(10)));
-  const normalize = (n) => Math.max(min, Math.min(upper, Number((min + Math.round((n - min) / step) * step).toFixed(10))));
+  const normalize3 = (n) => Math.max(min, Math.min(upper, Number((min + Math.round((n - min) / step) * step).toFixed(10))));
   const original = input.value;
   const disabled = options.disabled ?? input.disabled;
   const decrease = root.querySelector("[data-mk-quantity-decrease]");
@@ -2711,13 +2711,13 @@ function createQuantity(root, options = {}) {
   scope.attr(input, "disabled", disabled ? "" : null);
   scope.attr(root, "data-mk-ready", "");
   const initial = input.value.trim() ? Number(input.value) : NaN;
-  let value = normalize(Number.isFinite(options.value) ? options.value : Number.isFinite(initial) ? initial : min);
+  let value = normalize3(Number.isFinite(options.value) ? options.value : Number.isFinite(initial) ? initial : min);
   let pendingReset = null;
   const typed = () => input.value.trim() && Number.isFinite(input.valueAsNumber) ? input.valueAsNumber : NaN;
   const render = (syncInput = true) => {
     if (pendingReset) {
       if (pendingReset.eventPhase !== 0) return;
-      if (!pendingReset.defaultPrevented) value = normalize(Number.isFinite(typed()) ? typed() : min);
+      if (!pendingReset.defaultPrevented) value = normalize3(Number.isFinite(typed()) ? typed() : min);
       pendingReset = null;
     }
     if (syncInput) input.value = String(value);
@@ -2728,7 +2728,7 @@ function createQuantity(root, options = {}) {
     if (scope.disposed || !Number.isFinite(next)) return;
     if (pendingReset?.eventPhase === 0) pendingReset = null;
     const previous = value;
-    value = normalize(next);
+    value = normalize3(next);
     render(syncInput);
     if (notify && value !== previous) {
       options.onChange?.(value);
@@ -2744,7 +2744,7 @@ function createQuantity(root, options = {}) {
   });
   scope.on(input, "input", () => {
     const n = typed();
-    if (Number.isFinite(n) && normalize(n) === n) commit(n, true, false);
+    if (Number.isFinite(n) && normalize3(n) === n) commit(n, true, false);
   });
   scope.on(input, "change", () => {
     if (Number.isFinite(typed())) setValue(typed());
@@ -5905,8 +5905,8 @@ function createProgress(root, options = {}) {
   const max = finite(options.max) && options.max > min ? options.max : Math.max(min + 1, 100);
   const variant = options.variant === "ring" ? "ring" : "linear";
   const duration = finite(options.duration) ? Math.max(0, options.duration) : 0.7;
-  const clamp4 = (n) => Math.min(max, Math.max(min, n));
-  let value = options.value === null ? null : clamp4(finite(options.value) ? options.value : min);
+  const clamp5 = (n) => Math.min(max, Math.max(min, n));
+  let value = options.value === null ? null : clamp5(finite(options.value) ? options.value : min);
   const visual = document.createElement("span");
   visual.dataset.mkProgressVisual = "";
   visual.setAttribute("aria-hidden", "true");
@@ -6007,7 +6007,7 @@ function createProgress(root, options = {}) {
       if (scope.disposed) return;
       const previous = value;
       if (next === null) value = null;
-      else if (finite(next)) value = clamp4(next);
+      else if (finite(next)) value = clamp5(next);
       else return;
       render(previous, true);
     },
@@ -6055,13 +6055,13 @@ function createRangeSlider(root, options = {}) {
   const places = Math.min(10, Math.max(decimals(step), decimals(min)));
   const fix = (n) => Number(n.toFixed(places));
   const upper = Math.min(max, fix(min + Math.floor((max - min) / step + 1e-9) * step));
-  const normalize = (n) => Math.max(min, Math.min(upper, fix(min + Math.round((n - min) / step) * step)));
+  const normalize3 = (n) => Math.max(min, Math.min(upper, fix(min + Math.round((n - min) / step) * step)));
   const disabled = options.disabled ?? inputs.some((input) => input.disabled);
   const output = root.querySelector("[data-mk-range-output]");
   const format = (n) => options.formatValue ? options.formatValue(n) : String(n);
   const originals = inputs.map((input) => input.value);
   const ordered = (list3) => pair ? [...list3].sort((a, b) => a - b) : list3;
-  const read = () => inputs.map((input) => input.value.trim() !== "" && Number.isFinite(Number(input.value)) ? normalize(Number(input.value)) : NaN);
+  const read = () => inputs.map((input) => input.value.trim() !== "" && Number.isFinite(Number(input.value)) ? normalize3(Number(input.value)) : NaN);
   const authored = () => {
     const current4 = read();
     return inputs.map((input, i) => {
@@ -6069,7 +6069,7 @@ function createRangeSlider(root, options = {}) {
       if (written === void 0) return current4[i];
       const low = attrNumber(input, "min") ?? 0;
       const high = Math.max(low, attrNumber(input, "max") ?? 100);
-      return Number(input.value) === Math.min(high, Math.max(low, written)) ? normalize(written) : current4[i];
+      return Number(input.value) === Math.min(high, Math.max(low, written)) ? normalize3(written) : current4[i];
     });
   };
   const initial = (() => {
@@ -6078,7 +6078,7 @@ function createRangeSlider(root, options = {}) {
     const fromInputs = authored();
     return inputs.map((_, i) => {
       const candidate = fromOption?.[i];
-      if (finite2(candidate)) return normalize(candidate);
+      if (finite2(candidate)) return normalize3(candidate);
       return Number.isFinite(fromInputs[i]) ? fromInputs[i] : i === 0 ? min : upper;
     });
   })();
@@ -6188,7 +6188,7 @@ function createRangeSlider(root, options = {}) {
   };
   const take = (i) => {
     const raw = inputs[i].value;
-    const n = raw.trim() !== "" && Number.isFinite(Number(raw)) ? normalize(Number(raw)) : NaN;
+    const n = raw.trim() !== "" && Number.isFinite(Number(raw)) ? normalize3(Number(raw)) : NaN;
     if (!Number.isFinite(n)) return false;
     let next = n;
     if (pair) next = i === 0 ? Math.min(next, values[1]) : Math.max(next, values[0]);
@@ -6257,7 +6257,7 @@ function createRangeSlider(root, options = {}) {
     setValue(next, notify = true) {
       if (scope.disposed) return;
       const list3 = Array.isArray(next) ? next : [next, next];
-      const candidate = inputs.map((_, i) => finite2(list3[i]) ? normalize(list3[i]) : values[i]);
+      const candidate = inputs.map((_, i) => finite2(list3[i]) ? normalize3(list3[i]) : values[i]);
       values = ordered(candidate);
       render(dragging >= 0 ? "drag" : "glide");
       if (notify) commit(true);
@@ -6288,9 +6288,9 @@ function niceStep(raw) {
   const fraction = raw / power;
   return (fraction <= 1 ? 1 : fraction <= 2 ? 2 : fraction <= 2.5 ? 2.5 : fraction <= 5 ? 5 : 10) * power;
 }
-function barPath(x, width, base, end, rounded) {
+function barPath(x, width, base, end, rounded2) {
   const height = Math.abs(base - end);
-  const r = rounded ? Math.min(END_RADIUS, width / 2, height) : 0;
+  const r = rounded2 ? Math.min(END_RADIUS, width / 2, height) : 0;
   const dir = end < base ? 1 : -1;
   if (!r) return `M${round(x)},${round(base)}V${round(end)}H${round(x + width)}V${round(base)}Z`;
   return `M${round(x)},${round(base)}V${round(end + dir * r)}Q${round(x)},${round(end)} ${round(x + r)},${round(end)}H${round(x + width - r)}Q${round(x + width)},${round(end)} ${round(x + width)},${round(end + dir * r)}V${round(base)}Z`;
@@ -8684,13 +8684,13 @@ function createPasswordStrength(root, options = {}) {
   let lit = 0;
   const paint = (animate) => {
     const previous = lit;
-    const level = input.value ? Math.max(1, result.score) : 0;
-    lit = level;
+    const level2 = input.value ? Math.max(1, result.score) : 0;
+    lit = level2;
     scope.attr(root, "data-mk-score", input.value ? String(result.score) : null);
     const bars = segments.map((segment) => segment.firstElementChild);
-    if (!animate || reduced()) gsap.set(bars, { scaleX: (i) => i < level ? 1 : 0 });
-    else if (level > previous) keep(gsap.fromTo(bars.slice(previous, level), { scaleX: 0 }, { scaleX: 1, duration: 0.35, ease: EASE.swatch, stagger: 0.07 }));
-    else if (level < previous) keep(gsap.to(bars.slice(level, previous).reverse(), { scaleX: 0, duration: 0.2, ease: "power2.in", stagger: 0.04 }));
+    if (!animate || reduced()) gsap.set(bars, { scaleX: (i) => i < level2 ? 1 : 0 });
+    else if (level2 > previous) keep(gsap.fromTo(bars.slice(previous, level2), { scaleX: 0 }, { scaleX: 1, duration: 0.35, ease: EASE.swatch, stagger: 0.07 }));
+    else if (level2 < previous) keep(gsap.to(bars.slice(level2, previous).reverse(), { scaleX: 0, duration: 0.2, ease: "power2.in", stagger: 0.04 }));
     if (label.textContent !== result.label) {
       if (!animate || reduced()) label.textContent = result.label;
       else {
@@ -8982,8 +8982,8 @@ function createStarRating(root, options = {}) {
   const scope = createScope();
   const max = Math.max(1, Math.min(10, Math.round(Number.isFinite(options.max) ? options.max : 5)));
   const texts = options.labels ?? (max === 5 ? LABELS2 : []);
-  const clamp4 = (n) => Math.max(0, Math.min(max, n));
-  let value = clamp4(Number.isFinite(options.value) ? options.value : 0);
+  const clamp5 = (n) => Math.max(0, Math.min(max, n));
+  let value = clamp5(Number.isFinite(options.value) ? options.value : 0);
   const name = options.name ?? `rating-${++sequence10}`;
   const group = document.createElement("div");
   group.dataset.mkStars = "";
@@ -9071,7 +9071,7 @@ function createStarRating(root, options = {}) {
   };
   const choose = (next, notify, animate) => {
     if (scope.disposed) return;
-    const target = clamp4(Math.round(next));
+    const target = clamp5(Math.round(next));
     if (target === value) return;
     value = target;
     paint();
@@ -13778,8 +13778,8 @@ function createDateTimePicker(root, options = {}) {
   const segmentsOf2 = (date) => {
     if (!date) return { day: null, month: null, year: null, hour: null, minute: null, dayPeriod: null };
     const hour = date.getHours();
-    const clock = twelve ? to12(hour) : { hour, period: null };
-    return { day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear(), hour: clock.hour, minute: date.getMinutes(), dayPeriod: clock.period };
+    const clock2 = twelve ? to12(hour) : { hour, period: null };
+    return { day: date.getDate(), month: date.getMonth() + 1, year: date.getFullYear(), hour: clock2.hour, minute: date.getMinutes(), dayPeriod: clock2.period };
   };
   const dateOf2 = (values) => {
     const { day: day2, month, year, hour, minute } = values;
@@ -13828,18 +13828,18 @@ function createDateTimePicker(root, options = {}) {
   scope.on(box, "focusout", (event) => {
     if (!box.contains(event.relatedTarget) && field.element.hasAttribute("aria-invalid")) keep(shake(box));
   });
-  const rounded = (date) => {
+  const rounded2 = (date) => {
     const result = new Date(date.getTime());
     result.setSeconds(0, 0);
     result.setMinutes(Math.round(result.getMinutes() / step) * step);
     return result;
   };
-  const clamp4 = (date) => min && date < min ? new Date(min.getTime()) : max && date > max ? new Date(max.getTime()) : date;
+  const clamp5 = (date) => min && date < min ? new Date(min.getTime()) : max && date > max ? new Date(max.getTime()) : date;
   const timeOfDay = () => {
     if (value) return { hour: value.getHours(), minute: value.getMinutes() };
     const time2 = timeField.value?.split(":").map(Number);
     if (time2 && time2.length >= 2) return { hour: time2[0], minute: time2[1] };
-    const current3 = rounded(/* @__PURE__ */ new Date());
+    const current3 = rounded2(/* @__PURE__ */ new Date());
     return { hour: current3.getHours(), minute: current3.getMinutes() };
   };
   const calendar = createRangeCalendar(calendarHost, {
@@ -13855,7 +13855,7 @@ function createDateTimePicker(root, options = {}) {
       const { hour, minute } = timeOfDay();
       const next = new Date(range.start.getTime());
       next.setHours(hour, minute, 0, 0);
-      commit(clamp4(next), true);
+      commit(clamp5(next), true);
     }
   });
   scope.add(() => calendar.destroy());
@@ -13871,7 +13871,7 @@ function createDateTimePicker(root, options = {}) {
       const base = value ?? toDate(options.today ?? /* @__PURE__ */ new Date());
       const next = new Date(base.getTime());
       next.setHours(hour, minute, 0, 0);
-      commit(clamp4(next), true);
+      commit(clamp5(next), true);
     }
   });
   scope.add(() => timeField.destroy());
@@ -13905,7 +13905,7 @@ function createDateTimePicker(root, options = {}) {
   });
   scope.on(now2, "click", () => {
     keep(press(now2));
-    const current3 = rounded(/* @__PURE__ */ new Date());
+    const current3 = rounded2(/* @__PURE__ */ new Date());
     commit(problem(current3) ? value : current3, true);
     calendar.focusDay(current3, false);
   });
@@ -15393,15 +15393,15 @@ function createTreeView(root, options = {}) {
     item.setAttribute("aria-posinset", String(index + 1));
     item.tabIndex = -1;
     if (node.disabled) item.setAttribute("aria-disabled", "true");
-    const branch = isBranch(node);
-    if (branch) item.setAttribute("aria-expanded", String(expanded.has(node.id)));
+    const branch2 = isBranch(node);
+    if (branch2) item.setAttribute("aria-expanded", String(expanded.has(node.id)));
     if (!options.checkable && selected === node.id) item.setAttribute("aria-selected", "true");
     const line = document.createElement("div");
     line.dataset.mkTreeRow = "";
     line.style.setProperty("--mk-tree-depth", String(depth));
     const chevron2 = document.createElement("span");
     chevron2.dataset.mkTreeChevron = "";
-    if (branch) chevron2.innerHTML = CHEVRON3;
+    if (branch2) chevron2.innerHTML = CHEVRON3;
     line.append(chevron2);
     if (options.checkable) {
       const check2 = document.createElement("span");
@@ -15417,9 +15417,9 @@ function createTreeView(root, options = {}) {
       line.append(icon2);
     } else if (options.icons) {
       const icon2 = document.createElement("span");
-      if (branch) icon2.dataset.mkTreeFolder = "";
+      if (branch2) icon2.dataset.mkTreeFolder = "";
       else icon2.dataset.mkTreePage = "";
-      icon2.innerHTML = branch ? FOLDER : PAGE;
+      icon2.innerHTML = branch2 ? FOLDER : PAGE;
       line.append(icon2);
     }
     const label = document.createElement("span");
@@ -15427,7 +15427,7 @@ function createTreeView(root, options = {}) {
     fillLabel(node, label);
     line.append(label);
     item.append(line);
-    if (branch) {
+    if (branch2) {
       const group = document.createElement("ul");
       group.setAttribute("role", "group");
       group.hidden = !expanded.has(node.id);
@@ -21220,6 +21220,3884 @@ function createScrollIsland(root, options = {}) {
   };
 }
 
+// src/components/signature-pad/engine.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+var MAX_STROKES = 500;
+var MAX_POINTS = 5e4;
+var emptyData = () => ({ version: 1, strokes: [] });
+var cloneStrokes = (strokes) => strokes.map((stroke) => ({ ...stroke, points: stroke.points.map((point) => ({ ...point })) }));
+var sameStrokes = (left, right) => left.length === right.length && left.every((stroke, index) => {
+  const other = right[index];
+  return stroke.color === other.color && stroke.width === other.width && stroke.points.length === other.points.length && stroke.points.every((point, index2) => point.x === other.points[index2].x && point.y === other.points[index2].y);
+});
+var finite5 = (value) => typeof value === "number" && Number.isFinite(value);
+var clamp4 = (value, min, max) => Math.min(max, Math.max(min, value));
+function validColor(value) {
+  if (typeof value !== "string" || value.length > 100) return false;
+  if (/^#(?:[\da-f]{3,4}|[\da-f]{6}|[\da-f]{8})$/i.test(value)) return true;
+  if (!/^(?:rgba?|hsla?)\([\d\s.,%/+\-degratun]+\)$/i.test(value) && !/^[a-z]+$/i.test(value)) return false;
+  if (/^(?:inherit|initial|unset|revert|revertlayer|currentcolor)$/i.test(value)) return false;
+  if (typeof document === "undefined") return /^(?:black|white|transparent)$/i.test(value);
+  const probe = document.createElement("span");
+  probe.style.color = value;
+  return probe.style.color !== "";
+}
+function validatedData(value) {
+  if (!value || typeof value !== "object") return null;
+  const data = value;
+  if (data.version !== 1 || !Array.isArray(data.strokes) || data.strokes.length > MAX_STROKES) return null;
+  const strokes = [];
+  let count = 0;
+  for (const candidate of data.strokes) {
+    if (!candidate || typeof candidate !== "object") return null;
+    const stroke = candidate;
+    if (!validColor(stroke.color) || !finite5(stroke.width) || stroke.width < 0.1 || stroke.width > 64 || !Array.isArray(stroke.points) || !stroke.points.length) return null;
+    count += stroke.points.length;
+    if (count > MAX_POINTS) return null;
+    const points = [];
+    for (const candidate2 of stroke.points) {
+      if (!candidate2 || typeof candidate2 !== "object") return null;
+      const point = candidate2;
+      if (!finite5(point.x) || !finite5(point.y) || point.x < 0 || point.x > 1 || point.y < 0 || point.y > 1) return null;
+      points.push({ x: point.x, y: point.y });
+    }
+    strokes.push({ color: stroke.color, width: stroke.width, points });
+  }
+  return { version: 1, strokes };
+}
+var rounded = (value) => Number(value.toFixed(3));
+function strokePath(points, width, height) {
+  const coordinates = points.map((point) => [rounded(point.x * width), rounded(point.y * height)]);
+  const first = coordinates[0];
+  let path = `M ${first[0]} ${first[1]}`;
+  if (coordinates.length === 1) return `${path} l 0.001 0`;
+  for (let i = 1; i < coordinates.length - 1; i++) {
+    const current3 = coordinates[i];
+    const next = coordinates[i + 1];
+    path += ` Q ${current3[0]} ${current3[1]} ${rounded((current3[0] + next[0]) / 2)} ${rounded((current3[1] + next[1]) / 2)}`;
+  }
+  const last = coordinates[coordinates.length - 1];
+  return `${path} L ${last[0]} ${last[1]}`;
+}
+function makePath(stroke, width, height) {
+  const path = document.createElementNS(SVG_NS, "path");
+  path.setAttribute("d", strokePath(stroke.points, width, height));
+  path.setAttribute("fill", "none");
+  path.setAttribute("stroke", stroke.color);
+  path.setAttribute("stroke-width", String(stroke.width));
+  path.setAttribute("stroke-linecap", "round");
+  path.setAttribute("stroke-linejoin", "round");
+  return path;
+}
+var nextId2 = 0;
+function createSignaturePad(root, options = {}) {
+  if (!root) return inert({
+    data: emptyData(),
+    isEmpty: true,
+    canUndo: false,
+    canRedo: false,
+    undo() {
+    },
+    redo() {
+    },
+    clear() {
+    },
+    importData: () => false,
+    exportData: emptyData,
+    exportSVG: () => "",
+    exportPNG: async () => null,
+    setDisabled() {
+    },
+    setReadOnly() {
+    }
+  });
+  registerMotion();
+  const scope = createScope();
+  let strokes = validatedData(options.data)?.strokes ?? [];
+  const initialStrokes = cloneStrokes(strokes);
+  let disabled = Boolean(options.disabled);
+  let readOnly = Boolean(options.readOnly);
+  let undoStack = [];
+  let redoStack = [];
+  const historyLimit = finite5(options.historyLimit) ? clamp4(Math.floor(options.historyLimit), 1, 100) : 50;
+  const inkWidth = finite5(options.width) ? clamp4(options.width, 0.1, 64) : 2.4;
+  const exportData = () => ({ version: 1, strokes: cloneStrokes(strokes) });
+  const wrapper = document.createElement("div");
+  wrapper.dataset.mkSignatureBody = "";
+  const surface = document.createElement("div");
+  surface.dataset.mkSignatureSurface = "";
+  const svg2 = document.createElementNS(SVG_NS, "svg");
+  svg2.dataset.mkSignatureDrawing = "";
+  svg2.setAttribute("role", "img");
+  svg2.setAttribute("aria-label", options.label ?? "\xC1rea de firma");
+  svg2.setAttribute("preserveAspectRatio", "none");
+  const placeholder2 = document.createElement("span");
+  placeholder2.dataset.mkSignaturePlaceholder = "";
+  placeholder2.setAttribute("aria-hidden", "true");
+  placeholder2.textContent = options.placeholder ?? "Firma aqu\xED";
+  const pen = document.createElement("span");
+  pen.dataset.mkSignatureCursor = "";
+  pen.setAttribute("aria-hidden", "true");
+  const ghost = document.createElementNS(SVG_NS, "svg");
+  ghost.setAttribute("data-mk-signature-ghost", "");
+  ghost.setAttribute("aria-hidden", "true");
+  ghost.setAttribute("preserveAspectRatio", "none");
+  surface.append(svg2, ghost, placeholder2, pen);
+  const footer = document.createElement("div");
+  footer.dataset.mkSignatureFooter = "";
+  const toolbar = document.createElement("div");
+  toolbar.dataset.mkSignatureToolbar = "";
+  toolbar.setAttribute("role", "group");
+  toolbar.setAttribute("aria-label", "Herramientas de firma");
+  const makeButton = (action, text) => {
+    const button2 = document.createElement("button");
+    button2.type = "button";
+    button2.dataset.mkSignatureAction = action;
+    const paths = { undo: "M9 5 4 10l5 5M4 10h9a6 6 0 0 1 6 6", redo: "m15 5 5 5-5 5m5-5h-9a6 6 0 0 0-6 6", clear: "m9 5 1-2h4l1 2M4 6h16M7 6l1 15h8l1-15M10 10v7m4-7v7" };
+    button2.innerHTML = `<svg viewBox="0 0 24 24" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="${paths[action]}"/></svg>`;
+    const caption = document.createElement("span");
+    caption.textContent = text;
+    button2.append(caption);
+    toolbar.append(button2);
+    return button2;
+  };
+  const undoButton = makeButton("undo", "Deshacer");
+  const redoButton = makeButton("redo", "Rehacer");
+  const clearButton = makeButton("clear", "Limpiar");
+  if (options.toolbar !== false) footer.append(toolbar);
+  const status = document.createElement("span");
+  status.dataset.mkSignatureStatus = "";
+  status.setAttribute("role", "status");
+  status.setAttribute("aria-live", "polite");
+  const heading = document.createElement("div");
+  heading.dataset.mkSignatureHeader = "";
+  const title = document.createElement("span");
+  title.textContent = options.label ?? "Tu firma";
+  heading.append(title, status);
+  const hint = document.createElement("p");
+  hint.dataset.mkSignatureHint = "";
+  hint.id = `mk-signature-hint-${++nextId2}`;
+  hint.textContent = options.hint ?? "Dibuja con el rat\xF3n, el dedo o un l\xE1piz. Puedes deshacer cada trazo.";
+  svg2.setAttribute("aria-describedby", hint.id);
+  wrapper.append(heading, surface, footer, hint);
+  let hidden = null;
+  if (options.name) {
+    hidden = document.createElement("input");
+    hidden.type = "hidden";
+    hidden.name = options.name;
+    wrapper.append(hidden);
+  }
+  root.append(wrapper);
+  scope.add(() => wrapper.remove());
+  for (const name of ["data-mk-disabled", "data-mk-readonly", "data-mk-drawing", "data-mk-empty", "data-mk-pen-visible"]) scope.attr(root, name, null);
+  scope.attr(root, "data-mk-ready", "");
+  let dimensions = { width: 640, height: 240 };
+  let active = null;
+  const effects = /* @__PURE__ */ new Set();
+  const statusCount = document.createElement("span");
+  const statusLabel = document.createElement("span");
+  let shown4 = null;
+  const paintStatus = () => {
+    const count = strokes.length;
+    if (shown4 && shown4.count === count && shown4.readOnly === readOnly) return;
+    const before = shown4;
+    shown4 = { count, readOnly };
+    const animate = before !== null && !reduced();
+    if (!count) {
+      status.textContent = "Sin firma";
+      if (animate && before.count) keep(blurIn(status, { from: "soft", duration: 0.25 }));
+      return;
+    }
+    statusLabel.replaceChildren(statusCount, ` ${count === 1 ? "trazo" : "trazos"} \xB7 ${readOnly ? "Solo lectura" : "Firma capturada"}`);
+    status.replaceChildren(statusLabel);
+    if (animate && before.count) keep(rollDigits(statusCount, String(count), count > before.count ? 1 : -1, 0.3));
+    else {
+      statusCount.textContent = String(count);
+      if (animate) keep(blurIn(status, { from: "soft", duration: 0.25 }));
+    }
+  };
+  const keep = (effect) => {
+    for (const animation of effects) if (animation.totalProgress() === 1) effects.delete(animation);
+    if (effect) effects.add(effect);
+  };
+  const locked = () => disabled || readOnly;
+  const update = () => {
+    root.toggleAttribute("data-mk-empty", !strokes.length && !active);
+    root.toggleAttribute("data-mk-disabled", disabled);
+    root.toggleAttribute("data-mk-readonly", readOnly);
+    svg2.setAttribute("aria-disabled", String(disabled));
+    placeholder2.hidden = strokes.length > 0 || active !== null;
+    undoButton.disabled = locked() || !undoStack.length;
+    redoButton.disabled = locked() || !redoStack.length;
+    clearButton.disabled = locked() || !strokes.length;
+    paintStatus();
+    if (hidden) {
+      hidden.disabled = disabled;
+      hidden.value = JSON.stringify(exportData());
+    }
+  };
+  const render = () => {
+    const rect = surface.getBoundingClientRect();
+    if (rect.width > 0 && rect.height > 0) dimensions = { width: rect.width, height: rect.height };
+    svg2.setAttribute("viewBox", `0 0 ${dimensions.width} ${dimensions.height}`);
+    svg2.replaceChildren(...strokes.map((stroke) => makePath(stroke, dimensions.width, dimensions.height)));
+    if (active) {
+      active.path = makePath(active.stroke, dimensions.width, dimensions.height);
+      svg2.append(active.path);
+    }
+  };
+  const emit = (reason) => {
+    const detail = { data: exportData(), reason, isEmpty: !strokes.length, canUndo: !!undoStack.length, canRedo: !!redoStack.length };
+    options.onChange?.(exportData(), { ...detail, data: exportData() });
+    if (scope.disposed) return;
+    root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail }));
+  };
+  const release = (pointerId) => {
+    try {
+      surface.releasePointerCapture?.(pointerId);
+    } catch {
+    }
+  };
+  const cancel = () => {
+    if (!active) return;
+    const pointerId = active.pointerId;
+    active = null;
+    root.removeAttribute("data-mk-drawing");
+    release(pointerId);
+    render();
+    update();
+  };
+  const remember = () => {
+    undoStack.push(strokes);
+    if (undoStack.length > historyLimit) undoStack.shift();
+    redoStack = [];
+  };
+  const pulse = (button2) => {
+    keep(press(button2));
+    const icon2 = button2.querySelector("svg");
+    const turn = button2 === undoButton ? -50 : button2 === redoButton ? 50 : -14;
+    if (icon2 && !reduced()) keep(gsap.fromTo(icon2, { rotate: turn }, { rotate: 0, duration: 0.5, ease: EASE.click, overwrite: "auto", clearProps: "transform" }));
+  };
+  const wipeId = `mk-signature-wipe-${++nextId2}`;
+  let wipes = 0;
+  const animateInk = (before, reason) => {
+    if (reduced()) return;
+    const { width, height } = dimensions;
+    const byX = (a, b) => (a.points[0]?.x ?? 0) - (b.points[0]?.x ?? 0);
+    const removed = before.filter((stroke) => !strokes.includes(stroke)).sort(byX);
+    const added = strokes.filter((stroke) => !before.includes(stroke)).sort(byX);
+    ghost.setAttribute("viewBox", `0 0 ${width} ${height}`);
+    if (removed.length && reason === "clear") {
+      const svgNode = (tag, attributes) => {
+        const node = document.createElementNS(SVG_NS, tag);
+        for (const [name, value] of Object.entries(attributes)) node.setAttribute(name, String(value));
+        return node;
+      };
+      const points = removed.flatMap((stroke) => stroke.points);
+      const pad3 = inkWidth * 2 + 8;
+      const left = Math.min(...points.map((point) => point.x)) * width - pad3;
+      const right = Math.max(...points.map((point) => point.x)) * width + pad3;
+      const top = Math.max(0, Math.min(...points.map((point) => point.y)) * height - pad3);
+      const bottom = Math.min(height, Math.max(...points.map((point) => point.y)) * height + pad3);
+      const id = `${wipeId}-${++wipes}`;
+      const clip = svgNode("clipPath", { id });
+      const reveal = svgNode("rect", { x: left, y: 0, width: width * 2, height });
+      clip.append(reveal);
+      const ink = svgNode("g", { "clip-path": `url(#${id})` });
+      ink.append(...removed.map((stroke) => makePath(stroke, width, height)));
+      const edge = svgNode("rect", { x: left, y: top, width: 2, height: Math.max(24, bottom - top), rx: 1, fill: "currentColor", opacity: 0 });
+      ghost.append(clip, ink, edge);
+      const done = () => {
+        clip.remove();
+        ink.remove();
+        edge.remove();
+      };
+      const sweep = Math.min(0.6, Math.max(0.36, (right - left) / 900));
+      keep(gsap.timeline({ onComplete: done, onInterrupt: done }).to([reveal, edge], { attr: { x: right }, duration: sweep, ease: "power2.inOut" }, 0).to(edge, { opacity: 0.3, duration: 0.08 }, 0).to(edge, { opacity: 0, duration: 0.14 }, sweep - 0.12));
+    } else removed.forEach((stroke) => {
+      const path = makePath(stroke, width, height);
+      ghost.append(path);
+      const length = path.getTotalLength?.() ?? 0;
+      const done = () => path.remove();
+      if (!length) {
+        keep(gsap.to(path, { opacity: 0, duration: 0.25, onComplete: done }));
+        return;
+      }
+      path.style.strokeDasharray = `${length} ${length}`;
+      keep(gsap.timeline({ onComplete: done, onInterrupt: done }).fromTo(path, { strokeDashoffset: 0 }, { strokeDashoffset: length, duration: 0.5, ease: "power2.inOut" }, 0).to(path, { opacity: 0, duration: 0.16 }, 0.36));
+    });
+    const rendered = [...svg2.children];
+    added.forEach((stroke, index) => {
+      const path = rendered[strokes.indexOf(stroke)];
+      const length = path?.getTotalLength?.() ?? 0;
+      if (!path || !length) return;
+      path.style.strokeDasharray = `${length} ${length}`;
+      keep(gsap.fromTo(path, { strokeDashoffset: length }, { strokeDashoffset: 0, duration: 0.6, delay: Math.min(index * 0.08, 0.48), ease: EASE.wipe, clearProps: "strokeDasharray,strokeDashoffset" }));
+    });
+  };
+  const undo = () => {
+    if (scope.disposed) return;
+    cancel();
+    if (!undoStack.length) return;
+    const before = strokes;
+    redoStack.push(strokes);
+    strokes = undoStack.pop();
+    render();
+    update();
+    emit("undo");
+    animateInk(before, "undo");
+  };
+  const redo = () => {
+    if (scope.disposed) return;
+    cancel();
+    if (!redoStack.length) return;
+    const before = strokes;
+    undoStack.push(strokes);
+    strokes = redoStack.pop();
+    render();
+    update();
+    emit("redo");
+    animateInk(before, "redo");
+  };
+  const clear = () => {
+    if (scope.disposed) return;
+    cancel();
+    if (!strokes.length) return;
+    const before = strokes;
+    remember();
+    strokes = [];
+    render();
+    update();
+    emit("clear");
+    animateInk(before, "clear");
+  };
+  const form = hidden?.form;
+  if (form) scope.on(form, "reset", (event) => {
+    scope.timeout(() => {
+      if (scope.disposed || event.defaultPrevented || hidden?.form !== form) return;
+      const changed = !sameStrokes(strokes, initialStrokes);
+      cancel();
+      strokes = cloneStrokes(initialStrokes);
+      undoStack = [];
+      redoStack = [];
+      render();
+      update();
+      if (changed) emit("reset");
+    }, 0);
+  });
+  const pointFrom = (event) => {
+    const rect = surface.getBoundingClientRect();
+    if (!rect.width || !rect.height || !finite5(event.clientX) || !finite5(event.clientY)) return null;
+    return { x: clamp4((event.clientX - rect.left) / rect.width, 0, 1), y: clamp4((event.clientY - rect.top) / rect.height, 0, 1) };
+  };
+  const addPoint = (event) => {
+    if (!active) return;
+    const point = pointFrom(event);
+    if (!point || active.stroke.points.length >= MAX_POINTS - strokes.reduce((sum, stroke) => sum + stroke.points.length, 0)) return;
+    const last = active.stroke.points[active.stroke.points.length - 1];
+    if (point.x === last.x && point.y === last.y) return;
+    active.stroke.points.push(point);
+    active.path.setAttribute("d", strokePath(active.stroke.points, dimensions.width, dimensions.height));
+  };
+  scope.on(surface, "pointerdown", (event) => {
+    const pointer2 = event;
+    if (locked() || active || pointer2.button !== 0 || pointer2.isPrimary === false || strokes.length >= MAX_STROKES || strokes.reduce((sum, stroke2) => sum + stroke2.points.length, 0) >= MAX_POINTS) return;
+    const point = pointFrom(pointer2);
+    if (!point) return;
+    pointer2.preventDefault();
+    const themed = getComputedStyle(root).getPropertyValue("--mk-signature-ink").trim() || getComputedStyle(root).color;
+    const color = validColor(options.color) ? options.color : validColor(themed) ? themed : "#252735";
+    const stroke = { points: [point], color, width: inkWidth };
+    active = { pointerId: pointer2.pointerId, stroke, path: makePath(stroke, dimensions.width, dimensions.height) };
+    render();
+    update();
+    root.setAttribute("data-mk-drawing", "");
+    try {
+      surface.setPointerCapture?.(pointer2.pointerId);
+    } catch {
+    }
+  });
+  scope.on(window, "pointermove", (event) => {
+    const pointer2 = event;
+    if (!active || pointer2.pointerId !== active.pointerId) return;
+    pointer2.preventDefault();
+    const samples = typeof pointer2.getCoalescedEvents === "function" ? pointer2.getCoalescedEvents() : [];
+    for (const sample of samples) addPoint(sample);
+    addPoint(pointer2);
+  }, { passive: false });
+  scope.on(window, "pointerup", (event) => {
+    const pointer2 = event;
+    if (!active || pointer2.pointerId !== active.pointerId) return;
+    addPoint(pointer2);
+    const completed = active;
+    active = null;
+    root.removeAttribute("data-mk-drawing");
+    release(completed.pointerId);
+    remember();
+    strokes = [...strokes, completed.stroke];
+    update();
+    emit("draw");
+  });
+  for (const type of ["pointercancel", "lostpointercapture"]) scope.on(type === "pointercancel" ? window : surface, type, (event) => {
+    if (active?.pointerId === event.pointerId) cancel();
+  });
+  scope.on(window, "blur", cancel);
+  const movePen = (event) => {
+    const pointer2 = event;
+    const rect = surface.getBoundingClientRect();
+    root.toggleAttribute("data-mk-pen-visible", pointer2.pointerType !== "touch" && !locked());
+    pen.style.left = `${pointer2.clientX - rect.left}px`;
+    pen.style.top = `${pointer2.clientY - rect.top}px`;
+  };
+  scope.on(surface, "pointerenter", movePen);
+  scope.on(surface, "pointermove", movePen);
+  scope.on(surface, "pointerleave", () => root.removeAttribute("data-mk-pen-visible"));
+  scope.on(document, "visibilitychange", () => {
+    if (document.hidden) cancel();
+  });
+  for (const [button2, action] of [[undoButton, undo], [redoButton, redo], [clearButton, clear]]) scope.on(button2, "click", () => {
+    if (locked() || button2.disabled) return;
+    pulse(button2);
+    action();
+  });
+  if (typeof ResizeObserver === "function") scope.observe(new ResizeObserver(render)).observe(surface);
+  scope.on(window, "resize", render);
+  scope.add(() => {
+    cancel();
+    for (const effect of effects) effect.kill();
+  });
+  render();
+  update();
+  const exportSVG = (settings = {}) => {
+    const width = finite5(settings.width) ? clamp4(settings.width, 1, 4096) : dimensions.width;
+    const height = finite5(settings.height) ? clamp4(settings.height, 1, 4096) : dimensions.height;
+    const output = document.createElementNS(SVG_NS, "svg");
+    output.setAttribute("width", String(rounded(width)));
+    output.setAttribute("height", String(rounded(height)));
+    output.setAttribute("viewBox", `0 0 ${width} ${height}`);
+    if (validColor(settings.background)) {
+      const background = document.createElementNS(SVG_NS, "rect");
+      background.setAttribute("width", "100%");
+      background.setAttribute("height", "100%");
+      background.setAttribute("fill", settings.background);
+      output.append(background);
+    }
+    output.append(...strokes.map((stroke) => makePath(stroke, width, height)));
+    return new XMLSerializer().serializeToString(output);
+  };
+  const pending = /* @__PURE__ */ new Set();
+  scope.add(() => {
+    for (const cancelExport of pending) cancelExport();
+    pending.clear();
+  });
+  return {
+    get data() {
+      return exportData();
+    },
+    get isEmpty() {
+      return !strokes.length;
+    },
+    get canUndo() {
+      return !!undoStack.length;
+    },
+    get canRedo() {
+      return !!redoStack.length;
+    },
+    undo,
+    redo,
+    clear,
+    exportData,
+    importData(value, notify = true) {
+      if (scope.disposed) return false;
+      const next = validatedData(value);
+      if (!next) return false;
+      if (sameStrokes(next.strokes, strokes)) return true;
+      cancel();
+      strokes = next.strokes;
+      undoStack = [];
+      redoStack = [];
+      render();
+      update();
+      if (notify) emit("import");
+      return true;
+    },
+    exportSVG: (settings) => scope.disposed ? "" : exportSVG(settings),
+    exportPNG(settings = {}) {
+      if (scope.disposed) return Promise.resolve(null);
+      const canvas = document.createElement("canvas");
+      let context;
+      try {
+        context = canvas.getContext("2d");
+      } catch {
+        return Promise.resolve(null);
+      }
+      if (!context || typeof canvas.toBlob !== "function") return Promise.resolve(null);
+      const scale = finite5(settings.scale) ? clamp4(settings.scale, 1, 4) : 2;
+      canvas.width = Math.round((finite5(settings.width) ? clamp4(settings.width, 1, 4096) : dimensions.width) * scale);
+      canvas.height = Math.round((finite5(settings.height) ? clamp4(settings.height, 1, 4096) : dimensions.height) * scale);
+      return new Promise((resolve2) => {
+        const image = new Image();
+        let finished = false;
+        const done = (blob) => {
+          if (finished) return;
+          finished = true;
+          image.onload = null;
+          image.onerror = null;
+          pending.delete(cancelExport);
+          clearTimeout(timer2);
+          resolve2(scope.disposed ? null : blob);
+        };
+        const cancelExport = () => {
+          done(null);
+          image.src = "";
+        };
+        const timer2 = setTimeout(cancelExport, 1e4);
+        pending.add(cancelExport);
+        image.onerror = () => done(null);
+        image.onload = () => {
+          try {
+            context.drawImage(image, 0, 0, canvas.width, canvas.height);
+            canvas.toBlob(done, "image/png");
+          } catch {
+            done(null);
+          }
+        };
+        image.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(exportSVG(settings))}`;
+      });
+    },
+    setDisabled(value) {
+      if (!scope.disposed) {
+        cancel();
+        disabled = Boolean(value);
+        update();
+      }
+    },
+    setReadOnly(value) {
+      if (!scope.disposed) {
+        cancel();
+        readOnly = Boolean(value);
+        update();
+      }
+    },
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/waveform-player/engine.ts
+var initialState = () => ({ status: "idle", currentTime: 0, duration: 0, playbackRate: 1, error: null });
+var finite6 = (n) => Number.isFinite(n) && n >= 0;
+var clock = (n) => `${Math.floor(n / 60)}:${String(Math.floor(n % 60)).padStart(2, "0")}`;
+var playIcon = '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="m9 6 9 6-9 6Z"/></svg>';
+var pauseIcon = '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M8 6v12M16 6v12"/></svg>';
+var level = (n) => typeof n === "number" && Number.isFinite(n) ? Math.max(0, Math.min(1, n)) : 0;
+var resample = (values, count) => count === values.length ? [...values] : Array.from({ length: count }, (_, k) => {
+  const from = Math.floor(k * values.length / count);
+  const slice = values.slice(from, Math.max(from + 1, Math.floor((k + 1) * values.length / count)));
+  return slice.reduce((sum, n) => sum + n, 0) / slice.length;
+});
+function createWaveformPlayer(root, options = {}) {
+  if (!root) return inert({ play: async () => false, pause() {
+  }, seek() {
+  }, update() {
+  }, state: initialState(), audio: null });
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  let state = initialState();
+  let source = "";
+  let request = 0;
+  let requested = false;
+  let pending = null;
+  const make = (tag, part3, parent = root) => {
+    const el5 = document.createElement(tag);
+    el5.setAttribute(`data-mk-wave-${part3}`, "");
+    parent.append(el5);
+    return el5;
+  };
+  const container = make("div", "content");
+  scope.add(() => container.remove());
+  const audio = make("audio", "audio", container);
+  audio.preload = "metadata";
+  audio.hidden = true;
+  const toggle = make("button", "toggle", container);
+  toggle.type = "button";
+  const icon2 = make("span", "icon", toggle);
+  const body = make("div", "body", container);
+  const track = make("div", "track", body);
+  const bars = make("div", "bars", track);
+  bars.setAttribute("aria-hidden", "true");
+  const head = make("span", "head", track);
+  head.setAttribute("aria-hidden", "true");
+  const preview = make("span", "preview", track);
+  preview.setAttribute("aria-hidden", "true");
+  preview.hidden = true;
+  const range = make("input", "seek", track);
+  range.type = "range";
+  range.min = "0";
+  range.max = "0";
+  range.step = "0.1";
+  const footer = make("div", "footer", body);
+  const time2 = make("span", "time", footer);
+  const rate = make("button", "rate", footer);
+  rate.type = "button";
+  const message = make("span", "message", container);
+  message.setAttribute("role", "status");
+  message.setAttribute("aria-live", "polite");
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-wave-state", "idle");
+  scope.attr(root, "data-mk-wave-scrubbing", null);
+  let barNodes = [];
+  const effects = /* @__PURE__ */ new Set();
+  const keep = (effect) => {
+    for (const animation of effects) if (animation.totalProgress() === 1) effects.delete(animation);
+    if (effect) effects.add(effect);
+  };
+  let iconMotion = null;
+  let lastPlaying;
+  let lastRate = "";
+  let following = false;
+  const scrubbing = () => root.hasAttribute("data-mk-wave-scrubbing");
+  const paintProgress = (seconds, animate = true) => {
+    const progress = state.duration ? Math.max(0, Math.min(1, seconds / state.duration)) : 0;
+    track.style.setProperty("--mk-wave-progress", String(progress));
+    barNodes.forEach((bar, i) => {
+      const played = (i + 0.5) / barNodes.length <= progress;
+      if (bar.hasAttribute("data-mk-played") === played) return;
+      bar.toggleAttribute("data-mk-played", played);
+      if (animate && !scrubbing() && !reduced()) keep(gsap.fromTo(bar, { scaleY: 0.72 }, { scaleY: 1, duration: 0.35, ease: EASE.swatch, overwrite: "auto", clearProps: "transform" }));
+    });
+  };
+  const followPlayback = () => {
+    if (!scope.disposed && state.status === "playing") paintProgress(audio.currentTime);
+  };
+  const showPreview = (seconds, ratio) => {
+    preview.textContent = clock(seconds);
+    preview.style.setProperty("--mk-wave-at", String(Math.max(0.04, Math.min(0.96, ratio))));
+    preview.hidden = false;
+  };
+  const snapshot = () => ({ ...state });
+  const rates = () => {
+    const values = opts.playbackRates === false ? [] : opts.playbackRates ?? [1, 1.5, 2];
+    return Array.isArray(values) ? [...new Set(values.filter((n) => typeof n === "number" && Number.isFinite(n) && n >= 0.25 && n <= 4))] : [];
+  };
+  const paint = () => {
+    const playing = state.status === "playing";
+    const nextPlaying = playing || requested;
+    if (lastPlaying !== nextPlaying) {
+      icon2.innerHTML = nextPlaying ? pauseIcon : playIcon;
+      iconMotion?.kill();
+      if (lastPlaying !== void 0 && !reduced()) iconMotion = gsap.fromTo(icon2, { scale: 0.55, opacity: 0.3, filter: "blur(5px)" }, { scale: 1, opacity: 1, filter: "blur(0px)", duration: 0.3, ease: EASE.pop, clearProps: "transform,opacity,filter" });
+      lastPlaying = nextPlaying;
+    }
+    toggle.setAttribute("aria-label", `${playing || requested ? "Pausar" : "Reproducir"} ${opts.label ?? "audio"}`);
+    toggle.disabled = !!opts.disabled || !source;
+    range.disabled = !!opts.disabled || !state.duration;
+    range.max = String(state.duration);
+    range.value = String(state.currentTime);
+    range.setAttribute("aria-label", `Posici\xF3n de ${opts.label ?? "audio"}`);
+    range.setAttribute("aria-valuetext", `${clock(state.currentTime)} de ${clock(state.duration)}`);
+    time2.textContent = `${clock(state.currentTime)} / ${clock(state.duration)}`;
+    rate.hidden = rates().length < 2;
+    rate.disabled = !!opts.disabled;
+    const rateLabel = `${state.playbackRate}\xD7`;
+    if (lastRate !== rateLabel) {
+      if (lastRate) keep(rollDigits(rate, rateLabel, 1, 0.28));
+      else rate.textContent = rateLabel;
+      lastRate = rateLabel;
+    }
+    rate.setAttribute("aria-label", `Velocidad ${state.playbackRate}\xD7. Cambiar velocidad`);
+    paintProgress(state.currentTime);
+    if (document.activeElement === range) showPreview(state.currentTime, state.duration ? state.currentTime / state.duration : 0);
+    if (playing && !following) {
+      following = true;
+      gsap.ticker.add(followPlayback);
+    } else if (!playing && following) {
+      following = false;
+      gsap.ticker.remove(followPlayback);
+    }
+    root.setAttribute("data-mk-wave-state", state.status);
+    message.textContent = state.error ?? (state.status === "loading" ? "Cargando audio\u2026" : state.status === "ended" ? "Audio finalizado" : "");
+  };
+  const emit = (patch, event) => {
+    if (scope.disposed) return;
+    const previous = state.status;
+    state = { ...state, ...patch };
+    paint();
+    const next = snapshot();
+    if (event === "timeupdate") opts.onTimeUpdate?.(next);
+    if (previous !== state.status) opts.onStateChange?.(snapshot());
+    if (event === "play") opts.onPlay?.(snapshot());
+    if (event === "pause") opts.onPause?.(snapshot());
+    if (event === "ended") opts.onEnded?.(snapshot());
+    if (event === "error") opts.onError?.(snapshot());
+    if (previous !== state.status) root.dispatchEvent(new CustomEvent("mk:audio-statechange", { bubbles: true, detail: snapshot() }));
+    if (event) root.dispatchEvent(new CustomEvent(`mk:audio-${event}`, { bubbles: true, detail: snapshot() }));
+  };
+  const bounce = (target) => {
+    keep(press(target));
+  };
+  const fail = (message2) => {
+    requested = false;
+    emit({ status: "error", error: message2 }, "error");
+  };
+  const pause = () => {
+    if (scope.disposed) return;
+    request++;
+    requested = false;
+    pending = null;
+    audio.pause();
+    if (state.status !== "idle" && state.status !== "error" && state.status !== "ended" && state.status !== "paused") emit({ status: "paused" }, "pause");
+    else paint();
+  };
+  const seek = (seconds) => {
+    if (scope.disposed || !state.duration || !Number.isFinite(seconds)) return;
+    const next = Math.max(0, Math.min(state.duration, seconds));
+    try {
+      audio.currentTime = next;
+    } catch {
+      return;
+    }
+    emit({ currentTime: next, ...state.status === "ended" && next < state.duration ? { status: "paused" } : {} }, "timeupdate");
+  };
+  const play = () => {
+    if (scope.disposed || opts.disabled || !source) return Promise.resolve(false);
+    if (pending) return pending;
+    if (state.status === "playing") return Promise.resolve(true);
+    if (state.status === "ended") seek(0);
+    const token = ++request;
+    requested = true;
+    emit({ status: "loading", error: null });
+    let started;
+    try {
+      started = Promise.resolve(audio.play());
+    } catch (error) {
+      started = Promise.reject(error);
+    }
+    const result = started.then(() => {
+      if (scope.disposed || token !== request) return false;
+      requested = false;
+      if (audio.paused) {
+        emit({ status: "paused" });
+        return false;
+      }
+      if (state.status !== "playing") emit({ status: "playing", error: null }, "play");
+      return true;
+    }).catch((error) => {
+      if (!scope.disposed && token === request) {
+        requested = false;
+        if (error instanceof Error && error.name === "AbortError") emit({ status: "paused" });
+        else fail("No se pudo reproducir el audio. Vuelve a intentarlo.");
+      }
+      return false;
+    }).finally(() => {
+      if (token === request) pending = null;
+    });
+    pending = result;
+    return result;
+  };
+  const peakValues = () => {
+    const supplied = Array.isArray(opts.peaks) ? opts.peaks : [];
+    return supplied.length ? supplied.slice(0, 256).map(level) : Array(48).fill(0.24);
+  };
+  const barCount = (values) => {
+    const width = bars.clientWidth;
+    return width > 0 ? Math.max(12, Math.min(72, Math.floor((width + 3) / 8))) : values.length;
+  };
+  const renderPeaks = () => {
+    const values = peakValues();
+    bars.replaceChildren();
+    barNodes = resample(values, barCount(values)).map((peak) => {
+      const bar = make("i", "bar", bars);
+      bar.style.height = `${8 + peak * 92}%`;
+      return bar;
+    });
+    paintProgress(state.currentTime, false);
+  };
+  if (typeof ResizeObserver === "function") scope.observe(new ResizeObserver(() => {
+    if (!scope.disposed && barCount(peakValues()) !== barNodes.length) renderPeaks();
+  })).observe(bars);
+  const update = (next) => {
+    if (scope.disposed) return;
+    const previousPeaks = opts.peaks;
+    opts = { ...opts, ...next };
+    const nextSource = typeof opts.src === "string" ? opts.src : "";
+    if (source !== nextSource) {
+      request++;
+      pending = null;
+      requested = false;
+      audio.pause();
+      source = nextSource;
+      if (source) audio.setAttribute("src", source);
+      else audio.removeAttribute("src");
+      audio.load();
+      audio.playbackRate = state.playbackRate;
+      emit({ ...initialState(), playbackRate: state.playbackRate, status: source ? "loading" : "idle" });
+    }
+    if (opts.disabled && (requested || state.status === "playing")) pause();
+    if (previousPeaks !== opts.peaks || !barNodes.length) renderPeaks();
+    paint();
+  };
+  scope.on(toggle, "click", () => {
+    bounce(toggle);
+    if (requested || state.status === "playing") pause();
+    else void play();
+  });
+  scope.on(range, "input", () => seek(Number(range.value)));
+  scope.on(range, "pointermove", (event) => {
+    if (!state.duration || opts.disabled) return;
+    const rect = range.getBoundingClientRect();
+    if (!rect.width) return;
+    const inset = parseFloat(getComputedStyle(track).getPropertyValue("--mk-wave-inset")) || 0;
+    const ratio = Math.max(0, Math.min(1, (event.clientX - rect.left - inset) / Math.max(1, rect.width - inset * 2)));
+    showPreview(state.duration * ratio, ratio);
+  });
+  scope.on(range, "pointerleave", () => {
+    if (document.activeElement !== range) preview.hidden = true;
+  });
+  scope.on(range, "focus", () => {
+    if (state.duration) showPreview(state.currentTime, state.currentTime / state.duration);
+  });
+  scope.on(range, "blur", () => {
+    preview.hidden = true;
+  });
+  scope.on(range, "pointerdown", () => {
+    if (range.disabled) return;
+    root.setAttribute("data-mk-wave-scrubbing", "");
+    keep(press(head));
+  });
+  const release = () => {
+    if (!scrubbing()) return;
+    root.removeAttribute("data-mk-wave-scrubbing");
+    if (!reduced()) keep(gsap.fromTo(head, { scale: 1.12 }, { scale: 1, duration: 0.4, ease: EASE.swatch, overwrite: "auto", clearProps: "transform" }));
+  };
+  scope.on(window, "pointerup", release);
+  scope.on(window, "pointercancel", release);
+  scope.on(rate, "click", () => {
+    const available = rates();
+    const index = available.indexOf(state.playbackRate);
+    const next = available[(index + 1) % available.length];
+    if (next === void 0) return;
+    audio.playbackRate = next;
+    emit({ playbackRate: next });
+    bounce(rate);
+  });
+  const metadata = () => {
+    const duration = finite6(audio.duration) ? audio.duration : 0;
+    emit({
+      duration,
+      currentTime: duration ? Math.min(duration, Math.max(0, audio.currentTime || 0)) : 0,
+      ...state.status === "loading" && !requested ? { status: "ready" } : {}
+    });
+  };
+  scope.on(audio, "loadedmetadata", metadata);
+  scope.on(audio, "durationchange", metadata);
+  scope.on(audio, "timeupdate", () => emit({ currentTime: finite6(audio.currentTime) ? audio.currentTime : 0 }, "timeupdate"));
+  scope.on(audio, "playing", () => {
+    if (!source || opts.disabled || !requested && state.status !== "playing") {
+      audio.pause();
+      return;
+    }
+    requested = false;
+    if (state.status !== "playing") emit({ status: "playing", error: null }, "play");
+  });
+  scope.on(audio, "pause", () => {
+    if (state.status === "playing" || requested) {
+      requested = false;
+      emit({ status: "paused" }, "pause");
+    }
+  });
+  scope.on(audio, "waiting", () => {
+    if (state.status === "playing") {
+      requested = true;
+      emit({ status: "loading" });
+    }
+  });
+  scope.on(audio, "ended", () => {
+    request++;
+    pending = null;
+    requested = false;
+    emit({ status: "ended", currentTime: state.duration || state.currentTime }, "ended");
+  });
+  scope.on(audio, "error", () => {
+    request++;
+    pending = null;
+    fail("No se pudo cargar el audio. Comprueba el archivo.");
+  });
+  scope.on(audio, "ratechange", () => {
+    if (audio.playbackRate !== state.playbackRate) emit({ playbackRate: audio.playbackRate });
+  });
+  scope.add(() => {
+    request++;
+    requested = false;
+    pending = null;
+    iconMotion?.kill();
+    for (const effect of effects) effect.kill();
+    gsap.ticker.remove(followPlayback);
+    audio.pause();
+    audio.removeAttribute("src");
+    audio.load();
+  });
+  update(options);
+  return { play, pause, seek, update, get state() {
+    return snapshot();
+  }, get audio() {
+    return scope.disposed ? null : audio;
+  }, destroy: () => scope.dispose() };
+}
+
+// src/components/voice-message-bubble/engine.ts
+var statusLabels = { sending: "Enviando", sent: "Enviado", delivered: "Entregado", read: "Le\xEDdo", failed: "No enviado" };
+function createVoiceMessageBubble(root, options = {}) {
+  if (!root) return createWaveformPlayer(null, options);
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  const content = document.createElement("div");
+  content.setAttribute("data-mk-voice-message-content", "");
+  const header = document.createElement("div");
+  header.setAttribute("data-mk-voice-message-header", "");
+  const author = document.createElement("span");
+  author.setAttribute("data-mk-voice-message-author", "");
+  const caption = document.createElement("span");
+  caption.setAttribute("data-mk-voice-message-caption", "");
+  caption.textContent = "Mensaje de voz";
+  header.append(author, caption);
+  const playerRoot = document.createElement("div");
+  playerRoot.className = "mk-waveform-player";
+  const footer = document.createElement("div");
+  footer.setAttribute("data-mk-voice-message-footer", "");
+  const timestamp = document.createElement("time");
+  const status = document.createElement("span");
+  status.setAttribute("data-mk-voice-message-status", "");
+  footer.append(timestamp, status);
+  content.append(header, playerRoot, footer);
+  root.append(content);
+  scope.add(() => content.remove());
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-direction", "incoming");
+  const player = createWaveformPlayer(playerRoot);
+  scope.add(() => player.destroy());
+  const update = (next) => {
+    if (scope.disposed) return;
+    opts = { ...opts, ...next };
+    author.textContent = opts.author ?? "";
+    author.hidden = !opts.author;
+    timestamp.textContent = opts.timestamp ?? "";
+    timestamp.hidden = !opts.timestamp;
+    if (opts.dateTime) timestamp.dateTime = opts.dateTime;
+    else timestamp.removeAttribute("datetime");
+    status.textContent = opts.status && statusLabels[opts.status] || "";
+    status.hidden = !status.textContent;
+    root.setAttribute("data-mk-direction", opts.direction === "outgoing" ? "outgoing" : "incoming");
+    const { direction: _direction, author: _author, timestamp: _timestamp, dateTime: _dateTime, status: _status, ...audio } = opts;
+    player.update({ ...audio, label: opts.label ?? (opts.author ? `mensaje de voz de ${opts.author}` : "mensaje de voz") });
+  };
+  update(options);
+  let entrance = null;
+  if (!reduced()) {
+    content.style.transformOrigin = opts.direction === "outgoing" ? "right bottom" : "left bottom";
+    entrance = gsap.fromTo(content, { scale: 0.88, opacity: 0, filter: "blur(12px)", y: 10 }, { scale: 1, opacity: 1, filter: "blur(0px)", y: 0, duration: 0.65, ease: EASE.signature, clearProps: "transform,opacity,filter" });
+  }
+  scope.add(() => entrance?.kill());
+  return {
+    play: () => player.play(),
+    pause: () => player.pause(),
+    seek: (n) => player.seek(n),
+    update,
+    get state() {
+      return player.state;
+    },
+    get audio() {
+      return player.audio;
+    },
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/drilldown-menu/engine.ts
+var CHEVRON5 = '<svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 6 6 6-6 6"/></svg>';
+var sequence24 = 0;
+var samePath = (a, b) => a.length === b.length && a.every((id, i) => id === b[i]);
+var branch = (item) => Array.isArray(item.children);
+var copyItems = (items) => items.map((item) => ({ ...item, ...branch(item) ? { children: copyItems(item.children) } : {} }));
+function createDrilldownMenu(root, options = {}) {
+  if (!root) return inert({ open: () => false, back: () => false, root() {
+  }, reset() {
+  }, setPath() {
+  }, setItems() {
+  }, update() {
+  }, focusItem() {
+  }, path: [], items: [], element: null });
+  registerMotion();
+  const scope = createScope();
+  const uid2 = `mk-drilldown-${++sequence24}`;
+  const authored = [...root.childNodes];
+  const holder = document.createDocumentFragment();
+  holder.append(...authored);
+  let config = { ...options };
+  let data = copyItems(options.items ?? []);
+  let path = [];
+  let focused = null;
+  const remembered = /* @__PURE__ */ new Map();
+  let animation = null;
+  let hoverMotion = null;
+  const effects = /* @__PURE__ */ new Set();
+  const keep = (effect) => {
+    for (const animation2 of effects) if (animation2.totalProgress() === 1) effects.delete(animation2);
+    if (effect) effects.add(effect);
+  };
+  const header = document.createElement("div");
+  header.dataset.mkDrilldownHeader = "";
+  const backButton = document.createElement("button");
+  backButton.type = "button";
+  backButton.dataset.mkDrilldownBack = "";
+  backButton.innerHTML = CHEVRON5;
+  const heading = document.createElement("span");
+  heading.id = `${uid2}-heading`;
+  heading.dataset.mkDrilldownHeading = "";
+  header.append(backButton, heading);
+  const breadcrumb = document.createElement("nav");
+  breadcrumb.dataset.mkDrilldownBreadcrumb = "";
+  const crumbs = document.createElement("ol");
+  breadcrumb.append(crumbs);
+  const viewport = document.createElement("div");
+  viewport.dataset.mkDrilldownViewport = "";
+  const menu = document.createElement("div");
+  menu.dataset.mkDrilldownLevel = "";
+  menu.id = `${uid2}-level`;
+  menu.setAttribute("role", "menu");
+  menu.setAttribute("aria-labelledby", heading.id);
+  const empty = document.createElement("p");
+  empty.dataset.mkDrilldownEmpty = "";
+  empty.setAttribute("role", "status");
+  const highlight = document.createElement("span");
+  highlight.dataset.mkDrilldownHighlight = "";
+  highlight.setAttribute("aria-hidden", "true");
+  viewport.append(highlight, menu, empty);
+  backButton.setAttribute("aria-controls", menu.id);
+  root.append(header, breadcrumb, viewport);
+  scope.attr(root, "data-mk-ready", "");
+  const levelAt = (requested) => {
+    const valid2 = [];
+    const ancestors = [];
+    let items = data;
+    for (const id of requested) {
+      const item = items.find((entry) => entry.id === id);
+      if (!item || item.disabled || !branch(item)) break;
+      valid2.push(id);
+      ancestors.push(item);
+      items = item.children;
+    }
+    return { valid: valid2, ancestors, items };
+  };
+  const level2 = () => levelAt(path);
+  const enabled = () => [...menu.querySelectorAll("[data-mk-drilldown-item]")].filter((item) => !item.disabled);
+  const buttonOf = (id) => enabled().find((item) => item.dataset.mkDrilldownItem === id);
+  const highlightItem = (button2) => {
+    hoverMotion?.kill();
+    for (const item of enabled()) item.toggleAttribute("data-mk-highlighted", item === button2);
+    if (!button2) {
+      highlight.style.opacity = "0";
+      return;
+    }
+    const geometry = { x: button2.offsetLeft + menu.offsetLeft, y: button2.offsetTop + menu.offsetTop, width: button2.offsetWidth, height: button2.offsetHeight, opacity: 1 };
+    if (reduced()) gsap.set(highlight, geometry);
+    else hoverMotion = gsap.to(highlight, { ...geometry, duration: 0.35, ease: EASE.swatch });
+  };
+  const cancelMotion = () => {
+    animation?.kill();
+    hoverMotion?.kill();
+    animation = null;
+    gsap.set([menu, heading, breadcrumb, ...menu.children], { clearProps: "transform,opacity,filter" });
+    gsap.set(viewport, { clearProps: "height" });
+  };
+  const roving = (id, focus = false) => {
+    const items = enabled();
+    const target = items.find((item) => item.dataset.mkDrilldownItem === id) ?? items[0];
+    focused = target?.dataset.mkDrilldownItem ?? null;
+    for (const item of menu.querySelectorAll("[data-mk-drilldown-item]")) item.tabIndex = item === target ? 0 : -1;
+    menu.tabIndex = target ? -1 : 0;
+    if (focused) remembered.set(JSON.stringify(path), focused);
+    if (focus) (target ?? menu).focus({ preventScroll: true });
+    if (focus) highlightItem(target);
+  };
+  const notifyPath = () => {
+    const next = [...path];
+    root.dispatchEvent(new CustomEvent("mk:path-change", { bubbles: true, detail: { path: [...next] } }));
+    config.onPathChange?.(next);
+  };
+  const render = (direction, focus, preferred) => {
+    const oldHeight = viewport.getBoundingClientRect().height;
+    cancelMotion();
+    highlightItem(null);
+    const current3 = level2();
+    const label = config.label ?? "Actions";
+    const title = current3.ancestors.at(-1)?.label ?? label;
+    heading.textContent = title;
+    backButton.hidden = path.length === 0;
+    backButton.setAttribute("aria-label", config.backLabel ?? "Back");
+    breadcrumb.setAttribute("aria-label", `${label} path`);
+    breadcrumb.hidden = path.length === 0;
+    const labels = [label, ...current3.ancestors.map((item) => item.label)];
+    crumbs.replaceChildren(...labels.map((text, index) => {
+      const li = document.createElement("li");
+      if (index === labels.length - 1) {
+        const span = document.createElement("span");
+        span.setAttribute("aria-current", "location");
+        span.textContent = text;
+        li.append(span);
+      } else {
+        const button2 = document.createElement("button");
+        button2.type = "button";
+        button2.dataset.mkDrilldownCrumb = String(index);
+        button2.textContent = text;
+        button2.setAttribute("aria-controls", menu.id);
+        li.append(button2);
+      }
+      return li;
+    }));
+    menu.replaceChildren(...current3.items.map((item, index) => {
+      const button2 = document.createElement("button");
+      button2.type = "button";
+      button2.dataset.mkDrilldownItem = item.id;
+      button2.setAttribute("role", "menuitem");
+      button2.disabled = Boolean(item.disabled);
+      if (item.disabled) button2.setAttribute("aria-disabled", "true");
+      const text = document.createElement("span");
+      text.dataset.mkDrilldownText = "";
+      const name = document.createElement("span");
+      name.id = `${uid2}-item-${index}`;
+      name.dataset.mkDrilldownLabel = "";
+      name.textContent = item.label;
+      button2.setAttribute("aria-labelledby", name.id);
+      text.append(name);
+      if (item.description) {
+        const description = document.createElement("span");
+        description.id = `${uid2}-description-${index}`;
+        description.dataset.mkDrilldownDescription = "";
+        description.textContent = item.description;
+        button2.setAttribute("aria-describedby", description.id);
+        text.append(description);
+      }
+      button2.append(text);
+      if (branch(item)) {
+        button2.setAttribute("aria-haspopup", "menu");
+        const arrow = document.createElement("span");
+        arrow.dataset.mkDrilldownArrow = "";
+        arrow.innerHTML = CHEVRON5;
+        button2.append(arrow);
+      }
+      return button2;
+    }));
+    empty.textContent = config.emptyText ?? "No actions available";
+    empty.hidden = current3.items.length !== 0;
+    roving(preferred ?? remembered.get(JSON.stringify(path)) ?? null);
+    if (direction && !reduced()) {
+      animation = gsap.timeline({ onComplete: () => {
+        animation = null;
+      } }).fromTo(menu, { x: 28 * direction, opacity: 0, filter: "blur(6px)" }, { x: 0, opacity: 1, filter: "blur(0px)", duration: 0.36, ease: EASE.signature, clearProps: "transform,opacity,filter" });
+      animation.fromTo([heading, breadcrumb], { y: -6, opacity: 0.3, filter: "blur(6px)" }, { y: 0, opacity: 1, filter: "blur(0px)", duration: 0.3, ease: EASE.pop, clearProps: "transform,opacity,filter" }, 0).fromTo([...menu.children], { x: 12 * direction, opacity: 0 }, { x: 0, opacity: 1, duration: 0.3, stagger: 0.035, ease: EASE.swatchLight, clearProps: "transform,opacity" }, 0.04);
+      const nextHeight = viewport.getBoundingClientRect().height;
+      if (oldHeight > 0 && nextHeight > 0 && oldHeight !== nextHeight) {
+        animation.fromTo(viewport, { height: oldHeight }, { height: nextHeight, duration: 0.36, ease: EASE.signature, clearProps: "height" }, 0);
+      }
+    }
+    if (focus) roving(focused, true);
+  };
+  const navigate = (requested, notify, focus, preferred) => {
+    if (scope.disposed) return false;
+    const next = levelAt(requested).valid;
+    if (samePath(path, next)) return false;
+    const previous = path;
+    if (focused) remembered.set(JSON.stringify(previous), focused);
+    const direction = next.length > path.length ? 1 : -1;
+    path = next;
+    render(direction, focus, preferred);
+    if (notify) notifyPath();
+    return true;
+  };
+  const open = (id) => {
+    if (scope.disposed) return false;
+    const item = level2().items.find((entry) => entry.id === id);
+    if (!item || item.disabled || !branch(item)) return false;
+    return navigate([...path, id], true, true);
+  };
+  const back = () => path.length ? navigate(path.slice(0, -1), true, true, path.at(-1)) : false;
+  const reset = () => navigate([], true, root.contains(document.activeElement), path[0]);
+  const activate = (id) => {
+    const item = level2().items.find((entry) => entry.id === id);
+    if (!item || item.disabled) return;
+    if (branch(item)) return void open(id);
+    const button2 = buttonOf(id);
+    if (button2) {
+      for (const row of enabled()) row.toggleAttribute("data-mk-chosen", row === button2);
+      keep(press(button2));
+      keep(ringPulse(button2));
+    }
+    const selected = copyItems([item])[0];
+    const selectedPath = [...path, item.id];
+    root.dispatchEvent(new CustomEvent("mk:select", { bubbles: true, detail: { item: selected, path: [...selectedPath] } }));
+    config.onSelect?.(copyItems([item])[0], [...selectedPath]);
+  };
+  scope.on(menu, "click", (event) => {
+    const button2 = event.target?.closest("[data-mk-drilldown-item]");
+    if (!button2 || !menu.contains(button2) || button2.disabled) return;
+    roving(button2.dataset.mkDrilldownItem, false);
+    activate(button2.dataset.mkDrilldownItem);
+  });
+  scope.on(menu, "focusin", (event) => {
+    const button2 = event.target?.closest("[data-mk-drilldown-item]");
+    if (button2 && !button2.disabled) {
+      roving(button2.dataset.mkDrilldownItem, false);
+      highlightItem(button2);
+    }
+  });
+  scope.on(menu, "pointerover", (event) => {
+    const button2 = event.target?.closest("[data-mk-drilldown-item]");
+    if (button2 && !button2.disabled) highlightItem(button2);
+  });
+  scope.on(menu, "pointerleave", () => highlightItem(menu.contains(document.activeElement) ? buttonOf(focused ?? "") : null));
+  if (typeof ResizeObserver === "function") scope.observe(new ResizeObserver(() => {
+    const current3 = menu.querySelector("[data-mk-highlighted]");
+    if (current3) highlightItem(current3);
+  })).observe(menu);
+  scope.on(root, "keydown", (event) => {
+    const key2 = event.key;
+    if ((key2 === "ArrowLeft" || key2 === "Escape") && path.length) {
+      event.preventDefault();
+      event.stopPropagation();
+      back();
+      return;
+    }
+    if (!menu.contains(event.target)) return;
+    const items = enabled();
+    const at = items.indexOf(document.activeElement);
+    const moves = { ArrowDown: (at + 1) % items.length, ArrowUp: at < 0 ? items.length - 1 : (at - 1 + items.length) % items.length, Home: 0, End: items.length - 1 };
+    if (key2 in moves && items.length) {
+      event.preventDefault();
+      roving(items[moves[key2]].dataset.mkDrilldownItem, true);
+      return;
+    }
+    const button2 = event.target?.closest("[data-mk-drilldown-item]");
+    if (!button2 || button2.disabled || !menu.contains(button2)) return;
+    if (key2 === "Enter" || key2 === " " || key2 === "ArrowRight") {
+      const item = level2().items.find((entry) => entry.id === button2.dataset.mkDrilldownItem);
+      if (key2 === "ArrowRight" && (!item || !branch(item))) return;
+      event.preventDefault();
+      activate(button2.dataset.mkDrilldownItem);
+    }
+  });
+  scope.on(backButton, "click", () => {
+    keep(press(backButton));
+    back();
+  });
+  scope.on(breadcrumb, "click", (event) => {
+    const button2 = event.target?.closest("[data-mk-drilldown-crumb]");
+    if (!button2 || !breadcrumb.contains(button2)) return;
+    const depth = Number(button2.dataset.mkDrilldownCrumb);
+    navigate(path.slice(0, depth), true, true, path[depth]);
+  });
+  scope.add(() => {
+    cancelMotion();
+    for (const effect of effects) effect.kill();
+    gsap.killTweensOf([heading, breadcrumb, highlight]);
+    remembered.clear();
+    header.remove();
+    breadcrumb.remove();
+    viewport.remove();
+    root.append(holder);
+  });
+  path = levelAt(options.path ?? []).valid;
+  render(0, false);
+  const update = (next) => {
+    if (scope.disposed) return;
+    const active = document.activeElement;
+    const hadFocus = root.contains(active);
+    const backFocused = active === backButton;
+    const crumbFocused = active?.dataset.mkDrilldownCrumb;
+    const previousPath = path;
+    const previousFocus = focused;
+    config = { ...config, ...next };
+    if (next.items !== void 0) data = copyItems(next.items);
+    path = levelAt(next.path ?? path).valid;
+    const changed = !samePath(previousPath, path);
+    const preferred = changed ? previousPath[path.length] : previousFocus;
+    render(0, hadFocus, preferred);
+    if (hadFocus && !changed) {
+      if (backFocused && !backButton.hidden) backButton.focus({ preventScroll: true });
+      else if (crumbFocused !== void 0) {
+        [...crumbs.querySelectorAll("[data-mk-drilldown-crumb]")].find((button2) => button2.dataset.mkDrilldownCrumb === crumbFocused)?.focus({ preventScroll: true });
+      }
+    }
+    if (changed && next.path === void 0) notifyPath();
+  };
+  return {
+    open,
+    back,
+    root: reset,
+    reset,
+    setPath: (next, notify = false) => {
+      navigate(next, notify, root.contains(document.activeElement));
+    },
+    setItems: (items) => update({ items }),
+    update,
+    focusItem(id) {
+      if (!scope.disposed && buttonOf(id)) roving(id, true);
+    },
+    get path() {
+      return [...path];
+    },
+    get items() {
+      return copyItems(level2().items);
+    },
+    element: root,
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/wheel-picker/engine.ts
+var sequence25 = 0;
+function normalize(items) {
+  const seen = /* @__PURE__ */ new Set();
+  return items.flatMap((item) => {
+    const row = typeof item === "string" ? { value: item, label: item } : item;
+    if (!row || typeof row !== "object" || row.value == null) return [];
+    const value = String(row.value);
+    if (seen.has(value)) return [];
+    seen.add(value);
+    return [{ value, label: String(row.label ?? value), disabled: Boolean(row.disabled) }];
+  });
+}
+function createWheelPicker(root, options = {}) {
+  if (!root) return inert({ setValue() {
+  }, setItems() {
+  }, value: "" });
+  registerMotion();
+  const scope = createScope(), uid2 = `mk-wheel-${++sequence25}`;
+  let items = normalize(Array.isArray(options.items) ? options.items : []);
+  const rawRows = Number.isFinite(options.visibleItems) ? Math.round(options.visibleItems) : 5;
+  const rows = Math.min(9, Math.max(3, rawRows % 2 ? rawRows : rawRows + 1));
+  const height = Number.isFinite(options.itemHeight) ? Math.max(44, Math.min(96, options.itemHeight)) : 44;
+  const disabled = Boolean(options.disabled);
+  const originalStyle = root.getAttribute("style");
+  root.style.setProperty("--mk-wheel-row", `${height}px`);
+  root.style.setProperty("--mk-wheel-rows", String(rows));
+  scope.add(() => {
+    if (originalStyle === null) root.removeAttribute("style");
+    else root.setAttribute("style", originalStyle);
+  });
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-disabled", disabled ? "" : null);
+  const label = document.createElement("span");
+  label.id = `${uid2}-label`;
+  label.dataset.mkWheelLabel = "";
+  label.textContent = options.label ?? root.getAttribute("aria-label") ?? "Seleccionar";
+  const frame = document.createElement("div");
+  frame.dataset.mkWheelFrame = "";
+  const highlight = document.createElement("span");
+  highlight.dataset.mkWheelHighlight = "";
+  highlight.setAttribute("aria-hidden", "true");
+  const viewport = document.createElement("div");
+  viewport.dataset.mkWheelViewport = "";
+  viewport.setAttribute("role", "listbox");
+  viewport.setAttribute("aria-labelledby", label.id);
+  viewport.setAttribute("aria-orientation", "vertical");
+  viewport.setAttribute("aria-disabled", String(disabled));
+  viewport.tabIndex = disabled ? -1 : 0;
+  const list3 = document.createElement("div");
+  list3.dataset.mkWheelList = "";
+  viewport.append(list3);
+  frame.append(highlight, viewport);
+  const input = document.createElement("input");
+  input.type = "hidden";
+  if (options.name) input.name = options.name;
+  input.disabled = disabled;
+  const status = document.createElement("span");
+  status.className = "mk-sr-only";
+  status.setAttribute("role", "status");
+  root.append(label, frame, input, status);
+  scope.add(() => {
+    label.remove();
+    frame.remove();
+    input.remove();
+    status.remove();
+  });
+  const enabled = () => items.flatMap((item, index) => item.disabled ? [] : [index]);
+  const find = (value) => items.findIndex((item) => value !== void 0 && item.value === String(value) && !item.disabled);
+  let current3 = find(options.value);
+  if (current3 < 0) current3 = enabled()[0] ?? -1;
+  const initial = items[current3]?.value ?? "";
+  let committed = initial;
+  let nodes = [];
+  let timer2;
+  let typing;
+  let prefix = "";
+  let programmatic = null;
+  let glide = null;
+  let feedback = null;
+  let dragging = null;
+  let suppressClick = false;
+  scope.add(() => {
+    clearTimeout(timer2);
+    clearTimeout(typing);
+    glide?.kill();
+    feedback?.kill();
+  });
+  const radius = height * rows / 2, step = height / radius, camera = radius * 3;
+  const paint = () => {
+    const offset = viewport.scrollTop / height, flat = reduced();
+    nodes.forEach((node, index) => {
+      const distance = index - offset;
+      const angle2 = distance * step, hidden = Math.abs(angle2) >= Math.PI / 2;
+      const depth = radius * (Math.cos(angle2) - 1);
+      const cameraScale = camera / (camera - depth);
+      const shiftY = (radius * Math.sin(angle2) - distance * height) / cameraScale;
+      node.style.transform = flat || hidden ? "" : `perspective(${camera.toFixed(0)}px) translate3d(0, ${shiftY.toFixed(3)}px, ${depth.toFixed(3)}px) rotateX(${(-angle2 * 180 / Math.PI).toFixed(3)}deg)`;
+      node.style.opacity = String((items[index].disabled ? 0.32 : 1) * (flat ? 1 : hidden ? 0 : Math.pow(Math.cos(angle2), 1.6)));
+      node.style.visibility = !flat && hidden ? "hidden" : "";
+      node.style.pointerEvents = !flat && Math.abs(angle2) > 1.2 ? "none" : "";
+      node.setAttribute("aria-selected", String(index === current3));
+    });
+    input.value = items[current3]?.value ?? "";
+    if (current3 >= 0) viewport.setAttribute("aria-activedescendant", `${uid2}-${current3}`);
+    else viewport.removeAttribute("aria-activedescendant");
+  };
+  const announce = (kind) => {
+    const value = items[current3]?.value ?? "";
+    if (kind === "input") options.onInput?.(value);
+    else {
+      options.onChange?.(value);
+      status.textContent = items[current3]?.label ?? "";
+      feedback?.kill();
+      if (!reduced()) feedback = gsap.fromTo(highlight, { scaleX: 0.94, scaleY: 0.82 }, { scaleX: 1, scaleY: 1, duration: 0.5, ease: EASE.click, clearProps: "transform" });
+    }
+    input.dispatchEvent(new Event(kind, { bubbles: true }));
+    root.dispatchEvent(new CustomEvent(`mk:${kind}`, { bubbles: true, detail: { value, item: current3 >= 0 ? { ...items[current3] } : null } }));
+  };
+  const align = (animate) => {
+    glide?.kill();
+    glide = null;
+    const top = Math.max(0, current3) * height;
+    if (animate && !reduced()) {
+      programmatic = top;
+      const proxy = { top: viewport.scrollTop };
+      glide = gsap.to(proxy, {
+        top,
+        duration: 0.55,
+        ease: EASE.swatch,
+        onUpdate: () => {
+          viewport.scrollTop = proxy.top;
+          paint();
+        },
+        onComplete: () => {
+          glide = null;
+          programmatic = null;
+          viewport.scrollTop = top;
+          paint();
+        }
+      });
+    } else {
+      programmatic = null;
+      viewport.scrollTop = top;
+      paint();
+    }
+  };
+  const select = (index, notify, animate = true) => {
+    if (scope.disposed || index < 0 || index >= items.length || items[index].disabled) return;
+    const previous = items[current3]?.value ?? "";
+    current3 = index;
+    paint();
+    align(animate);
+    const value = items[current3].value;
+    committed = value;
+    if (notify && value !== previous) {
+      announce("input");
+      announce("change");
+    }
+  };
+  const nearest = () => {
+    const at = viewport.scrollTop / height;
+    return enabled().reduce((best, index) => best < 0 || Math.abs(index - at) < Math.abs(best - at) ? index : best, -1);
+  };
+  const settle = () => {
+    if (scope.disposed || dragging) return;
+    if (glide?.isActive()) return;
+    clearTimeout(timer2);
+    if (programmatic !== null) {
+      programmatic = null;
+      viewport.scrollTop = Math.max(0, current3) * height;
+      paint();
+      return;
+    }
+    const index = nearest();
+    if (index < 0) return;
+    current3 = index;
+    align(false);
+    paint();
+    const value = items[current3].value;
+    if (value !== committed) {
+      committed = value;
+      announce("change");
+    }
+  };
+  const build = () => {
+    list3.replaceChildren();
+    nodes = items.map((item, index) => {
+      const node = document.createElement("div");
+      node.id = `${uid2}-${index}`;
+      node.dataset.mkWheelOption = String(index);
+      node.setAttribute("role", "option");
+      node.setAttribute("aria-disabled", String(item.disabled));
+      node.textContent = item.label;
+      list3.append(node);
+      return node;
+    });
+    if (!items.length) {
+      const empty = document.createElement("span");
+      empty.dataset.mkWheelEmpty = "";
+      empty.textContent = "Sin opciones";
+      list3.append(empty);
+    }
+    align(false);
+    paint();
+  };
+  const interrupt = () => {
+    glide?.kill();
+    glide = null;
+    programmatic = null;
+  };
+  scope.on(viewport, "pointerdown", (event) => {
+    interrupt();
+    const pointer2 = event;
+    if (disabled || pointer2.pointerType === "touch" || pointer2.button !== 0) return;
+    dragging = { id: pointer2.pointerId, y: pointer2.clientY, top: viewport.scrollTop, moved: false };
+    viewport.focus({ preventScroll: true });
+  });
+  scope.on(window, "pointermove", (event) => {
+    const pointer2 = event;
+    if (!dragging || pointer2.pointerId !== dragging.id) return;
+    const delta = pointer2.clientY - dragging.y;
+    if (Math.abs(delta) > 4 && !dragging.moved) {
+      dragging.moved = true;
+      viewport.style.scrollSnapType = "none";
+      try {
+        viewport.setPointerCapture(pointer2.pointerId);
+      } catch {
+      }
+    }
+    if (!dragging.moved) return;
+    event.preventDefault();
+    viewport.scrollTop = Math.max(0, Math.min(Math.max(0, (items.length - 1) * height), dragging.top - delta));
+  });
+  const release = (event) => {
+    if (!dragging || dragging.id !== event.pointerId) return;
+    suppressClick = dragging.moved;
+    dragging = null;
+    viewport.style.removeProperty("scroll-snap-type");
+    if (suppressClick) {
+      settle();
+      clearTimeout(timer2);
+      timer2 = setTimeout(() => {
+        suppressClick = false;
+      }, 0);
+    }
+  };
+  scope.on(window, "pointerup", release);
+  scope.on(window, "pointercancel", release);
+  scope.on(viewport, "lostpointercapture", release);
+  scope.on(viewport, "wheel", interrupt, { passive: true });
+  scope.on(viewport, "scroll", () => {
+    if (disabled) return;
+    if (programmatic === null) {
+      const index = nearest();
+      if (index >= 0 && index !== current3) {
+        current3 = index;
+        paint();
+        announce("input");
+      }
+    }
+    paint();
+    clearTimeout(timer2);
+    timer2 = setTimeout(settle, 100);
+  }, { passive: true });
+  scope.on(viewport, "scrollend", settle);
+  scope.on(viewport, "click", (event) => {
+    if (disabled) return;
+    if (suppressClick) {
+      event.preventDefault();
+      suppressClick = false;
+      return;
+    }
+    const row = event.target.closest("[data-mk-wheel-option]");
+    if (!row || !list3.contains(row)) return;
+    select(Number(row.dataset.mkWheelOption), true);
+    viewport.focus({ preventScroll: true });
+  });
+  scope.on(viewport, "keydown", (event) => {
+    if (disabled) return;
+    const key2 = event.key, choices = enabled(), at = choices.indexOf(current3);
+    if (key2 === "Enter" || key2 === " ") {
+      event.preventDefault();
+      return;
+    }
+    const move = key2 === "ArrowDown" ? 1 : key2 === "ArrowUp" ? -1 : key2 === "PageDown" ? rows - 1 : key2 === "PageUp" ? 1 - rows : 0;
+    let next = key2 === "Home" ? choices[0] : key2 === "End" ? choices.at(-1) : move ? choices[Math.min(choices.length - 1, Math.max(0, at + move))] : void 0;
+    if (next === void 0 && key2.length === 1 && !event.ctrlKey && !event.metaKey) {
+      prefix += key2.toLocaleLowerCase();
+      clearTimeout(typing);
+      typing = setTimeout(() => {
+        prefix = "";
+      }, 600);
+      next = choices.find((index) => items[index].label.toLocaleLowerCase().startsWith(prefix));
+    }
+    if (next === void 0) return;
+    event.preventDefault();
+    interrupt();
+    select(next, true);
+  });
+  const form = root.closest("form");
+  if (form) scope.on(form, "reset", (event) => queueMicrotask(() => {
+    if (scope.disposed || event.defaultPrevented) return;
+    const index = find(initial);
+    select(index >= 0 ? index : enabled()[0] ?? -1, true, false);
+    paint();
+  }));
+  build();
+  input.defaultValue = initial;
+  return {
+    setValue(value, notify = false) {
+      const next = find(value);
+      if (next !== current3) select(next, notify);
+    },
+    setItems(next, notify = false) {
+      if (scope.disposed) return;
+      clearTimeout(timer2);
+      programmatic = null;
+      const before = items[current3]?.value ?? "";
+      items = normalize(Array.isArray(next) ? next : []);
+      current3 = find(before);
+      if (current3 < 0) current3 = enabled()[0] ?? -1;
+      build();
+      committed = items[current3]?.value ?? "";
+      if (notify && committed !== before) {
+        announce("input");
+        announce("change");
+      }
+    },
+    get value() {
+      return items[current3]?.value ?? "";
+    },
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/stepper/engine.ts
+function createStepper(root, options = {}) {
+  if (!root) return inert({ value: 0, setValue() {
+  }, next() {
+  }, previous() {
+  }, reset() {
+  } });
+  registerMotion();
+  const scope = createScope();
+  const effects = /* @__PURE__ */ new Set();
+  const keep = (effect) => {
+    for (const prior of effects) if (prior.totalProgress() === 1) effects.delete(prior);
+    if (effect) effects.add(effect);
+  };
+  scope.add(() => {
+    effects.forEach((effect) => effect.kill());
+    effects.clear();
+  });
+  const items = (Array.isArray(options.items) ? options.items : []).filter((item) => item && typeof item.label === "string");
+  const clamp5 = (n) => Math.max(0, Math.min(Math.max(0, items.length - 1), Number.isFinite(n) ? Math.round(n) : 0));
+  const initial = clamp5(options.defaultValue ?? options.value ?? 0);
+  let value = clamp5(options.value ?? initial);
+  let furthest = value;
+  let pending = null;
+  const nav = document.createElement("nav");
+  nav.dataset.mkStepperBody = "";
+  nav.setAttribute("aria-label", options.label ?? "Progreso");
+  const list3 = document.createElement("ol");
+  list3.dataset.mkStepperList = "";
+  nav.append(list3);
+  const caption = document.createElement("span");
+  caption.dataset.mkStepperCaption = "";
+  caption.setAttribute("aria-live", "polite");
+  nav.append(caption);
+  root.append(nav);
+  scope.add(() => nav.remove());
+  const buttons = [];
+  const rows = [];
+  const marks = [];
+  items.forEach((item, index) => {
+    const row = document.createElement("li");
+    row.dataset.mkStepperItem = "";
+    const button2 = document.createElement("button");
+    button2.type = "button";
+    button2.dataset.mkStepperStep = String(index);
+    const marker = document.createElement("span");
+    marker.dataset.mkStepperMarker = "";
+    marker.setAttribute("aria-hidden", "true");
+    const copy = document.createElement("span");
+    copy.dataset.mkStepperCopy = "";
+    const title = document.createElement("span");
+    title.dataset.mkStepperLabel = "";
+    title.textContent = item.label;
+    copy.append(title);
+    if (item.description) {
+      const description = document.createElement("span");
+      description.dataset.mkStepperDescription = "";
+      description.textContent = item.description;
+      copy.append(description);
+    }
+    button2.append(marker, copy);
+    row.append(button2);
+    list3.append(row);
+    buttons.push(button2);
+    rows.push(row);
+    marks.push(marker);
+    scope.on(button2, "click", () => {
+      if (!button2.disabled && !button2.matches(":disabled")) choose(index, true);
+    });
+  });
+  const hidden = options.name ? document.createElement("input") : null;
+  if (hidden) {
+    hidden.type = "hidden";
+    hidden.name = options.name;
+    hidden.disabled = Boolean(options.disabled);
+    nav.append(hidden);
+  }
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-variant", options.variant ?? "horizontal");
+  scope.attr(root, "data-mk-disabled", options.disabled ? "" : null);
+  const paint = (animate, before) => {
+    const nextEnabled = items.findIndex((item, index) => index > furthest && !item.disabled);
+    const availableThrough = Math.max(furthest, nextEnabled);
+    items.forEach((item, index) => {
+      const selected = index === value;
+      const complete = item.completed || index < value;
+      rows[index].toggleAttribute("data-mk-current", selected);
+      rows[index].toggleAttribute("data-mk-complete", Boolean(complete));
+      rows[index].toggleAttribute("data-mk-error", Boolean(item.error));
+      const button2 = buttons[index];
+      button2.disabled = Boolean(options.disabled || item.disabled || options.linear && index > availableThrough);
+      if (selected) button2.setAttribute("aria-current", "step");
+      else button2.removeAttribute("aria-current");
+      button2.setAttribute("aria-label", `${index + 1}. ${item.label}${item.error ? ", requiere atenci\xF3n" : complete ? ", completado" : ""}`);
+      marks[index].textContent = item.error ? "!" : complete ? "\u2713" : String(index + 1);
+    });
+    if (hidden) hidden.value = String(value);
+    const text = items.length ? `${value + 1} / ${items.length} \xB7 ${items[value]?.label ?? ""}` : "No hay pasos";
+    if (animate && !reduced()) keep(rollDigits(caption, text, value >= before ? 1 : -1, 0.3));
+    else caption.textContent = text;
+  };
+  const choose = (next, notify = false) => {
+    if (scope.disposed) return;
+    if (notify) pending = { value, furthest };
+    const before = value;
+    value = clamp5(next);
+    furthest = Math.max(furthest, value);
+    paint(before !== value, before);
+    if (before === value) return;
+    if (!reduced() && buttons[value]) {
+      keep(press(buttons[value]));
+      keep(gsap.fromTo(marks[value], { scale: 0.7, filter: "blur(4px)" }, { scale: 1, filter: "blur(0px)", duration: 0.4, ease: EASE.pop, overwrite: "auto", clearProps: "transform,filter" }));
+    }
+    if (notify) {
+      const emitted = value;
+      options.onChange?.(emitted);
+      if (!scope.disposed) root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { value: emitted } }));
+    }
+  };
+  const move = (direction, notify = true) => {
+    if (options.disabled) return;
+    for (let i = value + direction; i >= 0 && i < items.length; i += direction) if (!items[i]?.disabled) {
+      choose(i, notify);
+      break;
+    }
+  };
+  const form = root.closest("form");
+  if (form) scope.on(form, "reset", (event) => scope.timeout(() => {
+    if (!scope.disposed && !event.defaultPrevented) {
+      furthest = initial;
+      choose(initial);
+    }
+  }, 0));
+  paint(false, value);
+  keep(blurIn(rows, { from: "soft", stagger: 0.04, duration: 0.35 }));
+  return {
+    get value() {
+      return value;
+    },
+    setValue(next, notify = false) {
+      const target = clamp5(next);
+      if (!notify && pending && target === pending.value) furthest = pending.furthest;
+      pending = null;
+      choose(target, notify);
+    },
+    next: (notify = true) => move(1, notify),
+    previous: (notify = true) => move(-1, notify),
+    reset: (notify = false) => {
+      pending = null;
+      furthest = initial;
+      choose(initial, notify);
+    },
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/radio-group/shared.ts
+var sequence26 = 0;
+function createChoices(root, prefix, options) {
+  if (!root) return inert({ value: null, setValue() {
+  }, reset() {
+  } });
+  registerMotion();
+  const scope = createScope();
+  const effects = /* @__PURE__ */ new Set();
+  const keep = (effect) => {
+    for (const prior of effects) if (prior.totalProgress() === 1) effects.delete(prior);
+    if (effect) effects.add(effect);
+  };
+  scope.add(() => {
+    effects.forEach((effect) => effect.kill());
+    effects.clear();
+  });
+  const part3 = (tag, parent, name2) => {
+    const el5 = document.createElement(tag);
+    el5.setAttribute(`data-mk-${prefix}-${name2}`, "");
+    parent.append(el5);
+    return el5;
+  };
+  const shell = part3("div", root, "body");
+  scope.add(() => shell.remove());
+  const group = part3("div", shell, "options");
+  group.setAttribute("role", "radiogroup");
+  group.setAttribute("aria-label", options.label ?? "Elige una opci\xF3n");
+  group.setAttribute("aria-required", String(Boolean(options.required)));
+  if (options.disabled) group.setAttribute("aria-disabled", "true");
+  const message = part3("span", shell, "message");
+  message.id = `mk-${prefix}-message-${++sequence26}`;
+  message.setAttribute("aria-live", "polite");
+  group.setAttribute("aria-describedby", message.id);
+  if (options.error) group.setAttribute("aria-invalid", "true");
+  const seen = /* @__PURE__ */ new Set();
+  const items = (Array.isArray(options.items) ? options.items : []).filter((item) => {
+    if (!item || typeof item.value !== "string" || seen.has(item.value)) return false;
+    seen.add(item.value);
+    return true;
+  });
+  const name = options.name ?? `mk-${prefix}-${sequence26}`;
+  const valid2 = (candidate) => candidate != null && items.some((item) => item.value === candidate) ? candidate : null;
+  const initial = valid2(options.defaultValue !== void 0 ? options.defaultValue : options.value);
+  let value = valid2(options.value !== void 0 ? options.value : initial);
+  const labels = [];
+  const inputs = [];
+  for (const item of items) {
+    const label = part3("label", group, "option");
+    const input = part3("input", label, "input");
+    input.type = "radio";
+    input.name = name;
+    input.value = item.value;
+    input.required = Boolean(options.required);
+    input.disabled = Boolean(options.disabled || item.disabled);
+    input.defaultChecked = item.value === initial;
+    const mark = part3("span", label, "mark");
+    mark.setAttribute("aria-hidden", "true");
+    mark.textContent = item.symbol ?? "";
+    const copy = part3("span", label, "copy");
+    part3("span", copy, "label").textContent = item.label;
+    if (item.description) part3("span", copy, "description").textContent = item.description;
+    if (options.error) {
+      input.setAttribute("aria-invalid", "true");
+      input.setAttribute("aria-describedby", message.id);
+    }
+    labels.push(label);
+    inputs.push(input);
+  }
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-variant", options.variant ?? "pill");
+  scope.attr(root, "data-mk-disabled", options.disabled ? "" : null);
+  scope.attr(root, "data-mk-error", options.error ? "" : null);
+  const paint = (animate, before) => {
+    inputs.forEach((input, index) => {
+      input.checked = input.value === value;
+      labels[index].toggleAttribute("data-mk-selected", input.checked);
+    });
+    const caption = options.error ?? (items.length ? options.caption?.(value) ?? "" : "No hay opciones");
+    if (animate && !reduced()) keep(rollDigits(message, caption, Number(value) >= Number(before) ? 1 : -1, 0.28));
+    else message.textContent = caption;
+    const at = (candidate) => items.findIndex((item) => item.value === candidate);
+    options.decorate?.(labels, at(value), at(before), animate && before !== value && !reduced(), keep);
+  };
+  const choose = (next, notify = false, animate = true) => {
+    if (scope.disposed) return;
+    const target = valid2(next);
+    const before = value;
+    value = target;
+    paint(animate, before);
+    if (before === value) return;
+    const index = items.findIndex((item) => item.value === value);
+    if (animate && index >= 0 && !reduced()) {
+      keep(press(labels[index]));
+      keep(gsap.fromTo(labels[index].querySelector(`[data-mk-${prefix}-mark]`), { scale: 0.65, filter: "blur(4px)" }, { scale: 1, filter: "blur(0px)", duration: 0.4, ease: EASE.swatch, overwrite: "auto", clearProps: "transform,filter" }));
+    }
+    if (notify) {
+      const emitted = value;
+      options.onChange?.(emitted);
+      if (!scope.disposed) root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { value: options.eventValue ? options.eventValue(emitted) : emitted } }));
+    }
+  };
+  inputs.forEach((input) => scope.on(input, "change", () => {
+    if (!input.disabled && !input.matches(":disabled") && input.checked) choose(input.value, true);
+    else paint(false, value);
+  }));
+  const form = inputs[0]?.form;
+  if (form) scope.on(form, "reset", (event) => {
+    scope.timeout(() => {
+      if (!scope.disposed && !event.defaultPrevented) choose(initial, false);
+    }, 0);
+  });
+  paint(false, value);
+  keep(blurIn(labels, { from: "soft", stagger: 0.035, duration: 0.35 }));
+  return { get value() {
+    return value;
+  }, setValue: choose, reset: (notify = false) => choose(initial, notify), destroy: () => scope.dispose() };
+}
+
+// src/components/radio-group/engine.ts
+function createRadioGroup(root, options = {}) {
+  return createChoices(root, "radio", options);
+}
+
+// src/components/equalizer-slider/shared.ts
+var finite7 = (n) => typeof n === "number" && Number.isFinite(n);
+var sequence27 = 0;
+function createNumericRange(root, options, design) {
+  if (!root) return inert({ value: design.value, setValue() {
+  }, reset() {
+  }, configure() {
+  } });
+  registerMotion();
+  const scope = createScope();
+  const effects = /* @__PURE__ */ new Set();
+  const keep = (effect) => {
+    for (const prior of effects) if (prior.totalProgress() === 1) effects.delete(prior);
+    if (effect) effects.add(effect);
+  };
+  scope.add(() => {
+    effects.forEach((effect) => effect.kill());
+    effects.clear();
+  });
+  let min = finite7(options.min) ? options.min : design.min;
+  let max = finite7(options.max) && options.max > min ? options.max : Math.max(min + 1, design.max);
+  let step = finite7(options.step) && options.step > 0 ? options.step : 1;
+  let lastStep = Math.max(0, Math.floor((max - min) / step + 1e-8));
+  let format = options.formatValue ?? design.format;
+  const snap = (n) => Number((min + Math.max(0, Math.min(lastStep, Math.round((n - min) / step))) * step).toFixed(8));
+  const initial = snap(finite7(options.defaultValue) ? options.defaultValue : finite7(options.value) ? options.value : design.value);
+  let value = snap(finite7(options.value) ? options.value : initial);
+  let committed = value;
+  let held = false;
+  const prefix = design.prefix;
+  const part3 = (tag, parent, name) => {
+    const el5 = document.createElement(tag);
+    el5.setAttribute(`data-mk-${prefix}-${name}`, "");
+    parent.append(el5);
+    return el5;
+  };
+  const shell = part3("div", root, "body");
+  scope.add(() => shell.remove());
+  const header = part3("div", shell, "header");
+  const label = part3("label", header, "label");
+  label.textContent = options.label ?? design.label;
+  const output = part3("output", header, "output");
+  output.setAttribute("aria-hidden", "true");
+  const track = part3("div", shell, "track");
+  const thumb = part3("span", track, "thumb");
+  thumb.setAttribute("aria-hidden", "true");
+  const input = part3("input", track, "input");
+  input.type = "range";
+  input.min = String(min);
+  input.max = String(max);
+  input.step = String(step);
+  input.defaultValue = String(initial);
+  input.value = String(value);
+  input.id = `mk-${prefix}-${++sequence27}`;
+  label.htmlFor = input.id;
+  input.disabled = Boolean(options.disabled);
+  if (options.name) input.name = options.name;
+  const message = part3("span", shell, "message");
+  message.textContent = options.error ?? "";
+  if (options.error) {
+    message.id = `${input.id}-error`;
+    input.setAttribute("aria-invalid", "true");
+    input.setAttribute("aria-describedby", message.id);
+  }
+  const ends = part3("div", shell, "ends");
+  ends.setAttribute("aria-hidden", "true");
+  const minEnd = part3("span", ends, "min");
+  minEnd.textContent = format(min);
+  const maxEnd = part3("span", ends, "max");
+  maxEnd.textContent = format(max);
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "data-mk-disabled", options.disabled ? "" : null);
+  scope.attr(root, "data-mk-error", options.error ? "" : null);
+  scope.attr(root, "data-mk-held", null);
+  scope.attr(root, "style", root.getAttribute("style"));
+  const decorate = design.decorate?.({ root, track, thumb, scope, keep });
+  let shown4 = null;
+  let glide = null;
+  scope.add(() => glide?.kill());
+  const show = (ratio, animate) => {
+    shown4 = ratio;
+    root.style.setProperty(`--mk-${prefix}-ratio`, String(ratio));
+    decorate?.(ratio, value, animate);
+  };
+  const paint = (animate, before) => {
+    const ratio = (value - min) / (max - min);
+    const text = format(value);
+    input.value = String(value);
+    input.setAttribute("aria-valuetext", text);
+    if (animate && !held && !reduced()) keep(rollDigits(output, text, value >= before ? 1 : -1, 0.3));
+    else {
+      const roll = rollDigits(output, text, value >= before ? 1 : -1, 0);
+      roll?.progress(1).kill();
+      output.textContent = text;
+    }
+    glide?.kill();
+    glide = null;
+    if (animate && !held && !reduced() && shown4 !== null && Math.abs(ratio - shown4) > 1e-4) {
+      const proxy = { ratio: shown4 };
+      glide = gsap.to(proxy, { ratio, duration: 0.5, ease: EASE.swatch, onUpdate: () => show(Math.max(0, Math.min(1, proxy.ratio)), true) });
+    } else show(ratio, animate && !held);
+  };
+  const emit = (type) => {
+    if (scope.disposed) return;
+    const emitted = value;
+    (type === "input" ? options.onInput : options.onChange)?.(emitted);
+    if (!scope.disposed) root.dispatchEvent(new CustomEvent(`mk:${type}`, { bubbles: true, detail: { value: emitted } }));
+  };
+  const set = (next, notify = false, animate = true) => {
+    if (scope.disposed || !finite7(next)) return;
+    const before = value;
+    value = snap(next);
+    paint(animate, before);
+    if (notify && value !== before) {
+      emit("input");
+      committed = value;
+      emit("change");
+    } else if (!notify && value !== before) committed = value;
+  };
+  scope.on(input, "input", () => {
+    if (input.disabled || input.matches(":disabled")) {
+      input.value = String(value);
+      return;
+    }
+    const before = value;
+    value = snap(Number(input.value));
+    paint(true, before);
+    if (value !== before) emit("input");
+  });
+  scope.on(input, "change", () => {
+    if (input.disabled || input.matches(":disabled")) return;
+    const before = value;
+    value = snap(Number(input.value));
+    if (value !== before) paint(true, before);
+    if (value !== committed) {
+      committed = value;
+      emit("change");
+    }
+  });
+  scope.on(input, "pointerdown", () => {
+    if (input.disabled || input.matches(":disabled")) return;
+    held = true;
+    root.setAttribute("data-mk-held", "");
+    keep(press(thumb));
+  });
+  const release = () => {
+    if (!held) return;
+    held = false;
+    root.removeAttribute("data-mk-held");
+    if (!reduced()) keep(gsap.fromTo(thumb, { scale: 1.12 }, { scale: 1, duration: 0.4, ease: EASE.swatch, overwrite: "auto", clearProps: "transform" }));
+  };
+  scope.on(window, "pointerup", release);
+  scope.on(window, "pointercancel", release);
+  scope.on(input, "blur", release);
+  if (input.form) scope.on(input.form, "reset", (event) => scope.timeout(() => {
+    if (!scope.disposed && !event.defaultPrevented) set(initial);
+  }, 0));
+  const configure = (next, notify = false) => {
+    if (scope.disposed) return;
+    const before = value;
+    if (finite7(next.min)) min = next.min;
+    if (finite7(next.max)) max = next.max > min ? next.max : min + 1;
+    if (finite7(next.step) && next.step > 0) step = next.step;
+    if (next.format) format = next.format;
+    lastStep = Math.max(0, Math.floor((max - min) / step + 1e-8));
+    input.min = String(min);
+    input.max = String(max);
+    input.step = String(step);
+    const ends2 = [[minEnd, format(min)], [maxEnd, format(max)]];
+    for (const [end, text] of ends2) {
+      if (reduced()) end.textContent = text;
+      else keep(rollDigits(end, text, 1, 0.3));
+    }
+    value = snap(finite7(next.value) ? next.value : value);
+    paint(true, before);
+    if (value !== before) {
+      committed = value;
+      if (notify) {
+        emit("input");
+        emit("change");
+      }
+    }
+  };
+  paint(false, value);
+  return { get value() {
+    return value;
+  }, setValue: set, reset: (notify = false) => set(initial, notify), configure, destroy: () => scope.dispose() };
+}
+
+// src/components/equalizer-slider/engine.ts
+function createEqualizerSlider(root, options = {}) {
+  return createNumericRange(root, options, {
+    prefix: "equalizer",
+    label: "Volumen",
+    min: 0,
+    max: 100,
+    value: 60,
+    format: (n) => `${n} %`,
+    decorate({ track, keep }) {
+      const wave = document.createElement("span");
+      wave.dataset.mkEqualizerWave = "";
+      wave.setAttribute("aria-hidden", "true");
+      track.prepend(wave);
+      const count = Math.max(12, Math.min(72, Math.round(Number.isFinite(options.bars) ? options.bars : 40)));
+      const bars = Array.from({ length: count }, (_, i) => {
+        const bar = document.createElement("span");
+        const supplied = options.waveform?.[i % options.waveform.length];
+        const height = Number.isFinite(supplied) ? Math.max(0.1, Math.min(1, supplied)) : 0.25 + 0.75 * Math.abs(Math.sin(i * 1.73) * Math.cos(i * 0.41));
+        bar.style.height = `${height * 100}%`;
+        wave.append(bar);
+        return bar;
+      });
+      return (ratio, _value, animate) => bars.forEach((bar, i) => {
+        const on = i / Math.max(1, count - 1) <= ratio;
+        const changed = bar.hasAttribute("data-mk-on") !== on;
+        bar.toggleAttribute("data-mk-on", on);
+        if (animate && changed && !reduced()) keep(gsap.fromTo(bar, { scaleY: 0.72 }, { scaleY: 1, duration: 0.35, ease: EASE.swatch, overwrite: "auto", clearProps: "transform" }));
+      });
+    }
+  });
+}
+
+// src/components/temperature-slider/engine.ts
+var RANGE = { C: { min: 16, max: 30, value: 22 }, F: { min: 60, max: 86, value: 72 } };
+var convert = (value, from, to) => from === to ? value : to === "F" ? value * 9 / 5 + 32 : (value - 32) * 5 / 9;
+function createTemperatureSlider(root, options = {}) {
+  let unit = options.unit === "F" ? "F" : "C";
+  const formatFor = (next) => (n) => `${n}\xB0${next}`;
+  const range = createNumericRange(root, options, {
+    prefix: "temperature",
+    label: "Temperatura",
+    ...RANGE[unit],
+    format: formatFor(unit),
+    decorate({ track, thumb }) {
+      const rail = document.createElement("span");
+      rail.dataset.mkTemperatureRail = "";
+      rail.setAttribute("aria-hidden", "true");
+      track.prepend(rail);
+      const fill = document.createElement("span");
+      fill.dataset.mkTemperatureFill = "";
+      rail.append(fill);
+      const ticks = document.createElement("span");
+      ticks.dataset.mkTemperatureTicks = "";
+      ticks.setAttribute("aria-hidden", "true");
+      for (let i = 0; i <= 14; i++) ticks.append(document.createElement("i"));
+      track.prepend(ticks);
+      thumb.textContent = "\xB7\xB7";
+      return (ratio) => {
+        root?.style.setProperty("--mk-temperature-warm", `${Math.round(ratio * 100)}%`);
+        fill.style.width = `${ratio * 100}%`;
+      };
+    }
+  });
+  return {
+    get value() {
+      return range.value;
+    },
+    get unit() {
+      return unit;
+    },
+    setValue: range.setValue,
+    reset: range.reset,
+    setUnit(next, limits = {}, notify = false) {
+      const target = next === "F" ? "F" : "C";
+      const value = Math.round(convert(range.value, unit, target));
+      unit = target;
+      range.configure({ min: limits.min ?? RANGE[target].min, max: limits.max ?? RANGE[target].max, step: limits.step, format: options.formatValue ?? formatFor(target), value }, notify);
+    },
+    destroy: range.destroy
+  };
+}
+
+// src/components/rating-scale/engine.ts
+var SENTIMENTS = ["Muy mal", "Mal", "Regular", "Bien", "Muy bien"];
+var SYMBOLS = ["\u2322", "\u2322", "\u2212", "\u2323", "\u2323"];
+function createRatingScale(root, options = {}) {
+  if (!root) return inert({ value: null, setValue() {
+  }, reset() {
+  } });
+  const sentiment = options.variant === "sentiment";
+  const min = Number.isFinite(options.min) ? Math.round(options.min) : sentiment ? 1 : 0;
+  const max = Number.isFinite(options.max) ? Math.max(min, Math.min(min + 20, Math.round(options.max))) : sentiment ? min + 4 : min + 10;
+  const labels = options.labels ?? (sentiment ? SENTIMENTS : []);
+  const items = Array.from({ length: max - min + 1 }, (_, i) => ({
+    value: String(min + i),
+    label: labels[i] ?? String(min + i),
+    symbol: sentiment ? SYMBOLS[Math.min(4, Math.round(i / Math.max(1, max - min) * 4))] : String(min + i)
+  }));
+  const normalize3 = (value) => value != null && Number.isFinite(value) ? String(Math.max(min, Math.min(max, Math.round(value)))) : null;
+  const instance = createChoices(root, "rating-scale", {
+    ...options,
+    variant: sentiment ? "sentiment" : "numbered",
+    items,
+    value: normalize3(options.value !== void 0 ? options.value : options.defaultValue),
+    defaultValue: normalize3(options.defaultValue !== void 0 ? options.defaultValue : options.value),
+    caption: (value) => value === null ? "Sin responder" : labels[Number(value) - min] ?? `${value} de ${max}`,
+    eventValue: (value) => value === null ? null : Number(value),
+    onChange: (value) => options.onChange?.(value === null ? null : Number(value)),
+    decorate(labels2, index, previous, animate, keep) {
+      labels2.forEach((label, i) => label.toggleAttribute("data-mk-in-range", !sentiment && index >= 0 && i < index));
+      if (!animate || index < 0) return;
+      if (sentiment) {
+        const mood = index / Math.max(1, labels2.length - 1) * 2 - 1;
+        const mark = labels2[index].querySelector("[data-mk-rating-scale-mark]");
+        keep(gsap.timeline().to(mark, { y: mood > 0 ? -8 * mood : 4 * -mood, rotate: mood === 0 ? 8 : 12 * mood, duration: 0.14, ease: "power2.out" }).to(mark, { y: 0, rotate: 0, duration: 0.55, ease: EASE.click, clearProps: "y,rotate" }));
+        return;
+      }
+      const from = previous >= 0 ? previous : 0, step = index >= from ? 1 : -1;
+      for (let i = from, k = 0; i !== index; i += step, k++) {
+        keep(gsap.timeline({ delay: Math.min(k * 0.03, 0.3) }).to(labels2[i], { y: -5, duration: 0.12, ease: "power2.out" }).to(labels2[i], { y: 0, duration: 0.4, ease: EASE.click, clearProps: "y" }));
+      }
+    }
+  });
+  return {
+    get value() {
+      return instance.value === null ? null : Number(instance.value);
+    },
+    setValue: (value, notify = false) => instance.setValue(normalize3(value), notify),
+    reset: (notify = false) => instance.reset(notify),
+    destroy: () => instance.destroy()
+  };
+}
+
+// src/components/notification-stack/engine.ts
+var sequence28 = 0;
+function createNotificationStack(root, options = {}) {
+  if (!root) return inert({ push() {
+  }, dismiss() {
+  }, clear() {
+  }, expand() {
+  }, collapse() {
+  }, toggle() {
+  }, setOptions() {
+  }, items: [], expanded: false });
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  let expanded = options.expanded ?? false;
+  let hovered = false;
+  let focused = false;
+  let inviting = false;
+  let resize = null;
+  const heights = /* @__PURE__ */ new WeakMap();
+  const original = [...root.childNodes];
+  const entries = /* @__PURE__ */ new Map();
+  const animations = /* @__PURE__ */ new Set();
+  const track = (animation) => {
+    for (const prior of animations) if (prior.totalProgress() === 1 || !prior.parent) animations.delete(prior);
+    if (animation) animations.add(animation);
+  };
+  const deck = document.createElement("div");
+  deck.className = "mk-notification-stack__deck";
+  deck.id = `mk-notifications-${++sequence28}`;
+  const empty = document.createElement("p");
+  empty.className = "mk-notification-stack__empty";
+  const toggle = document.createElement("button");
+  toggle.type = "button";
+  toggle.className = "mk-notification-stack__toggle";
+  toggle.setAttribute("aria-controls", deck.id);
+  const count = document.createElement("span");
+  const toggleText = document.createElement("span");
+  const chevron2 = document.createElement("span");
+  chevron2.className = "mk-notification-stack__chevron";
+  chevron2.setAttribute("aria-hidden", "true");
+  chevron2.innerHTML = '<svg viewBox="0 0 16 16"><path d="m4 6 4 4 4-4"/></svg>';
+  toggle.append(count, toggleText, chevron2);
+  const live2 = document.createElement("span");
+  live2.className = "mk-sr-only";
+  live2.setAttribute("role", "status");
+  live2.setAttribute("aria-live", "polite");
+  root.replaceChildren(deck, empty, toggle, live2);
+  scope.attr(root, "class", `${root.className} mk-notification-stack`.trim());
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "role", "region");
+  const pause = (entry) => {
+    if (entry.timer !== void 0) {
+      clearTimeout(entry.timer);
+      entry.timer = void 0;
+      entry.remaining = Math.max(0, entry.remaining - (Date.now() - entry.started));
+    }
+  };
+  const paused = () => hovered || focused || opts.disabled || document.hidden;
+  const start = (entry) => {
+    if (paused() || entry.remaining === Infinity || entry.timer !== void 0) return;
+    entry.started = Date.now();
+    entry.timer = setTimeout(() => dismiss(entry.item.id), entry.remaining);
+  };
+  const syncTimers = () => entries.forEach((entry) => paused() ? pause(entry) : start(entry));
+  const duration = (item) => {
+    const ms = item.duration ?? opts.duration ?? 6e3;
+    return Number.isFinite(ms) && ms > 0 ? ms : Infinity;
+  };
+  const layout = (motion) => {
+    if (scope.disposed) return;
+    const cards = [...entries.values()].reverse();
+    const direction = opts.direction === "up" || opts.direction === "side" ? opts.direction : "down";
+    scope.attr(root, "data-mk-direction", direction);
+    scope.attr(root, "data-mk-expandable", !expanded && cards.length > 1 && !opts.disabled ? "" : null);
+    const peek = inviting && !expanded && !reduced() ? 18 : 12;
+    cards.forEach((entry, index) => {
+      const visible = expanded || index === 0;
+      entry.card.inert = !visible || !!opts.disabled;
+      entry.card.setAttribute("aria-hidden", String(!visible));
+      entry.card.toggleAttribute("data-mk-peek", !visible);
+    });
+    if (cards[0]) deck.style.setProperty("--mk-stack-front", `${cards[0].card.offsetHeight}px`);
+    let offset = 0;
+    let tallest = 0;
+    cards.forEach((entry, index) => {
+      entry.card.style.zIndex = String(cards.length - index);
+      const layer = Math.min(index, 3);
+      let x = 0, y = 0;
+      if (expanded) {
+        if (direction === "side") x = offset;
+        else y = direction === "up" ? -offset : offset;
+        offset += direction === "side" ? entry.card.offsetWidth + 12 : entry.card.offsetHeight + 8;
+      } else if (direction === "side") x = layer * peek;
+      else y = (direction === "up" ? -1 : 1) * layer * peek;
+      tallest = Math.max(tallest, entry.card.offsetHeight);
+      const delay = reduced() ? 0 : motion === "expand" ? index * 0.05 : motion === "collapse" ? Math.max(0, cards.length - 1 - index) * 0.03 : 0;
+      entry.card.style.setProperty("--mk-stack-delay", `${delay}s`);
+      track(gsap.to(entry.card, { x, y, scale: expanded ? 1 : Math.max(0.84, 1 - index * 0.045), opacity: expanded || index < 3 ? 1 : 0, duration: reduced() ? 0 : 0.45, delay, ease: EASE.swatch, overwrite: "auto" }));
+      if (motion === "expand" && index > 0 && !reduced()) track(gsap.fromTo(entry.card, { filter: "blur(6px)" }, { filter: "blur(0px)", duration: 0.4, delay, ease: "power2.out", clearProps: "filter" }));
+    });
+    const front = cards[0]?.card.offsetHeight || 100;
+    const height = !cards.length ? 0 : direction === "side" ? expanded ? tallest : front : expanded ? offset - 8 : front + Math.min(cards.length - 1, 2) * peek;
+    if (!expanded && direction === "side" && deck.scrollLeft) deck.scrollTo({ left: 0, behavior: reduced() ? "auto" : "smooth" });
+    track(gsap.to(deck, { height, duration: reduced() ? 0 : 0.4, ease: EASE.signature, overwrite: "auto" }));
+    empty.hidden = cards.length > 0;
+    empty.textContent = opts.labels?.empty ?? "Todo al d\xEDa. No hay notificaciones.";
+    toggle.hidden = cards.length < 2;
+    toggle.disabled = !!opts.disabled;
+    toggle.setAttribute("aria-expanded", String(expanded));
+    const toggleLabel = expanded ? opts.labels?.collapse ?? "Recoger" : opts.labels?.expand ?? "Ver todas";
+    if (toggleText.textContent !== toggleLabel) {
+      toggleText.textContent = toggleLabel;
+      if (motion) track(blurIn(toggleText, { from: "soft", duration: 0.25 }));
+    }
+    track(rollDigits(count, String(cards.length)));
+    scope.attr(root, "aria-label", opts.label ?? "Notificaciones");
+    scope.attr(root, "data-mk-expanded", String(expanded));
+    scope.attr(root, "data-mk-disabled", opts.disabled ? "" : null);
+  };
+  const dismiss = (id) => {
+    if (scope.disposed || opts.disabled) return;
+    const entry = entries.get(id);
+    if (!entry) return;
+    pause(entry);
+    resize?.unobserve(entry.card);
+    const hadFocus = entry.card.contains(document.activeElement);
+    entries.delete(id);
+    if (hadFocus) {
+      const next = [...entries.values()].reverse()[0];
+      const target = next?.card.querySelector("button");
+      if (target) {
+        next.card.inert = false;
+        target.focus();
+      } else {
+        root.setAttribute("tabindex", "-1");
+        root.focus();
+      }
+    }
+    gsap.killTweensOf(entry.card);
+    entry.card.inert = true;
+    entry.card.setAttribute("aria-hidden", "true");
+    if (reduced()) entry.card.remove();
+    else track(gsap.to(entry.card, { y: "-=18", scale: 0.94, opacity: 0, filter: "blur(8px)", duration: 0.23, ease: EASE.close, onComplete: () => entry.card.remove() }));
+    layout();
+    opts.onDismiss?.(id);
+    root.dispatchEvent(new CustomEvent("mk:dismiss", { bubbles: true, detail: { id } }));
+  };
+  const build = (item) => {
+    const card = document.createElement("article");
+    card.className = "mk-notification-stack__card";
+    card.dataset.mkNotification = item.id;
+    card.dataset.mkTone = item.tone ?? "neutral";
+    const mark = document.createElement("span");
+    mark.className = "mk-notification-stack__mark";
+    mark.setAttribute("aria-hidden", "true");
+    mark.textContent = item.tone === "success" ? "\u2713" : item.tone === "error" ? "!" : "\u2197";
+    const body = document.createElement("div");
+    body.className = "mk-notification-stack__body";
+    const title = document.createElement("strong");
+    title.textContent = item.title;
+    body.append(title);
+    if (item.description) {
+      const description = document.createElement("p");
+      description.textContent = item.description;
+      body.append(description);
+    }
+    if (item.action) {
+      const action = document.createElement("button");
+      action.type = "button";
+      action.className = "mk-notification-stack__action";
+      action.dataset.mkNotificationAction = item.id;
+      action.textContent = item.action.label;
+      action.disabled = !!opts.disabled;
+      body.append(action);
+    }
+    card.append(mark, body);
+    if (item.dismissible !== false) {
+      const close = document.createElement("button");
+      close.type = "button";
+      close.className = "mk-notification-stack__dismiss";
+      close.dataset.mkNotificationDismiss = item.id;
+      close.setAttribute("aria-label", `${opts.labels?.dismiss ?? "Cerrar"}: ${item.title}`);
+      close.textContent = "\xD7";
+      close.disabled = !!opts.disabled;
+      card.append(close);
+    }
+    return { item: { ...item }, card, remaining: duration(item), started: 0 };
+  };
+  const push = (item) => {
+    if (scope.disposed || !item.id || entries.has(item.id)) return;
+    const entry = build(item);
+    entries.set(item.id, entry);
+    deck.append(entry.card);
+    resize?.observe(entry.card);
+    layout();
+    track(blurIn(entry.card, { from: "pop", duration: 0.35 }));
+    live2.textContent = `${item.title}${item.description ? `. ${item.description}` : ""}`;
+    start(entry);
+  };
+  const setExpanded = (next, notify = true, allowDisabled = false) => {
+    if (scope.disposed || expanded === next || opts.disabled && !allowDisabled) return;
+    if (!next && [...entries.values()].slice(0, -1).some((entry) => entry.card.contains(document.activeElement))) {
+      if (opts.disabled) {
+        root.tabIndex = -1;
+        root.focus();
+      } else toggle.focus();
+    }
+    expanded = next;
+    layout(next ? "expand" : "collapse");
+    if (notify) {
+      opts.onExpandedChange?.(expanded);
+      root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { expanded } }));
+    }
+  };
+  scope.attr(root, "tabindex", root.getAttribute("tabindex"));
+  scope.on(root, "pointerenter", () => {
+    hovered = true;
+    syncTimers();
+  });
+  scope.on(root, "pointerleave", () => {
+    hovered = false;
+    syncTimers();
+  });
+  scope.on(root, "focusin", () => {
+    focused = true;
+    syncTimers();
+  });
+  scope.on(root, "focusout", (event) => {
+    focused = root.contains(event.relatedTarget);
+    syncTimers();
+  });
+  scope.on(document, "visibilitychange", syncTimers);
+  scope.on(deck, "pointerenter", () => {
+    inviting = true;
+    if (!expanded && entries.size > 1) layout();
+  });
+  scope.on(deck, "pointerleave", () => {
+    inviting = false;
+    if (!expanded && entries.size > 1) layout();
+  });
+  scope.on(root, "click", (event) => {
+    if (opts.disabled) return;
+    if (!expanded && entries.size > 1 && deck.contains(event.target) && !event.target.closest("button")) {
+      setExpanded(true);
+      return;
+    }
+    const button2 = event.target.closest("button");
+    if (!button2 || !root.contains(button2) || button2.disabled) return;
+    track(press(button2));
+    if (button2 === toggle) setExpanded(!expanded);
+    else if (button2.dataset.mkNotificationDismiss) dismiss(button2.dataset.mkNotificationDismiss);
+    else if (button2.dataset.mkNotificationAction) {
+      const id = button2.dataset.mkNotificationAction;
+      entries.get(id)?.item.action?.onClick?.();
+      opts.onAction?.(id);
+      dismiss(id);
+    }
+  });
+  if (typeof ResizeObserver === "function") {
+    resize = scope.observe(new ResizeObserver((records) => {
+      let changed = false;
+      for (const record of records) {
+        const card = record.target;
+        if (heights.get(card) !== card.offsetHeight) {
+          heights.set(card, card.offsetHeight);
+          changed = true;
+        }
+      }
+      if (changed) layout();
+    }));
+  }
+  scope.on(window, "resize", () => layout(), { passive: true });
+  const setOptions = (next) => {
+    if (scope.disposed) return;
+    opts = { ...opts, ...next };
+    if (next.items) {
+      const ids = new Set(next.items.map((item) => item.id));
+      for (const [id, entry] of entries) if (!ids.has(id)) {
+        pause(entry);
+        resize?.unobserve(entry.card);
+        if (entry.card.contains(document.activeElement)) {
+          root.setAttribute("tabindex", "-1");
+          root.focus();
+        }
+        gsap.killTweensOf(entry.card);
+        entry.card.remove();
+        entries.delete(id);
+      }
+      for (const item of next.items) {
+        const existing = entries.get(item.id);
+        if (!existing) {
+          push(item);
+          continue;
+        }
+        const replacement = build(item);
+        if (existing.card.contains(document.activeElement)) {
+          root.setAttribute("tabindex", "-1");
+          root.focus();
+        }
+        pause(existing);
+        replacement.remaining = existing.remaining;
+        existing.card.replaceWith(replacement.card);
+        gsap.killTweensOf(existing.card);
+        entries.set(item.id, replacement);
+        resize?.unobserve(existing.card);
+        resize?.observe(replacement.card);
+      }
+      const ordered = next.items.map((item) => entries.get(item.id)).filter((entry) => !!entry);
+      entries.clear();
+      for (const entry of ordered) {
+        entries.set(entry.item.id, entry);
+        deck.append(entry.card);
+      }
+    }
+    if (next.expanded !== void 0) setExpanded(next.expanded, false, true);
+    for (const entry of entries.values()) entry.card.querySelectorAll("button").forEach((button2) => {
+      button2.disabled = !!opts.disabled;
+      if (button2.hasAttribute("data-mk-notification-dismiss")) button2.setAttribute("aria-label", `${opts.labels?.dismiss ?? "Cerrar"}: ${entry.item.title}`);
+    });
+    layout();
+    syncTimers();
+  };
+  for (const item of options.items ?? []) push(item);
+  layout();
+  return {
+    push,
+    dismiss,
+    clear() {
+      for (const id of [...entries.keys()]) dismiss(id);
+    },
+    expand: () => setExpanded(true),
+    collapse: () => setExpanded(false),
+    toggle: () => setExpanded(!expanded),
+    setOptions,
+    get items() {
+      return [...entries.values()].map((entry) => ({ ...entry.item }));
+    },
+    get expanded() {
+      return expanded;
+    },
+    destroy() {
+      if (scope.disposed) return;
+      entries.forEach(pause);
+      animations.forEach((animation) => animation.kill());
+      gsap.killTweensOf([...root.querySelectorAll("*")]);
+      scope.dispose();
+      root.replaceChildren(...original);
+    }
+  };
+}
+
+// src/components/bento-grid/engine.ts
+function createBentoGrid(root, options = {}) {
+  if (!root) return inert({ refresh() {
+  }, setFilter() {
+  }, reorder() {
+  }, mutate() {
+  }, setOptions() {
+  }, filter: null, keys: [] });
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  let filter = opts.filter ?? null;
+  let animation = null;
+  const micro = /* @__PURE__ */ new Set();
+  const track = (value) => {
+    if (value) micro.add(value);
+  };
+  const originals = [...root.childNodes];
+  const originalItems = new Set(root.children);
+  const remembered = /* @__PURE__ */ new Set();
+  let queued = 0;
+  scope.attr(root, "class", `${root.className} mk-bento-grid`.trim());
+  scope.attr(root, "style", root.getAttribute("style"));
+  scope.attr(root, "data-mk-ready", "");
+  const items = () => [...root.children].filter((node) => node instanceof HTMLElement && node.hasAttribute("data-mk-bento-item"));
+  const key2 = (item) => item.dataset.mkBentoItem;
+  const visible = () => items().filter((item) => !item.hidden);
+  const save = (item) => {
+    if (remembered.has(item)) return;
+    remembered.add(item);
+    for (const attr of ["style", "hidden", "inert", "aria-hidden", "data-flip-id"]) scope.attr(item, attr, item.getAttribute(attr));
+  };
+  items().forEach(save);
+  let last;
+  const notify = () => {
+    const keys = visible().map(key2);
+    opts.onChange?.(keys);
+    root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { keys, filter } }));
+  };
+  const paint = () => {
+    const desired = Number.isFinite(opts.columns) ? Math.max(1, Math.min(12, Math.round(opts.columns))) : 3;
+    const cols = root.clientWidth > 0 && root.clientWidth < 280 ? 1 : root.clientWidth > 0 && root.clientWidth < 440 ? Math.min(2, desired) : desired;
+    root.style.setProperty("--mk-bento-columns", String(cols));
+    root.style.setProperty("--mk-bento-gap", `${Math.max(0, opts.gap ?? 12)}px`);
+    items().forEach((item) => {
+      save(item);
+      item.style.setProperty("--mk-bento-col-span", String(Math.max(1, Math.min(cols, Number(item.dataset.mkColSpan) || 1))));
+      item.style.setProperty("--mk-bento-row-span", String(Math.max(1, Math.min(8, Number(item.dataset.mkRowSpan) || 1))));
+      const show = !filter || (item.dataset.mkCategory ?? "").split(/\s+/).includes(filter);
+      if (!show && item.contains(document.activeElement)) {
+        scope.attr(root, "tabindex", root.getAttribute("tabindex"));
+        root.tabIndex = -1;
+        root.focus();
+      }
+      item.hidden = !show;
+      item.inert = !show;
+      item.setAttribute("aria-hidden", String(!show));
+    });
+    scope.attr(root, "data-mk-empty", visible().length ? null : "");
+    if (!root.hasAttribute("data-mk-empty-label")) scope.attr(root, "data-mk-empty-label", "No hay elementos en esta vista.");
+  };
+  const transition = (state = last, entering = []) => {
+    if (scope.disposed) return;
+    animation?.kill();
+    paint();
+    if (!reduced()) {
+      animation = Flip.from(state ?? Flip.getState([]), { targets: visible(), duration: Math.max(0, opts.duration ?? 0.55), ease: EASE.signature, stagger: 0.025, absolute: false, scale: false, prune: true, onComplete: () => {
+        if (!scope.disposed) last = Flip.getState(visible());
+      } });
+      track(blurIn(entering.filter((item) => !item.hidden), { from: "soft", stagger: 0.04, duration: 0.35 }));
+    }
+    if (!reduced()) last = Flip.getState(visible());
+  };
+  const capture = () => {
+    animation?.kill();
+    if (reduced()) return void 0;
+    const focused = document.activeElement;
+    Flip.killFlipsOf(items());
+    const state = Flip.getState(visible());
+    if (focused?.isConnected && focused !== document.activeElement) focused.focus({ preventScroll: true });
+    return state;
+  };
+  const mutate = (change) => {
+    if (scope.disposed) return;
+    const focused = document.activeElement;
+    const state = capture();
+    const before = new Set(items());
+    change();
+    transition(state, items().filter((item) => !before.has(item)));
+    if (focused && focused !== document.body && root.contains(focused) && !focused.closest("[hidden], [inert]")) focused.focus({ preventScroll: true });
+    else if (focused && !focused.isConnected) {
+      scope.attr(root, "tabindex", root.getAttribute("tabindex"));
+      root.tabIndex = -1;
+      root.focus();
+    }
+    observer?.takeRecords();
+    notify();
+  };
+  const setFilter = (next) => {
+    if (scope.disposed || next === filter) return;
+    const state = capture();
+    const before = new Set(visible());
+    filter = next;
+    paint();
+    transition(state, visible().filter((item) => !before.has(item)));
+    notify();
+  };
+  const refresh = () => {
+    if (scope.disposed) return;
+    transition(last, items().filter((item) => !remembered.has(item)));
+  };
+  const observer = typeof MutationObserver === "function" ? scope.observe(new MutationObserver((records) => {
+    if (!records.some((record) => record.type === "childList" ? record.target === root : record.target instanceof HTMLElement && record.target.parentElement === root)) return;
+    cancelAnimationFrame(queued);
+    queued = requestAnimationFrame(refresh);
+  })) : null;
+  observer?.observe(root, { childList: true, subtree: true, attributes: true, attributeFilter: ["data-mk-category", "data-mk-col-span", "data-mk-row-span"] });
+  scope.on(root, "click", (event) => {
+    const control = event.target.closest("button, a");
+    if (control && root.contains(control) && !control.matches(':disabled, [aria-disabled="true"]')) {
+      scope.attr(control, "style", control.getAttribute("style"));
+      track(press(control));
+    }
+  });
+  if (typeof ResizeObserver === "function") {
+    let width = root.clientWidth;
+    const resize = scope.observe(new ResizeObserver(() => {
+      if (root.clientWidth !== width) {
+        width = root.clientWidth;
+        animation?.kill();
+        paint();
+        last = Flip.getState(visible());
+      }
+    }));
+    resize.observe(root);
+  }
+  paint();
+  if (!reduced()) last = Flip.getState(visible());
+  track(blurIn(visible(), { from: "soft", stagger: 0.04 }));
+  return {
+    refresh,
+    mutate,
+    setFilter,
+    reorder(keys) {
+      mutate(() => {
+        const byKey = new Map(items().map((item) => [key2(item), item]));
+        for (const id of new Set(keys)) {
+          const item = byKey.get(id);
+          if (item) {
+            root.append(item);
+            byKey.delete(id);
+          }
+        }
+        byKey.forEach((item) => root.append(item));
+      });
+    },
+    setOptions(next) {
+      if (scope.disposed) return;
+      const state = capture();
+      opts = { ...opts, ...next };
+      if (next.filter !== void 0) filter = next.filter;
+      transition(state);
+    },
+    get filter() {
+      return filter;
+    },
+    get keys() {
+      return visible().map(key2);
+    },
+    destroy() {
+      if (scope.disposed) return;
+      cancelAnimationFrame(queued);
+      animation?.kill();
+      micro.forEach((value) => value.kill());
+      if (!reduced()) Flip.killFlipsOf(items());
+      gsap.killTweensOf([...remembered]);
+      scope.dispose();
+      const added = [...root.childNodes].filter((node) => !originals.includes(node) && !(node instanceof Element && originalItems.has(node)));
+      root.replaceChildren(...originals, ...added);
+    }
+  };
+}
+
+// src/components/scroll-preview-dock/engine.ts
+function createScrollPreviewDock(root, options = {}) {
+  if (!root) return inert({ select() {
+  }, update() {
+  }, setOptions() {
+  }, value: "" });
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  let current3 = "";
+  let previewed = "";
+  let frame = 0;
+  let scrolling = null;
+  let unbindScroller = () => {
+  };
+  let scroller = null;
+  const original = [...root.childNodes];
+  const animations = /* @__PURE__ */ new Set();
+  const track = (animation) => {
+    if (animation) animations.add(animation);
+  };
+  const panel = document.createElement("div");
+  panel.className = "mk-scroll-preview-dock__preview";
+  panel.setAttribute("aria-hidden", "true");
+  const image = document.createElement("span");
+  image.className = "mk-scroll-preview-dock__image";
+  const copy = document.createElement("span");
+  const title = document.createElement("strong");
+  const description = document.createElement("span");
+  description.className = "mk-scroll-preview-dock__description";
+  copy.append(title, description);
+  panel.append(image, copy);
+  const nav = document.createElement("nav");
+  nav.className = "mk-scroll-preview-dock__nav";
+  const pill = document.createElement("span");
+  pill.className = "mk-scroll-preview-dock__pill";
+  pill.setAttribute("aria-hidden", "true");
+  const empty = document.createElement("p");
+  empty.className = "mk-scroll-preview-dock__empty";
+  empty.textContent = "No hay secciones para explorar.";
+  root.replaceChildren(panel, nav, empty);
+  scope.attr(root, "class", `${root.className} mk-scroll-preview-dock`.trim());
+  scope.attr(root, "data-mk-ready", "");
+  const items = () => opts.items ?? [];
+  const enabled = (item) => !opts.disabled && !item.disabled;
+  const section = (item) => {
+    if (item.section instanceof HTMLElement) return item.section;
+    if (!item.section) return document.getElementById(item.id);
+    try {
+      return (scroller ?? document).querySelector(item.section);
+    } catch {
+      return null;
+    }
+  };
+  const links = () => [...nav.querySelectorAll("a")];
+  const thumb = (node, item) => {
+    node.replaceChildren();
+    if (item.thumbnail) {
+      const img = document.createElement("img");
+      img.src = item.thumbnail;
+      img.alt = "";
+      img.draggable = false;
+      node.append(img);
+    } else {
+      const letter = document.createElement("span");
+      letter.textContent = item.label.slice(0, 2);
+      node.append(letter);
+    }
+  };
+  const preview = (id, animate = true) => {
+    const item = items().find((item2) => item2.id === id);
+    if (!item || previewed === id) return;
+    previewed = id;
+    thumb(image, item);
+    title.textContent = item.label;
+    description.textContent = item.description ?? "Explorar secci\xF3n";
+    for (const link of links()) link.dataset.mkPreview = String(link.dataset.mkSection === id);
+    if (animate) {
+      gsap.killTweensOf(panel);
+      track(blurIn(panel, { from: "soft", duration: 0.28 }));
+    }
+  };
+  const place3 = (animate = true) => {
+    const active = links().find((link) => link.dataset.mkSection === current3);
+    pill.hidden = !active;
+    if (!active) return;
+    track(gsap.to(pill, { x: active.offsetLeft, y: active.offsetTop, width: active.offsetWidth, height: active.offsetHeight, duration: reduced() || !animate ? 0 : 0.45, ease: EASE.swatch, overwrite: "auto" }));
+  };
+  const activate = (id, notify = true) => {
+    if (scope.disposed || current3 === id) return;
+    current3 = id;
+    for (const link of links()) {
+      if (link.dataset.mkSection === id) link.setAttribute("aria-current", "location");
+      else link.removeAttribute("aria-current");
+    }
+    place3();
+    if (!root.contains(document.activeElement) && !root.matches(":hover")) preview(id);
+    else if (!previewed) preview(id, false);
+    if (notify) {
+      opts.onChange?.(id);
+      root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { value: id } }));
+    }
+  };
+  const update = () => {
+    frame = 0;
+    if (scope.disposed) return;
+    const top = scroller ? scroller.getBoundingClientRect().top + scroller.clientTop : 0;
+    const height = scroller ? scroller.clientHeight : window.innerHeight;
+    const line = top + Math.min(120, height * 0.3) + (opts.offset ?? 0);
+    const targets = items().filter(enabled).map((item) => ({ item, node: section(item) })).filter((entry) => !!entry.node);
+    let target = targets[0];
+    for (const entry of targets) if (entry.node.getBoundingClientRect().top <= line) target = entry;
+    const atEnd = scroller ? scroller.scrollHeight > scroller.clientHeight && scroller.scrollTop + scroller.clientHeight >= scroller.scrollHeight - 2 : document.documentElement.scrollHeight > window.innerHeight && window.scrollY + window.innerHeight >= document.documentElement.scrollHeight - 2;
+    if (atEnd) target = targets.at(-1);
+    if (target) activate(target.item.id);
+    place3(false);
+  };
+  const queue = () => {
+    if (!frame) frame = requestAnimationFrame(update);
+  };
+  const bindScroller = () => {
+    unbindScroller();
+    scroller = typeof opts.scroller === "string" ? (() => {
+      try {
+        return root.closest(opts.scroller) ?? document.querySelector(opts.scroller);
+      } catch {
+        return null;
+      }
+    })() : opts.scroller ?? null;
+    const target = scroller ?? window;
+    target.addEventListener("scroll", queue, { passive: true });
+    target.addEventListener("wheel", cancelScroll, { passive: true });
+    target.addEventListener("touchstart", cancelScroll, { passive: true });
+    unbindScroller = () => {
+      target.removeEventListener("scroll", queue);
+      target.removeEventListener("wheel", cancelScroll);
+      target.removeEventListener("touchstart", cancelScroll);
+    };
+  };
+  function cancelScroll() {
+    scrolling?.kill();
+    scrolling = null;
+  }
+  const select = (id) => {
+    if (scope.disposed) return;
+    const item = items().find((entry) => entry.id === id);
+    if (!item || !enabled(item)) return;
+    const target = section(item);
+    if (!target) return;
+    cancelScroll();
+    const top = Math.max(0, (scroller ? scroller.scrollTop + target.getBoundingClientRect().top - scroller.getBoundingClientRect().top - scroller.clientTop : window.scrollY + target.getBoundingClientRect().top) - (opts.offset ?? 0));
+    activate(id);
+    preview(id);
+    if (scroller) {
+      if (reduced()) scroller.scrollTop = top;
+      else scrolling = gsap.to(scroller, { scrollTop: top, duration: 0.65, ease: EASE.signature, overwrite: "auto", onUpdate: queue });
+    } else if (reduced()) window.scrollTo({ top, behavior: "instant" });
+    else {
+      const position2 = { top: window.scrollY };
+      scrolling = gsap.to(position2, { top, duration: 0.65, ease: EASE.signature, onUpdate: () => {
+        window.scrollTo(0, position2.top);
+        queue();
+      } });
+    }
+  };
+  const render = () => {
+    gsap.killTweensOf(pill);
+    nav.replaceChildren(pill);
+    nav.setAttribute("aria-label", opts.label ?? "Explorar secciones");
+    const unique = /* @__PURE__ */ new Set();
+    for (const item of items()) {
+      if (!item.id || unique.has(item.id)) continue;
+      unique.add(item.id);
+      const link = document.createElement("a");
+      link.href = `#${encodeURIComponent(section(item)?.id || item.id)}`;
+      link.dataset.mkSection = item.id;
+      link.className = "mk-scroll-preview-dock__item";
+      const cover = document.createElement("span");
+      cover.className = "mk-scroll-preview-dock__thumb";
+      cover.setAttribute("aria-hidden", "true");
+      thumb(cover, item);
+      const label = document.createElement("span");
+      label.textContent = item.label;
+      link.append(cover, label);
+      if (!enabled(item)) {
+        link.setAttribute("aria-disabled", "true");
+        link.tabIndex = -1;
+      }
+      nav.append(link);
+    }
+    empty.hidden = unique.size > 0;
+    panel.hidden = unique.size === 0;
+    nav.hidden = unique.size === 0;
+    scope.attr(root, "data-mk-disabled", opts.disabled ? "" : null);
+    previewed = "";
+    const next = items().find((item) => item.id === current3 && enabled(item)) ?? items().find(enabled);
+    current3 = "";
+    if (next) {
+      activate(next.id, false);
+      preview(next.id, false);
+    } else pill.hidden = true;
+  };
+  scope.on(nav, "click", (event) => {
+    const link = event.target.closest("a[data-mk-section]");
+    if (!link) return;
+    if (link.getAttribute("aria-disabled") === "true") {
+      event.preventDefault();
+      return;
+    }
+    if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey || event.button !== 0) return;
+    const item = items().find((item2) => item2.id === link.dataset.mkSection);
+    if (!item || !section(item)) return;
+    event.preventDefault();
+    track(press(link));
+    select(item.id);
+  });
+  scope.on(nav, "pointerover", (event) => {
+    const link = event.target.closest("a[data-mk-section]");
+    if (link && link.getAttribute("aria-disabled") !== "true") preview(link.dataset.mkSection);
+  });
+  scope.on(nav, "focusin", (event) => {
+    const link = event.target.closest("a[data-mk-section]");
+    if (link) preview(link.dataset.mkSection);
+  });
+  scope.on(root, "pointerleave", () => {
+    if (!root.contains(document.activeElement)) preview(current3);
+  });
+  scope.on(root, "focusout", (event) => {
+    if (!root.contains(event.relatedTarget)) preview(current3);
+  });
+  scope.on(nav, "keydown", (event) => {
+    if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) {
+      if (["PageUp", "PageDown", "ArrowUp", "ArrowDown", " "].includes(event.key)) cancelScroll();
+      return;
+    }
+    const available = links().filter((link) => link.getAttribute("aria-disabled") !== "true");
+    const index = available.indexOf(document.activeElement);
+    if (index < 0 || !available.length) return;
+    event.preventDefault();
+    available[event.key === "Home" ? 0 : event.key === "End" ? available.length - 1 : (index + (event.key === "ArrowRight" ? 1 : -1) + available.length) % available.length]?.focus();
+  });
+  scope.on(window, "resize", queue, { passive: true });
+  if (typeof ResizeObserver === "function") {
+    const resize = scope.observe(new ResizeObserver(queue));
+    resize.observe(nav);
+  }
+  bindScroller();
+  render();
+  update();
+  return {
+    select,
+    update,
+    get value() {
+      return current3;
+    },
+    setOptions(next) {
+      if (scope.disposed) return;
+      const focusedId = root.contains(document.activeElement) ? document.activeElement?.closest("a[data-mk-section]")?.dataset.mkSection : void 0;
+      opts = { ...opts, ...next };
+      if ("scroller" in next) {
+        cancelScroll();
+        bindScroller();
+      }
+      render();
+      if (focusedId) {
+        const target = links().find((link) => link.dataset.mkSection === focusedId && link.getAttribute("aria-disabled") !== "true") ?? links().find((link) => link.getAttribute("aria-disabled") !== "true");
+        if (target) target.focus();
+        else {
+          scope.attr(root, "tabindex", root.getAttribute("tabindex"));
+          root.tabIndex = -1;
+          root.focus();
+        }
+      }
+      update();
+    },
+    destroy() {
+      if (scope.disposed) return;
+      cancelAnimationFrame(frame);
+      cancelScroll();
+      unbindScroller();
+      animations.forEach((animation) => animation.kill());
+      gsap.killTweensOf([...root.querySelectorAll("*")]);
+      scope.dispose();
+      root.replaceChildren(...original);
+    }
+  };
+}
+
+// src/components/sticky-header/engine.ts
+function createStickyHeader(root, options = {}) {
+  const surface = root?.querySelector("[data-mk-sticky-surface]");
+  if (!root || !surface) {
+    if (root) warnOnce("sticky-header: needs an authored [data-mk-sticky-surface]");
+    return inert({ update() {
+    }, setOptions() {
+    }, compact: false, progress: 0 });
+  }
+  registerMotion();
+  const scope = createScope();
+  let opts = { ...options };
+  let scroller = null;
+  let unbind = () => {
+  };
+  let frame = 0;
+  let progress = -1;
+  let compact2 = false;
+  const title = surface.querySelector("[data-mk-sticky-title]");
+  const subtitle = surface.querySelector("[data-mk-sticky-subtitle]");
+  const animations = /* @__PURE__ */ new Set();
+  const track = (animation) => {
+    if (animation) animations.add(animation);
+  };
+  for (const node of [root, surface, title, subtitle]) if (node) scope.attr(node, "style", node.getAttribute("style"));
+  scope.attr(root, "class", `${root.className} mk-sticky-header`.trim());
+  scope.attr(root, "data-mk-ready", "");
+  const dimensions = () => {
+    const large = Number.isFinite(opts.expandedHeight) ? Math.max(48, opts.expandedHeight) : 104;
+    const small = Number.isFinite(opts.compactHeight) ? Math.max(40, Math.min(large, opts.compactHeight)) : Math.min(64, large);
+    root.style.setProperty("--mk-sticky-expanded-height", `${large}px`);
+    root.style.setProperty("--mk-sticky-top", `${Math.max(0, opts.top ?? 0)}px`);
+    return { large, small };
+  };
+  const update = () => {
+    frame = 0;
+    if (scope.disposed) return;
+    const { large, small } = dimensions();
+    const position2 = scroller ? scroller.scrollTop : window.scrollY;
+    const next = opts.disabled ? 0 : Math.max(0, Math.min(1, (position2 - Math.max(0, opts.threshold ?? 8)) / Math.max(1, opts.range ?? 96)));
+    if (next === progress) return;
+    const initial = progress < 0;
+    progress = next;
+    const isCompact = next >= 0.5;
+    scope.attr(root, "data-mk-compact", String(isCompact));
+    scope.attr(root, "data-mk-disabled", opts.disabled ? "" : null);
+    const duration = reduced() || initial ? 0 : 0.22;
+    track(gsap.to(surface, { height: large + (small - large) * next, borderRadius: 24 - 8 * next, paddingLeft: 24 - 8 * next, paddingRight: 24 - 8 * next, duration, ease: EASE.swatch, overwrite: "auto" }));
+    if (title) track(gsap.to(title, { scale: 1 - 0.16 * next, y: -2 * next, transformOrigin: "left center", duration, ease: EASE.swatch, overwrite: "auto" }));
+    if (subtitle) track(gsap.to(subtitle, { opacity: 1 - next, y: -8 * next, height: `${(1 - next) * 1.5}em`, filter: `blur(${next * 4}px)`, duration, ease: EASE.signature, overwrite: "auto" }));
+    if (isCompact !== compact2) {
+      compact2 = isCompact;
+      opts.onChange?.(compact2);
+      root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { compact: compact2, progress } }));
+    }
+  };
+  const queue = () => {
+    if (!frame) frame = requestAnimationFrame(update);
+  };
+  const bind = () => {
+    unbind();
+    scroller = typeof opts.scroller === "string" ? (() => {
+      try {
+        return root.closest(opts.scroller) ?? document.querySelector(opts.scroller);
+      } catch {
+        return null;
+      }
+    })() : opts.scroller ?? null;
+    const target = scroller ?? window;
+    target.addEventListener("scroll", queue, { passive: true });
+    unbind = () => target.removeEventListener("scroll", queue);
+  };
+  scope.on(window, "resize", queue, { passive: true });
+  scope.on(surface, "click", (event) => {
+    const control = event.target.closest("button, a");
+    if (control && !control.matches(':disabled, [aria-disabled="true"]')) {
+      scope.attr(control, "style", control.getAttribute("style"));
+      track(press(control));
+    }
+  });
+  if (typeof ResizeObserver === "function") {
+    const observer = scope.observe(new ResizeObserver(queue));
+    observer.observe(root);
+  }
+  bind();
+  update();
+  return {
+    update,
+    get compact() {
+      return compact2;
+    },
+    get progress() {
+      return Math.max(0, progress);
+    },
+    setOptions(next) {
+      if (scope.disposed) return;
+      opts = { ...opts, ...next };
+      if ("scroller" in next) bind();
+      progress = -1;
+      update();
+    },
+    destroy() {
+      if (scope.disposed) return;
+      cancelAnimationFrame(frame);
+      unbind();
+      animations.forEach((animation) => animation.kill());
+      gsap.killTweensOf([surface, title, subtitle].filter((node) => !!node));
+      scope.dispose();
+    }
+  };
+}
+
+// src/components/handwriting-text/glyphs.ts
+var GLYPHS = {
+  A: { width: 35, strokes: ["M2 43L26 5L27 42", "M10 30L31 28"] },
+  B: { width: 34, strokes: ["M4 43L14 7", "M10 8C40 -2 35 25 11 25C40 14 37 45 4 43"] },
+  C: { width: 34, strokes: ["M33 12C18 -8 -3 20 5 36Q12 52 31 35"] },
+  D: { width: 35, strokes: ["M5 43L15 7", "M10 7C46 -3 40 48 4 43"] },
+  E: { width: 30, strokes: ["M31 7L13 9L4 42L29 40", "M10 25L27 23"] },
+  F: { width: 29, strokes: ["M4 43L14 8L32 7", "M10 25L27 24"] },
+  G: { width: 36, strokes: ["M33 12C15 -8 -4 27 7 39Q21 51 31 26L19 28"] },
+  H: { width: 36, strokes: ["M4 43L14 7", "M28 43L37 7", "M8 27L32 24"] },
+  I: { width: 20, strokes: ["M17 8L8 42", "M9 9L25 7", "M1 43L17 41"] },
+  J: { width: 28, strokes: ["M19 8L32 7L24 33Q17 54 3 38"] },
+  K: { width: 34, strokes: ["M4 43L14 7", "M35 7L10 29L29 43"] },
+  L: { width: 28, strokes: ["M14 7L4 42Q15 39 29 41"] },
+  M: { width: 47, strokes: ["M3 43L15 7L22 35L44 7L35 43"] },
+  N: { width: 37, strokes: ["M4 43L14 7L28 42L38 7"] },
+  O: { width: 36, strokes: ["M25 7C5 1 -5 43 15 43C35 46 46 3 25 7Z"] },
+  P: { width: 32, strokes: ["M4 43L14 8C40 -2 39 30 8 27"] },
+  Q: { width: 37, strokes: ["M25 7C5 1 -5 43 15 43C35 46 46 3 25 7Z", "M19 33L33 48"] },
+  R: { width: 34, strokes: ["M4 43L14 8C40 -2 39 30 8 27L29 44"] },
+  S: { width: 31, strokes: ["M31 12C19 -5 -4 16 16 25C39 35 12 55 2 36"] },
+  T: { width: 31, strokes: ["M3 10L34 7", "M20 9L11 43"] },
+  U: { width: 36, strokes: ["M13 7L5 31C-1 52 27 48 31 29L37 7"] },
+  V: { width: 35, strokes: ["M7 7L10 43L37 7"] },
+  W: { width: 48, strokes: ["M7 7L9 43L27 15L28 43L50 7"] },
+  X: { width: 34, strokes: ["M10 7L28 43", "M36 7L2 43"] },
+  Y: { width: 34, strokes: ["M8 7L19 27L37 7", "M19 27L14 43"] },
+  Z: { width: 32, strokes: ["M7 9L34 7L2 43L29 41"] },
+  a: { width: 27, strokes: ["M23 23C9 12 2 40 13 42C21 44 26 21 23 22L20 39Q20 47 29 37"] },
+  b: { width: 27, strokes: ["M4 42Q21 -6 13 3Q5 7 7 36C19 7 34 30 19 40Q11 46 7 38L29 36"] },
+  c: { width: 25, strokes: ["M23 24C17 13 3 26 6 37Q10 49 27 35"] },
+  d: { width: 28, strokes: ["M22 24C8 12 0 39 11 42Q20 46 29 4Q31 -1 27 3L21 38Q21 46 31 35"] },
+  e: { width: 25, strokes: ["M5 33Q25 29 21 21Q17 13 8 27C-1 43 15 49 27 35"] },
+  f: { width: 23, strokes: ["M2 57Q1 63 7 52L22 7Q24 -3 16 5Q7 17 11 27L24 24", "M3 27L20 26"] },
+  g: { width: 28, strokes: ["M24 24C10 12 1 39 12 42Q20 45 24 23L18 54Q12 68 6 57Q3 48 31 36"] },
+  h: { width: 28, strokes: ["M4 42Q24 -6 14 4Q8 10 5 41C17 9 26 18 21 34Q17 49 31 35"] },
+  i: { width: 15, strokes: ["M9 24L5 36Q2 47 18 35", "M12 13L12.2 13.2"] },
+  j: { width: 18, strokes: ["M13 24L6 53Q1 68 -4 56Q-6 48 21 35", "M16 13L16.2 13.2"] },
+  k: { width: 27, strokes: ["M4 42Q24 -7 14 4Q8 10 5 41", "M25 22Q8 38 10 32Q17 27 19 37Q21 45 30 35"] },
+  l: { width: 18, strokes: ["M3 32Q28 -4 15 3Q7 8 6 31Q3 49 21 35"] },
+  m: { width: 40, strokes: ["M3 41L9 23L5 39Q18 11 20 25L17 39Q31 11 32 25L29 36Q28 46 43 35"] },
+  n: { width: 28, strokes: ["M3 41L9 23L5 39Q21 10 23 25L20 36Q19 46 31 35"] },
+  o: { width: 27, strokes: ["M22 22C7 14 0 39 12 42Q22 46 26 28Q26 18 19 24Q15 33 30 32"] },
+  p: { width: 28, strokes: ["M-1 58L11 22L7 35Q19 12 25 25Q29 40 14 42L8 39L31 35"] },
+  q: { width: 28, strokes: ["M23 24C10 12 1 39 12 42Q22 45 24 23L17 58Q15 62 19 53L31 36"] },
+  r: { width: 23, strokes: ["M2 41L9 22Q8 31 16 24Q20 18 21 23Q21 27 17 28L26 35"] },
+  s: { width: 24, strokes: ["M22 21Q18 15 10 24Q6 28 17 33Q25 39 14 43Q3 46 6 38L27 35"] },
+  t: { width: 21, strokes: ["M16 10L7 35Q3 48 24 35", "M2 25L23 23"] },
+  u: { width: 29, strokes: ["M9 23L4 35Q1 52 24 24L20 38Q21 45 32 35"] },
+  v: { width: 26, strokes: ["M6 23Q-1 58 22 27Q25 20 21 23Q19 31 29 31"] },
+  w: { width: 39, strokes: ["M7 23Q-1 56 19 27Q10 56 34 27Q37 20 33 23Q31 31 42 31"] },
+  x: { width: 25, strokes: ["M7 24Q14 28 17 39Q20 45 28 35", "M24 23L3 42"] },
+  y: { width: 28, strokes: ["M8 23L4 35Q2 50 24 24L16 54Q11 67 5 58Q0 50 31 36"] },
+  z: { width: 25, strokes: ["M6 25Q16 19 24 24L5 41Q14 36 20 43Q25 51 10 59Q1 63 5 54L28 36"] },
+  "0": { width: 29, strokes: ["M23 8C4 0 -2 42 13 43C28 44 34 7 23 8Z"] },
+  "1": { width: 20, strokes: ["M5 17L17 8L9 42", "M2 43L18 43"] },
+  "2": { width: 28, strokes: ["M4 17C10 -2 35 7 23 22L3 42Q14 38 28 42"] },
+  "3": { width: 27, strokes: ["M6 11Q32 0 23 20L13 25Q34 17 24 36Q17 48 3 39"] },
+  "4": { width: 29, strokes: ["M20 7L2 31L30 29", "M25 9L17 43"] },
+  "5": { width: 28, strokes: ["M29 8L10 9L5 25Q27 14 25 32Q20 49 3 39"] },
+  "6": { width: 28, strokes: ["M25 8C7 -1 -6 43 13 43C30 43 29 16 13 25L5 33"] },
+  "7": { width: 27, strokes: ["M4 10L29 9L9 43", "M9 26L24 25"] },
+  "8": { width: 28, strokes: ["M18 24C-6 12 23 -2 27 12Q28 21 10 28C-5 37 13 52 24 38Q33 27 18 24Z"] },
+  "9": { width: 28, strokes: ["M24 20Q5 38 4 21C4 3 31 1 25 21L14 44"] },
+  ".": { width: 12, strokes: ["M6 41L6.4 41.4"] },
+  ",": { width: 12, strokes: ["M8 40L4 49"] },
+  "!": { width: 13, strokes: ["M12 5L6 31", "M5 41L5.4 41.4"] },
+  "?": { width: 25, strokes: ["M3 14Q10 0 23 10Q29 18 16 24L11 31", "M9 42L9.4 42.4"] },
+  "-": { width: 23, strokes: ["M4 28L22 27"] },
+  "'": { width: 11, strokes: ["M9 7L6 15"] }
+};
+
+// src/components/handwriting-text/engine.ts
+var SVG12 = "http://www.w3.org/2000/svg";
+function createHandwritingText(root, options = {}) {
+  if (!root) return inert({ setText() {
+  }, replay() {
+  }, text: "" });
+  registerMotion();
+  const scope = createScope();
+  let text = options.text ?? root.textContent ?? "";
+  const authored = [...root.childNodes];
+  const svg2 = document.createElementNS(SVG12, "svg");
+  svg2.setAttribute("aria-hidden", "true");
+  svg2.dataset.mkHandwritingDrawing = "";
+  root.replaceChildren(svg2);
+  scope.add(() => {
+    svg2.remove();
+    root.append(...authored);
+  });
+  scope.attr(root, "data-mk-handwriting", "");
+  scope.attr(root, "data-mk-ready", "");
+  scope.attr(root, "role", "img");
+  let strokes = [];
+  let timeline = null;
+  const duration = Number.isFinite(options.duration) ? Math.max(0.1, Math.min(30, options.duration)) : 2.4;
+  const complete = () => {
+    if (scope.disposed) return;
+    options.onComplete?.();
+    root.dispatchEvent(new CustomEvent("mk:complete", { bubbles: true }));
+  };
+  const replay = () => {
+    if (scope.disposed) return;
+    timeline?.kill();
+    timeline = null;
+    if (reduced() || !strokes.length) {
+      gsap.set(strokes, { strokeDashoffset: 0 });
+      return;
+    }
+    gsap.set(strokes, { strokeDashoffset: 1 });
+    timeline = gsap.timeline({ onComplete: complete });
+    const step = duration / strokes.length;
+    for (const stroke of strokes) timeline.to(stroke, { strokeDashoffset: 0, duration: step, ease: EASE.wipe });
+  };
+  const draw = () => {
+    timeline?.kill();
+    timeline = null;
+    strokes = [];
+    svg2.replaceChildren();
+    scope.attr(root, "aria-label", text);
+    scope.attr(root, "data-mk-empty", text ? null : "");
+    let x = 5;
+    let y = 6;
+    let width = 10;
+    for (const char of text) {
+      if (char === "\n") {
+        width = Math.max(width, x + 5);
+        x = 5;
+        y += 64;
+        continue;
+      }
+      if (/\s/u.test(char)) {
+        x += 14;
+        continue;
+      }
+      const normalized = char.normalize("NFD");
+      const glyph = GLYPHS[normalized[0]];
+      if (glyph) {
+        const paths = [...glyph.strokes];
+        if (normalized.includes("\u0301")) paths.push("M16 14L23 7");
+        if (normalized.includes("\u0303")) paths.push("M11 14Q16 8 20 13Q24 17 28 10");
+        if (normalized.includes("\u0308")) paths.push("M12 12L12.3 12.3M23 12L23.3 12.3");
+        for (const d of paths) {
+          const path = document.createElementNS(SVG12, "path");
+          path.setAttribute("d", d);
+          path.setAttribute("transform", `translate(${x} ${y})`);
+          path.setAttribute("pathLength", "1");
+          path.setAttribute("stroke-dasharray", "1");
+          path.setAttribute("stroke-dashoffset", "0");
+          svg2.append(path);
+          strokes.push(path);
+        }
+        x += glyph.width;
+      } else {
+        const fallback = document.createElementNS(SVG12, "text");
+        fallback.textContent = char;
+        fallback.setAttribute("x", String(x));
+        fallback.setAttribute("y", String(y + 42));
+        fallback.setAttribute("data-mk-handwriting-fallback", "");
+        svg2.append(fallback);
+        x += 34;
+      }
+    }
+    svg2.setAttribute("viewBox", `0 0 ${Math.max(width, x + 8)} ${y + 64}`);
+    svg2.setAttribute("preserveAspectRatio", "xMinYMid meet");
+  };
+  draw();
+  if (options.autoplay !== false) replay();
+  scope.add(() => {
+    timeline?.kill();
+    gsap.killTweensOf(strokes);
+  });
+  return {
+    replay,
+    setText(next, animate = true) {
+      if (scope.disposed || next === text) return;
+      text = String(next);
+      draw();
+      if (animate) replay();
+    },
+    get text() {
+      return text;
+    },
+    destroy: () => scope.dispose()
+  };
+}
+
+// src/components/particle-button/engine.ts
+function createParticleButton(root, options = {}) {
+  if (!root) return inert({ burst() {
+  } });
+  registerMotion();
+  const scope = createScope();
+  let button2 = root.matches("button") ? root : root.querySelector("button");
+  if (!button2) {
+    button2 = document.createElement("button");
+    root.append(button2);
+    const made = button2;
+    scope.add(() => made.remove());
+  }
+  const control = button2;
+  if (!control.textContent?.trim() && !control.querySelector("[aria-label], svg, img")) {
+    const name = document.createElement("span");
+    name.textContent = options.label ?? "Celebrar";
+    control.append(name);
+    scope.add(() => name.remove());
+  }
+  const originalStyle = control.getAttribute("style");
+  const originalTransform = control.style.transform;
+  scope.add(() => {
+    if (originalStyle === null) control.removeAttribute("style");
+    else control.setAttribute("style", originalStyle);
+  });
+  scope.attr(control, "type", control.getAttribute("type") ?? "button");
+  scope.attr(control, "data-mk-particle-button", "");
+  scope.attr(root, "data-mk-ready", "");
+  const count = Number.isFinite(options.count) ? Math.min(16, Math.max(3, Math.round(options.count))) : 9;
+  const distance = Number.isFinite(options.distance) ? Math.min(100, Math.max(12, options.distance)) : 52;
+  let particles = null;
+  let pressing = null;
+  const fire = () => {
+    if (scope.disposed || control.disabled || control.getAttribute("aria-disabled") === "true") return;
+    particles?.kill();
+    particles = reduced() ? null : burst(control, { count, distance, ring: false, size: 5, colors: ["var(--mk-text)", "var(--mk-accent)"] });
+  };
+  scope.on(control, "click", (event) => {
+    if (control.disabled || control.getAttribute("aria-disabled") === "true") {
+      event.preventDefault();
+      return;
+    }
+    pressing?.kill();
+    pressing = press(control);
+    pressing?.eventCallback("onComplete", () => {
+      gsap.set(control, { clearProps: "transform,scale" });
+      control.style.transform = originalTransform;
+      if (!control.getAttribute("style")) control.removeAttribute("style");
+    });
+    fire();
+    options.onAction?.();
+    root.dispatchEvent(new CustomEvent("mk:action", { bubbles: true }));
+  });
+  scope.add(() => {
+    particles?.kill();
+    pressing?.kill();
+  });
+  return { burst: fire, destroy: () => scope.dispose() };
+}
+
+// src/components/magnetize-button/engine.ts
+function createMagnetizeButton(root, options = {}) {
+  if (!root) return inert({ attract() {
+  }, release() {
+  }, attracted: false });
+  registerMotion();
+  const scope = createScope();
+  let button2 = root.matches("button") ? root : root.querySelector("button");
+  if (!button2) {
+    button2 = document.createElement("button");
+    root.append(button2);
+    const made = button2;
+    scope.add(() => made.remove());
+  }
+  const control = button2;
+  if (!control.textContent?.trim() && !control.querySelector("[aria-label], svg, img")) {
+    const label = document.createElement("span");
+    label.textContent = options.label ?? "Reunir ideas";
+    control.append(label);
+    scope.add(() => label.remove());
+  }
+  const originalStyle = control.getAttribute("style");
+  const originalTransform = control.style.transform;
+  scope.add(() => {
+    if (originalStyle === null) control.removeAttribute("style");
+    else control.setAttribute("style", originalStyle);
+  });
+  scope.attr(control, "type", control.getAttribute("type") ?? "button");
+  scope.attr(control, "data-mk-magnetize-button", "");
+  scope.attr(root, "data-mk-ready", "");
+  const layer = document.createElement("span");
+  layer.dataset.mkMagnetParticles = "";
+  layer.setAttribute("aria-hidden", "true");
+  control.append(layer);
+  scope.add(() => layer.remove());
+  const count = Number.isFinite(options.count) ? Math.min(24, Math.max(4, Math.round(options.count))) : 14;
+  const reach = Number.isFinite(options.reach) ? Math.min(90, Math.max(16, options.reach)) : 42;
+  const dots = [];
+  for (let i = 0; i < count; i++) {
+    const dot = document.createElement("i");
+    layer.append(dot);
+    dots.push(dot);
+  }
+  let hovered = false;
+  let focused = false;
+  let attracted = false;
+  let tween = null;
+  let pressing = null;
+  const disabled = () => control.disabled || control.getAttribute("aria-disabled") === "true";
+  const positions = (near) => {
+    const w = control.offsetWidth || 160;
+    const h = control.offsetHeight || 48;
+    return dots.map((_, i) => {
+      const angle2 = i / count * Math.PI * 2 - Math.PI / 2;
+      const c = Math.cos(angle2);
+      const s = Math.sin(angle2);
+      const boundary = Math.min((w / 2 + 4) / Math.max(1e-3, Math.abs(c)), (h / 2 + 4) / Math.max(1e-3, Math.abs(s)));
+      const radius = boundary + (near ? 0 : reach * (0.72 + i % 3 * 0.14));
+      return { x: c * radius, y: s * radius, opacity: near ? 0.88 : 0.25, scale: near ? 1 : 0.6 };
+    });
+  };
+  const paint = (near, animate) => {
+    tween?.kill();
+    tween = null;
+    layer.hidden = reduced() || disabled();
+    if (layer.hidden) {
+      attracted = false;
+      scope.attr(control, "data-mk-attracted", null);
+      return;
+    }
+    attracted = near;
+    scope.attr(control, "data-mk-attracted", near ? "" : null);
+    const targets = positions(near);
+    if (!animate) {
+      dots.forEach((dot, i) => gsap.set(dot, targets[i]));
+      return;
+    }
+    tween = gsap.timeline();
+    dots.forEach((dot, i) => tween.to(dot, { ...targets[i], duration: near ? 0.62 : 0.48, ease: near ? EASE.swatch : EASE.signature }, i * 8e-3));
+  };
+  const sync = () => paint(hovered || focused, true);
+  scope.on(control, "pointerenter", () => {
+    hovered = true;
+    sync();
+  });
+  scope.on(control, "pointerleave", () => {
+    hovered = false;
+    sync();
+  });
+  scope.on(control, "focus", () => {
+    focused = true;
+    sync();
+  });
+  scope.on(control, "blur", () => {
+    focused = false;
+    sync();
+  });
+  scope.on(control, "click", (event) => {
+    if (disabled()) {
+      event.preventDefault();
+      return;
+    }
+    pressing?.kill();
+    pressing = press(control);
+    pressing?.eventCallback("onComplete", () => {
+      gsap.set(control, { clearProps: "transform,scale" });
+      control.style.transform = originalTransform;
+      if (!control.getAttribute("style")) control.removeAttribute("style");
+    });
+    options.onAction?.();
+    root.dispatchEvent(new CustomEvent("mk:action", { bubbles: true }));
+  });
+  if (typeof ResizeObserver !== "undefined") scope.observe(new ResizeObserver(() => paint(attracted, false))).observe(control);
+  if (typeof MutationObserver !== "undefined") scope.observe(new MutationObserver(() => paint(hovered || focused, false))).observe(control, { attributes: true, attributeFilter: ["disabled", "aria-disabled"] });
+  if (typeof matchMedia === "function") {
+    const media = matchMedia("(prefers-reduced-motion: reduce)");
+    scope.on(media, "change", () => paint(hovered || focused, false));
+  }
+  paint(false, false);
+  scope.add(() => {
+    tween?.kill();
+    pressing?.kill();
+    gsap.killTweensOf(dots);
+  });
+  return { attract: () => {
+    if (!scope.disposed) paint(true, true);
+  }, release: () => {
+    if (!scope.disposed) paint(false, true);
+  }, get attracted() {
+    return attracted;
+  }, destroy: () => scope.dispose() };
+}
+
+// src/components/badge-button/engine.ts
+var normalize2 = (value) => Number.isFinite(value) ? Math.max(0, Math.min(Number.MAX_SAFE_INTEGER, Math.round(value))) : 0;
+var sequence29 = 0;
+function createBadgeButton(root, options = {}) {
+  if (!root) return inert({ setCount() {
+  }, count: 0 });
+  registerMotion();
+  const scope = createScope();
+  let button2 = root.matches("button") ? root : root.querySelector("button");
+  if (!button2) {
+    button2 = document.createElement("button");
+    root.append(button2);
+    const made = button2;
+    scope.add(() => made.remove());
+  }
+  const control = button2;
+  if (!control.textContent?.trim() && !control.querySelector("[aria-label], svg, img")) {
+    const label = document.createElement("span");
+    label.textContent = options.label ?? "Guardar";
+    control.append(label);
+    scope.add(() => label.remove());
+  }
+  const originalStyle = control.getAttribute("style");
+  const originalTransform = control.style.transform;
+  scope.add(() => {
+    if (originalStyle === null) control.removeAttribute("style");
+    else control.setAttribute("style", originalStyle);
+  });
+  const badge = document.createElement("span");
+  badge.dataset.mkBadgeCount = "";
+  badge.setAttribute("aria-hidden", "true");
+  control.append(badge);
+  scope.add(() => badge.remove());
+  const spoken = document.createElement("span");
+  spoken.className = "mk-sr-only";
+  control.append(spoken);
+  scope.add(() => spoken.remove());
+  const authoredLabel = control.getAttribute("aria-label");
+  const labelledBy = control.getAttribute("aria-labelledby");
+  if (labelledBy?.trim()) {
+    spoken.id = `mk-badge-quantity-${++sequence29}`;
+    scope.attr(control, "aria-labelledby", `${labelledBy} ${spoken.id}`);
+  }
+  scope.attr(control, "type", control.getAttribute("type") ?? "button");
+  scope.attr(control, "data-mk-badge-button", "");
+  scope.attr(root, "data-mk-ready", "");
+  let count = normalize2(options.count ?? 0);
+  const max = Math.max(1, normalize2(options.max ?? 99));
+  const step = Number.isFinite(options.step) ? Math.round(options.step) : 1;
+  let rolling2 = null;
+  let bump = null;
+  let pressing = null;
+  const format = () => count > max ? `${max}+` : String(count);
+  const announce = () => {
+    spoken.textContent = ` (${count})`;
+    if (!labelledBy?.trim() && authoredLabel?.trim()) scope.attr(control, "aria-label", `${authoredLabel} (${count})`);
+  };
+  const paint = () => {
+    badge.hidden = options.hideZero !== false && count === 0;
+    badge.textContent = format();
+    announce();
+  };
+  const setCount = (next, notify = false) => {
+    if (scope.disposed || !Number.isFinite(next)) return;
+    const previous = count;
+    count = normalize2(next);
+    if (count === previous) return;
+    const wasHidden = badge.hidden;
+    badge.hidden = options.hideZero !== false && count === 0;
+    announce();
+    rolling2?.kill();
+    bump?.kill();
+    if (reduced() || badge.hidden) paint();
+    else {
+      rolling2 = rollDigits(badge, format(), count >= previous ? 1 : -1, 0.34);
+      bump = gsap.fromTo(badge, { scale: wasHidden ? 0.35 : 0.8, y: wasHidden ? 7 : 0 }, { scale: 1, y: 0, duration: 0.5, ease: wasHidden ? EASE.pop : EASE.swatch });
+    }
+    if (notify) {
+      options.onChange?.(count);
+      root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { count } }));
+    }
+  };
+  scope.on(control, "click", (event) => {
+    if (control.disabled || control.getAttribute("aria-disabled") === "true") {
+      event.preventDefault();
+      return;
+    }
+    pressing?.kill();
+    pressing = press(control);
+    pressing?.eventCallback("onComplete", () => {
+      gsap.set(control, { clearProps: "transform,scale" });
+      control.style.transform = originalTransform;
+      if (!control.getAttribute("style")) control.removeAttribute("style");
+    });
+    setCount(count + step, true);
+  });
+  paint();
+  scope.add(() => {
+    rolling2?.kill();
+    bump?.kill();
+    pressing?.kill();
+    gsap.killTweensOf(badge);
+  });
+  return { setCount, get count() {
+    return count;
+  }, destroy: () => scope.dispose() };
+}
+
+// src/components/morphing-page-dots/engine.ts
+function createMorphingPageDots(root, options = {}) {
+  if (!root) return inert({ setValue() {
+  }, value: 0 });
+  registerMotion();
+  const scope = createScope();
+  const count = Number.isFinite(options.count) ? Math.min(20, Math.max(1, Math.round(options.count))) : 5;
+  const normalize3 = (index) => Math.min(count - 1, Math.max(0, Math.round(index)));
+  let value = normalize3(Number.isFinite(options.value) ? options.value : 0);
+  const authored = [...root.childNodes];
+  const rail = document.createElement("span");
+  rail.dataset.mkPageRail = "";
+  const blob = document.createElement("i");
+  blob.dataset.mkPageBlob = "";
+  blob.setAttribute("aria-hidden", "true");
+  rail.append(blob);
+  const buttons = [];
+  for (let i = 0; i < count; i++) {
+    const button2 = document.createElement("button");
+    button2.type = "button";
+    button2.dataset.mkPageDot = "";
+    button2.setAttribute("aria-label", options.labels?.[i] ?? `P\xE1gina ${i + 1} de ${count}`);
+    if (options.pageIds?.[i]) button2.setAttribute("aria-controls", options.pageIds[i]);
+    button2.disabled = Boolean(options.disabled);
+    const dot = document.createElement("i");
+    dot.setAttribute("aria-hidden", "true");
+    button2.append(dot);
+    rail.append(button2);
+    buttons.push(button2);
+  }
+  root.replaceChildren(rail);
+  scope.add(() => {
+    rail.remove();
+    root.append(...authored);
+  });
+  scope.attr(root, "role", "group");
+  scope.attr(root, "aria-label", options.label ?? "P\xE1ginas");
+  scope.attr(root, "data-mk-morphing-page-dots", "");
+  scope.attr(root, "data-mk-ready", "");
+  let moving = null;
+  let pressing = null;
+  const at = (index) => {
+    const button2 = buttons[index];
+    const size = button2.offsetWidth || 44;
+    return (button2.offsetLeft || index * size) + size / 2 - 12;
+  };
+  const place3 = () => {
+    moving?.kill();
+    moving = null;
+    gsap.set(blob, { left: at(value), width: 24, scaleY: 1 });
+  };
+  const paint = () => buttons.forEach((button2, i) => {
+    button2.setAttribute("aria-current", i === value ? "page" : "false");
+    button2.tabIndex = i === value ? 0 : -1;
+  });
+  const setValue = (index, notify = false) => {
+    if (scope.disposed || !Number.isFinite(index)) return;
+    const next = normalize3(index);
+    if (value === next) return;
+    const start = at(value);
+    const end = at(next);
+    value = next;
+    paint();
+    moving?.kill();
+    if (reduced()) place3();
+    else {
+      const current3 = Number(gsap.getProperty(blob, "left")) || start;
+      moving = gsap.timeline().to(blob, { left: Math.min(current3, end), width: Math.abs(end - current3) + 24, scaleY: 0.68, duration: 0.18, ease: EASE.wipe }).to(blob, { left: end, width: 24, scaleY: 1, duration: 0.48, ease: EASE.swatch }, 0.13);
+    }
+    if (notify) {
+      options.onChange?.(value);
+      root.dispatchEvent(new CustomEvent("mk:change", { bubbles: true, detail: { value } }));
+    }
+  };
+  buttons.forEach((button2, i) => {
+    scope.on(button2, "click", () => {
+      if (button2.disabled) return;
+      pressing?.kill();
+      pressing = press(button2);
+      setValue(i, true);
+    });
+    scope.on(button2, "keydown", (event) => {
+      if (button2.disabled) return;
+      const key2 = event.key;
+      if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(key2)) return;
+      event.preventDefault();
+      const rtl = getComputedStyle(root).direction === "rtl";
+      let next = key2 === "Home" ? 0 : key2 === "End" ? count - 1 : (value + (key2 === "ArrowRight" !== rtl ? 1 : -1) + count) % count;
+      setValue(next, true);
+      buttons[next].focus();
+    });
+  });
+  if (typeof ResizeObserver !== "undefined") scope.observe(new ResizeObserver(place3)).observe(rail);
+  paint();
+  place3();
+  scope.add(() => {
+    moving?.kill();
+    pressing?.kill();
+  });
+  return { setValue, get value() {
+    return value;
+  }, destroy: () => scope.dispose() };
+}
+
+// src/components/not-found/engine.ts
+var ILLUSTRATION = '<svg viewBox="0 0 320 140" fill="none" aria-hidden="true"><path data-mk-lost-track d="M20 115H100Q118 115 118 95V72Q118 53 138 53H185Q205 53 205 73V95Q205 115 224 115H300"/><g data-mk-lost-four><path d="M72 23L35 79H84M77 23V107"/><path d="M263 23L226 79H275M268 23V107"/></g><g data-mk-lost-portal><rect x="124" y="18" width="72" height="96" rx="32"/><ellipse cx="160" cy="66" rx="17" ry="29"/><path d="M145 66h30M160 51v30"/></g><path data-mk-lost-star d="M211 13v12m-6-6h12M105 118v8m-4-4h8"/></svg>';
+function createNotFound(root, options = {}) {
+  if (!root) return inert({ replay() {
+  } });
+  registerMotion();
+  const scope = createScope();
+  const authored = [...root.childNodes];
+  const content = document.createElement("div");
+  content.dataset.mkNotFoundContent = "";
+  const art = document.createElement("div");
+  art.dataset.mkNotFoundArt = "";
+  art.innerHTML = ILLUSTRATION;
+  const eyebrow = document.createElement("p");
+  eyebrow.dataset.mkNotFoundCode = "";
+  eyebrow.textContent = `404 \xB7 ${options.brand ?? "Motion Kit"}`;
+  const heading = document.createElement("h2");
+  heading.textContent = options.title ?? "Este camino se perdi\xF3.";
+  const description = document.createElement("p");
+  description.dataset.mkNotFoundDescription = "";
+  description.textContent = options.description ?? "La p\xE1gina que buscas no est\xE1 aqu\xED. Volvamos a un lugar conocido.";
+  const actions = document.createElement("div");
+  actions.dataset.mkNotFoundActions = "";
+  const home = document.createElement("a");
+  home.href = options.homeHref ?? "/";
+  home.textContent = options.homeLabel ?? "Volver al inicio";
+  actions.append(home);
+  const back = document.createElement("button");
+  back.type = "button";
+  back.textContent = options.backLabel ?? "Ir atr\xE1s";
+  back.disabled = !options.onBack && history.length <= 1;
+  if (options.showBack !== false) actions.append(back);
+  content.append(art, eyebrow, heading, description, actions);
+  root.replaceChildren(content);
+  scope.add(() => {
+    content.remove();
+    root.append(...authored);
+  });
+  scope.attr(root, "data-mk-not-found", "");
+  scope.attr(root, "data-mk-ready", "");
+  let entering = null;
+  let drawing = null;
+  let pressing = null;
+  const portal = art.querySelector("[data-mk-lost-portal]");
+  const replay = () => {
+    if (scope.disposed) return;
+    entering?.kill();
+    drawing?.kill();
+    if (reduced()) {
+      gsap.set([art, eyebrow, heading, description, actions], { clearProps: "all" });
+      return;
+    }
+    entering = blurIn([art, eyebrow, heading, description, actions], { from: "soft", duration: 0.5, stagger: 0.055 });
+    drawing = gsap.fromTo(portal, { rotation: -12, scale: 0.82, transformOrigin: "50% 50%" }, { rotation: 0, scale: 1, duration: 0.8, ease: EASE.swatch });
+  };
+  scope.on(back, "click", () => {
+    if (!back.disabled) {
+      pressing?.kill();
+      pressing = press(back);
+      if (options.onBack) options.onBack();
+      else history.back();
+    }
+  });
+  scope.on(home, "click", () => {
+    pressing?.kill();
+    pressing = press(home);
+  });
+  replay();
+  scope.add(() => {
+    entering?.kill();
+    drawing?.kill();
+    pressing?.kill();
+  });
+  return { replay, destroy: () => scope.dispose() };
+}
+
 export {
   PATHS,
   springPath,
@@ -21440,6 +25318,26 @@ export {
   sanitizeHtml,
   createRichTextEditor,
   createAddToCart,
-  createScrollIsland
+  createScrollIsland,
+  createSignaturePad,
+  createWaveformPlayer,
+  createVoiceMessageBubble,
+  createDrilldownMenu,
+  createWheelPicker,
+  createStepper,
+  createRadioGroup,
+  createEqualizerSlider,
+  createTemperatureSlider,
+  createRatingScale,
+  createNotificationStack,
+  createBentoGrid,
+  createScrollPreviewDock,
+  createStickyHeader,
+  createHandwritingText,
+  createParticleButton,
+  createMagnetizeButton,
+  createBadgeButton,
+  createMorphingPageDots,
+  createNotFound
 };
-//# sourceMappingURL=chunk-SDQ776LG.js.map
+//# sourceMappingURL=chunk-Q7IW4FV3.js.map