@mieweb/ui 0.10.0-dev.9 → 0.11.0-dev.0

package/dist/deck.js

@@ -0,0 +1,3330 @@
+import { TemplateAnchor, TemplateImg, TemplateIcon, safeHref } from './chunk-FBCDYTWM.js';
+import { isRtl } from './chunk-YVKBXNPK.js';
+import './chunk-GVM6DTR5.js';
+import { cn } from './chunk-TQONQSJO.js';
+import './chunk-PX6F3LHL.js';
+import * as React9 from 'react';
+import { createPortal } from 'react-dom';
+import { List, Printer, Minimize2, Maximize2, Play, ExternalLink, ChevronUp, ChevronDown, X, ArrowUp, ArrowDown, ChevronRight, Check, Copy, ArrowRight, TrendingUp, TrendingDown, Minus } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var chrome = "mie-deck-chrome print:hidden";
+var iconButton = "flex size-9 items-center justify-center rounded-lg border border-white/10 bg-white/5 text-white/70 backdrop-blur transition-colors hover:bg-white/10 hover:text-white focus-visible:ring-2 focus-visible:ring-accent focus-visible:outline-none";
+var slideLabel = (s) => s.navLabel ?? ("title" in s ? s.title : void 0) ?? "";
+function ProgressBar({ progress }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        chrome,
+        "pointer-events-none absolute inset-x-0 top-0 z-40 h-[3px] bg-white/5"
+      ),
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "bg-accent h-full transition-[width] duration-500 ease-out",
+          style: { width: `${progress}%` }
+        }
+      )
+    }
+  );
+}
+function SlideCounter({
+  active,
+  total,
+  section
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        chrome,
+        "pointer-events-none absolute start-5 bottom-5 z-40 hidden select-none md:block"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "text-sm font-semibold text-white/80 tabular-nums", children: [
+          String(active + 1).padStart(2, "0"),
+          /* @__PURE__ */ jsxs("span", { className: "text-white/70", children: [
+            " ",
+            "/ ",
+            String(total).padStart(2, "0")
+          ] })
+        ] }),
+        section && /* @__PURE__ */ jsx("div", { className: "text-accent mt-0.5 text-[0.7rem] tracking-[0.18em] uppercase", children: section })
+      ]
+    }
+  );
+}
+function DotNav({
+  slides,
+  active,
+  goTo,
+  labels
+}) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      "aria-label": labels.slideNavigation,
+      className: cn(
+        chrome,
+        "absolute end-3 top-1/2 z-40 hidden -translate-y-1/2 flex-col items-center gap-2 md:flex"
+      ),
+      children: slides.map((s, i) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => goTo(i),
+          "aria-label": labels.goToSlide(i + 1, slideLabel(s)),
+          "aria-current": i === active ? "true" : void 0,
+          className: "group relative flex size-4 items-center justify-center",
+          children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "block rounded-full transition-all duration-300",
+                  i === active ? "bg-accent size-2.5" : "size-1.5 bg-white/30 group-hover:bg-white/60"
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute end-6 rounded-md border border-white/10 bg-neutral-900/95 px-2 py-1 text-xs whitespace-nowrap text-white opacity-0 shadow-lg transition-opacity group-hover:opacity-100 group-focus-visible:opacity-100", children: slideLabel(s) })
+          ]
+        },
+        i
+      ))
+    }
+  );
+}
+function Controls({
+  isFullscreen,
+  onToggleFullscreen,
+  onOpenOutline,
+  labels
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        chrome,
+        "absolute end-5 bottom-5 z-40 hidden items-center gap-2 md:flex"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: iconButton,
+            onClick: onOpenOutline,
+            "aria-label": labels.openOutline,
+            children: /* @__PURE__ */ jsx(List, { "aria-hidden": "true", className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: iconButton,
+            onClick: () => window.print(),
+            "aria-label": labels.print,
+            children: /* @__PURE__ */ jsx(Printer, { "aria-hidden": "true", className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: iconButton,
+            onClick: onToggleFullscreen,
+            "aria-label": isFullscreen ? labels.exitFullscreen : labels.enterFullscreen,
+            children: isFullscreen ? /* @__PURE__ */ jsx(Minimize2, { "aria-hidden": "true", className: "size-4" }) : /* @__PURE__ */ jsx(Maximize2, { "aria-hidden": "true", className: "size-4" })
+          }
+        )
+      ]
+    }
+  );
+}
+function Kbd({ children }) {
+  return /* @__PURE__ */ jsx("kbd", { className: "inline-flex min-w-5 items-center justify-center rounded border border-white/15 bg-white/5 px-1 py-0.5 text-[0.65rem] text-white/80", children });
+}
+function KeyboardHints({
+  pulse,
+  labels
+}) {
+  const [visible, setVisible] = React9.useState(true);
+  React9.useEffect(() => {
+    setVisible(true);
+    const t = setTimeout(() => setVisible(false), 5e3);
+    return () => clearTimeout(t);
+  }, [pulse]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn(
+        chrome,
+        "pointer-events-none absolute bottom-5 left-1/2 z-40 hidden -translate-x-1/2 items-center gap-3 rounded-full border border-white/10 bg-neutral-900/80 px-4 py-1.5 text-xs text-white/70 backdrop-blur transition-opacity duration-500 select-none md:flex",
+        visible ? "opacity-100" : "opacity-0"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(Kbd, { children: "\u2191" }),
+          /* @__PURE__ */ jsx(Kbd, { children: "\u2193" }),
+          " ",
+          labels.navigateHint
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-white/20", children: "\xB7" }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          /* @__PURE__ */ jsx(Kbd, { children: "F" }),
+          " ",
+          labels.fullscreenHint
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-white/20", children: "\xB7" }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          /* @__PURE__ */ jsx(Kbd, { children: "?" }),
+          " ",
+          labels.helpHint
+        ] })
+      ]
+    }
+  );
+}
+function MobileNav({
+  active,
+  total,
+  onPrev,
+  onNext,
+  onOpenOutline,
+  labels
+}) {
+  const btn = "flex size-10 items-center justify-center rounded-full text-white/80 transition-colors hover:bg-white/10 disabled:opacity-30";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        chrome,
+        "absolute inset-x-0 bottom-0 z-40 flex items-center justify-between border-t border-white/10 bg-neutral-950/90 px-3 py-2 pb-[max(0.5rem,env(safe-area-inset-bottom))] backdrop-blur md:hidden"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: btn,
+            onClick: onPrev,
+            disabled: active === 0,
+            "aria-label": labels.previous,
+            children: /* @__PURE__ */ jsx(ChevronUp, { "aria-hidden": "true", className: "size-5" })
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: onOpenOutline,
+            className: "flex items-center gap-2 rounded-full px-4 py-1.5 text-sm font-semibold text-white/80 tabular-nums",
+            "aria-label": labels.openOutline,
+            children: [
+              /* @__PURE__ */ jsx(List, { "aria-hidden": "true", className: "text-accent size-4" }),
+              active + 1,
+              " / ",
+              total
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: btn,
+            onClick: onNext,
+            disabled: active === total - 1,
+            "aria-label": labels.next,
+            children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true", className: "size-5" })
+          }
+        )
+      ]
+    }
+  );
+}
+function OutlineDialog({
+  open,
+  onClose,
+  slides,
+  active,
+  goTo,
+  labels
+}) {
+  const panelRef = React9.useRef(null);
+  const titleId = React9.useId();
+  React9.useEffect(() => {
+    if (!open) return;
+    const previous = document.activeElement;
+    const panel = panelRef.current;
+    const focusables = () => Array.from(
+      panel?.querySelectorAll("button:not([disabled])") ?? []
+    );
+    (focusables()[1] ?? focusables()[0])?.focus();
+    const onKey = (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        onClose();
+        return;
+      }
+      if (e.key !== "Tab") return;
+      const items = focusables();
+      const first = items[0];
+      const last = items[items.length - 1];
+      if (e.shiftKey && document.activeElement === first) {
+        e.preventDefault();
+        last?.focus();
+      } else if (!e.shiftKey && document.activeElement === last) {
+        e.preventDefault();
+        first?.focus();
+      }
+    };
+    document.addEventListener("keydown", onKey, true);
+    return () => {
+      document.removeEventListener("keydown", onKey, true);
+      previous?.focus?.();
+    };
+  }, [open, onClose]);
+  if (!open || typeof document === "undefined") return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: panelRef,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": titleId,
+        className: "mie-deck-chrome fixed inset-0 z-[80] flex flex-col bg-neutral-950/95 text-white backdrop-blur-md",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-white/10 px-5 py-4", children: [
+            /* @__PURE__ */ jsx("h2", { id: titleId, className: "text-lg font-bold text-white", children: labels.outline }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onClose,
+                "aria-label": labels.closeOutline,
+                className: iconButton,
+                children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-5" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("ol", { className: "flex-1 overflow-y-auto px-3 py-3", children: slides.map((s, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                goTo(i);
+                onClose();
+              },
+              "aria-current": i === active ? "true" : void 0,
+              className: cn(
+                "flex w-full items-baseline gap-3 rounded-lg px-4 py-3 text-start transition-colors",
+                i === active ? "bg-accent/15" : "hover:bg-white/5"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "text-accent text-sm font-semibold tabular-nums", children: String(i + 1).padStart(2, "0") }),
+                /* @__PURE__ */ jsx("span", { className: i === active ? "text-white" : "text-white/75", children: slideLabel(s) })
+              ]
+            }
+          ) }, i)) })
+        ]
+      }
+    ),
+    document.body
+  );
+}
+
+// src/components/Deck/tones.ts
+var dark = {
+  isLight: false,
+  text: "text-white",
+  muted: "text-white/70",
+  hairline: "border-white/10",
+  card: "bg-white/5"
+};
+var TONES = {
+  brand: {
+    ...dark,
+    surface: "bg-gradient-to-br from-primary-900 via-primary-950 to-primary-950"
+  },
+  deep: {
+    ...dark,
+    surface: "bg-gradient-to-b from-neutral-900 to-neutral-950"
+  },
+  ink: { ...dark, surface: "bg-neutral-950" },
+  glow: {
+    ...dark,
+    surface: "bg-gradient-to-br from-primary-950 via-primary-800 to-accent/70"
+  },
+  light: {
+    isLight: true,
+    surface: "bg-white",
+    text: "text-neutral-900",
+    muted: "text-neutral-600",
+    hairline: "border-neutral-200",
+    card: "bg-neutral-50"
+  }
+};
+var onDark = {
+  primary: {
+    text: "text-primary-300",
+    soft: "bg-primary-400/15",
+    border: "border-primary-400/30",
+    fill: "bg-primary-400",
+    svgFill: "fill-primary-400",
+    svgStroke: "stroke-primary-400"
+  },
+  secondary: {
+    text: "text-secondary-300",
+    soft: "bg-secondary-400/15",
+    border: "border-secondary-400/30",
+    fill: "bg-secondary-400",
+    svgFill: "fill-secondary-400",
+    svgStroke: "stroke-secondary-400"
+  },
+  accent: {
+    text: "text-accent",
+    soft: "bg-accent/15",
+    border: "border-accent/30",
+    fill: "bg-accent",
+    svgFill: "fill-accent",
+    svgStroke: "stroke-accent"
+  },
+  success: {
+    text: "text-success",
+    soft: "bg-success/15",
+    border: "border-success/30",
+    fill: "bg-success",
+    svgFill: "fill-success",
+    svgStroke: "stroke-success"
+  },
+  warning: {
+    text: "text-warning",
+    soft: "bg-warning/15",
+    border: "border-warning/30",
+    fill: "bg-warning",
+    svgFill: "fill-warning",
+    svgStroke: "stroke-warning"
+  },
+  danger: {
+    text: "text-destructive",
+    soft: "bg-destructive/15",
+    border: "border-destructive/30",
+    fill: "bg-destructive",
+    svgFill: "fill-destructive",
+    svgStroke: "stroke-destructive"
+  }
+};
+var lightText = {
+  primary: "text-primary-800",
+  secondary: "text-secondary-800",
+  accent: "text-neutral-900",
+  success: "text-neutral-900",
+  warning: "text-neutral-900",
+  danger: "text-destructive"
+};
+function accent(name = "accent", isLight = false) {
+  const spec = onDark[name];
+  return isLight ? { ...spec, text: lightText[name] } : spec;
+}
+var toneOf = (slide, fallback) => TONES[slide.tone ?? fallback];
+var ACCENT_CYCLE = [
+  "accent",
+  "primary",
+  "secondary",
+  "success",
+  "warning"
+];
+
+// src/components/Deck/DeckContext.tsx
+var DeckContext = React9.createContext(null);
+var DeckProvider = DeckContext.Provider;
+function useDeck() {
+  const ctx = React9.useContext(DeckContext);
+  if (!ctx) throw new Error("Slide renderers must be rendered inside <Deck>.");
+  return ctx;
+}
+var ToneContext = React9.createContext(TONES.brand);
+var useTone = () => React9.useContext(ToneContext);
+
+// src/components/Deck/labels.ts
+var defaultDeckLabels = {
+  presentation: "slide presentation",
+  slide: "slide",
+  slideNavigation: "Slide navigation",
+  goToSlide: (n, title) => `Go to slide ${n}${title ? `: ${title}` : ""}`,
+  outline: "Slides",
+  openOutline: "Open slide outline",
+  closeOutline: "Close outline",
+  print: "Print or save as PDF",
+  enterFullscreen: "Enter fullscreen",
+  exitFullscreen: "Exit fullscreen",
+  previous: "Previous slide",
+  next: "Next slide",
+  navigateHint: "Navigate",
+  fullscreenHint: "Fullscreen",
+  helpHint: "Help",
+  copy: "Copy link",
+  copied: "Copied",
+  statusNow: "Now",
+  statusNext: "Next",
+  statusLater: "Later",
+  watchVideo: "Watch the video",
+  lines: "Lines",
+  bars: "Bars",
+  more: (n) => `Show ${n} more`,
+  less: "Show less"
+};
+function reveal(i = 0) {
+  return {
+    className: "mie-deck-reveal",
+    style: { "--mie-reveal-i": i }
+  };
+}
+function Eyebrow({
+  children,
+  className
+}) {
+  const tone = useTone();
+  const r = reveal(0);
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      className: cn(
+        r.className,
+        "mb-4 text-xs font-semibold tracking-[0.2em] uppercase",
+        accent("accent", tone.isLight).text,
+        className
+      ),
+      style: r.style,
+      children
+    }
+  );
+}
+function SlideTitle({
+  children,
+  className,
+  size = "md"
+}) {
+  const tone = useTone();
+  const r = reveal(1);
+  return /* @__PURE__ */ jsx(
+    "h2",
+    {
+      className: cn(
+        r.className,
+        "font-bold tracking-tight text-balance",
+        tone.text,
+        size === "xl" ? "text-5xl sm:text-6xl lg:text-7xl" : size === "lg" ? "text-4xl sm:text-5xl lg:text-6xl" : "text-3xl sm:text-4xl lg:text-5xl",
+        className
+      ),
+      style: r.style,
+      children
+    }
+  );
+}
+function Subtitle({
+  children,
+  className
+}) {
+  const tone = useTone();
+  const r = reveal(2);
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      className: cn(
+        r.className,
+        "mt-4 max-w-2xl text-base leading-relaxed text-pretty sm:text-lg",
+        tone.muted,
+        className
+      ),
+      style: r.style,
+      children
+    }
+  );
+}
+function SlideHeader({
+  eyebrow,
+  title,
+  subtitle,
+  center
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn(center && "mx-auto text-center"), children: [
+    eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: eyebrow }),
+    /* @__PURE__ */ jsx(SlideTitle, { children: title }),
+    subtitle && /* @__PURE__ */ jsx(Subtitle, { className: cn(center && "mx-auto"), children: subtitle })
+  ] });
+}
+function splitFigure(value) {
+  const start = value.search(/\d/);
+  if (start === -1) return null;
+  let end = start;
+  while (end < value.length && /[\d,.]/.test(value[end])) end += 1;
+  return [value.slice(0, start), value.slice(start, end), value.slice(end)];
+}
+function CountUp({
+  value,
+  duration = 1400
+}) {
+  const ref = React9.useRef(null);
+  const match = splitFigure(value);
+  React9.useEffect(() => {
+    const el = ref.current;
+    if (!el || !match) return;
+    if (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches) return;
+    const [prefix, digits, suffix] = match;
+    const target = parseFloat(digits.replace(/,/g, ""));
+    if (Number.isNaN(target)) return;
+    const decimals = digits.split(".")[1]?.length ?? 0;
+    const grouped = digits.includes(",");
+    const render = (n) => {
+      let out = n.toFixed(decimals);
+      if (grouped) {
+        const [whole, frac] = out.split(".");
+        out = whole.replace(/\B(?=(\d{3})+(?!\d))/g, ",") + (frac ? `.${frac}` : "");
+      }
+      el.textContent = `${prefix}${out}${suffix}`;
+    };
+    render(0);
+    let frame = 0;
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        if (!entry.isIntersecting) return;
+        observer.disconnect();
+        const start = performance.now();
+        const tick = (now) => {
+          const t = Math.min(1, (now - start) / duration);
+          render(target * (1 - Math.pow(1 - t, 3)));
+          if (t < 1) frame = requestAnimationFrame(tick);
+          else el.textContent = value;
+        };
+        frame = requestAnimationFrame(tick);
+      },
+      { threshold: 0.1 }
+    );
+    observer.observe(el);
+    return () => {
+      observer.disconnect();
+      cancelAnimationFrame(frame);
+      el.textContent = value;
+    };
+  }, [value, duration]);
+  return /* @__PURE__ */ jsx("span", { ref, className: "tabular-nums", children: value });
+}
+function DeckIcon({
+  name,
+  className
+}) {
+  const { icons } = useDeck();
+  if (!name) return null;
+  return /* @__PURE__ */ jsx(TemplateIcon, { name, icons, className });
+}
+function IconChip({
+  icon,
+  accent: accent2 = "accent"
+}) {
+  const tone = useTone();
+  if (!icon) return null;
+  const a = accent(accent2, tone.isLight);
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "inline-flex size-11 items-center justify-center rounded-xl border",
+        a.soft,
+        a.border,
+        a.text
+      ),
+      children: /* @__PURE__ */ jsx(DeckIcon, { name: icon })
+    }
+  );
+}
+function Bullet({
+  item,
+  depth = 0
+}) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  const b = typeof item === "string" ? { text: item } : item;
+  return /* @__PURE__ */ jsxs("li", { className: cn("flex flex-col", depth > 0 && "ms-5 sm:ms-7"), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: cn("mt-2 flex-none", a.text), children: b.icon ? /* @__PURE__ */ jsx(DeckIcon, { name: b.icon, className: "size-[1.1em]" }) : /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "block rounded-full",
+            depth === 0 ? cn("size-1.5", a.fill) : "size-1 bg-current opacity-60"
+          )
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: cn(
+            "leading-snug",
+            depth === 0 ? cn("text-lg sm:text-xl", tone.text) : cn("text-base", tone.muted)
+          ),
+          children: [
+            b.lead && /* @__PURE__ */ jsxs("span", { className: cn("font-semibold", a.text), children: [
+              b.lead,
+              " "
+            ] }),
+            b.text
+          ]
+        }
+      )
+    ] }),
+    b.children && b.children.length > 0 && /* @__PURE__ */ jsx("ul", { className: "mt-2 flex flex-col gap-2", children: b.children.map((child, i) => /* @__PURE__ */ jsx(Bullet, { item: child, depth: depth + 1 }, i)) })
+  ] });
+}
+function SourceLink({
+  source,
+  className
+}) {
+  const tone = useTone();
+  const href = safeHref(source.url);
+  if (!href)
+    return /* @__PURE__ */ jsx("span", { className: cn("text-xs", tone.muted, className), children: source.label });
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: cn(
+        "inline-flex items-center gap-1 text-xs underline underline-offset-2 hover:opacity-100",
+        tone.muted,
+        className
+      ),
+      children: [
+        source.label,
+        /* @__PURE__ */ jsx(ExternalLink, { "aria-hidden": "true", className: "size-3" })
+      ]
+    }
+  );
+}
+function HighlightFigure({
+  value,
+  label,
+  size = "md"
+}) {
+  const tone = useTone();
+  return /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "font-bold",
+          accent("accent", tone.isLight).text,
+          size === "lg" ? "text-4xl sm:text-5xl" : "text-3xl sm:text-4xl"
+        ),
+        children: /* @__PURE__ */ jsx(CountUp, { value })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: cn("mt-1 text-xs tracking-wider uppercase", tone.muted), children: label })
+  ] });
+}
+function Card({
+  children,
+  className,
+  i
+}) {
+  const tone = useTone();
+  const r = reveal(i ?? 3);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        r.className,
+        "rounded-2xl border p-6",
+        tone.card,
+        tone.hairline,
+        className
+      ),
+      style: r.style,
+      children
+    }
+  );
+}
+function ChartTable({
+  caption,
+  headers,
+  rows
+}) {
+  return /* @__PURE__ */ jsxs("table", { className: "sr-only", children: [
+    /* @__PURE__ */ jsx("caption", { children: caption }),
+    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: headers.map(
+      (h, i) => h ? /* @__PURE__ */ jsx("th", { scope: "col", children: h }, i) : (
+        // The row-label corner cell has no caption of its own.
+        /* @__PURE__ */ jsx("td", {}, i)
+      )
+    ) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: rows.map((row, r) => /* @__PURE__ */ jsx("tr", { children: row.map(
+      (cell, c) => c === 0 ? /* @__PURE__ */ jsx("th", { scope: "row", children: cell }, c) : /* @__PURE__ */ jsx("td", { children: cell }, c)
+    ) }, r)) })
+  ] });
+}
+function useFormat() {
+  const { locale } = useDeck();
+  return React9.useMemo(
+    () => new Intl.NumberFormat(locale, { notation: "compact" }),
+    [locale]
+  );
+}
+function BarChart({ graphic }) {
+  const tone = useTone();
+  const format = useFormat();
+  const max = Math.max(1, ...graphic.bars.map((b) => b.value));
+  const hi = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsxs("figure", { "data-slot": "deck-bar-chart", className: "w-full", children: [
+    /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "flex h-56 items-end gap-2 sm:h-64", children: graphic.bars.map((bar, i) => /* @__PURE__ */ jsxs(React9.Fragment, { children: [
+      graphic.marker?.atIndex === i && /* @__PURE__ */ jsx("div", { className: "relative h-full w-px flex-none border-s border-dashed border-current opacity-40", children: /* @__PURE__ */ jsx("span", { className: "absolute start-1/2 -top-6 -translate-x-1/2 text-[0.65rem] font-semibold tracking-wide whitespace-nowrap uppercase opacity-100", children: graphic.marker.label }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex h-full min-w-0 flex-1 flex-col items-center gap-1", children: [
+        /* @__PURE__ */ jsx("div", { className: "w-full flex-1 pt-5", children: /* @__PURE__ */ jsx("div", { className: "relative h-full", children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "mie-deck-grow absolute inset-x-0 bottom-0 rounded-t-md",
+              bar.highlight ? hi.fill : tone.isLight ? "bg-neutral-300" : "bg-white/25"
+            ),
+            style: {
+              height: `${bar.value / max * 100}%`,
+              "--mie-reveal-i": i
+            },
+            children: /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "absolute inset-x-0 bottom-full mb-1 text-center text-xs font-semibold tabular-nums",
+                  tone.muted
+                ),
+                children: format.format(bar.value)
+              }
+            )
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "w-full truncate text-center text-xs",
+              tone.muted
+            ),
+            children: bar.label
+          }
+        )
+      ] })
+    ] }, bar.label)) }),
+    graphic.yAxisLabel && /* @__PURE__ */ jsx("figcaption", { className: cn("mt-2 text-xs", tone.muted), children: graphic.yAxisLabel }),
+    /* @__PURE__ */ jsx(
+      ChartTable,
+      {
+        caption: graphic.yAxisLabel ?? "Values",
+        headers: ["", graphic.yAxisLabel ?? "Value"],
+        rows: graphic.bars.map((b) => [b.label, b.value])
+      }
+    )
+  ] });
+}
+function HorizontalBars({ graphic }) {
+  const tone = useTone();
+  const format = useFormat();
+  const max = Math.max(1, ...graphic.bars.map((b) => b.value));
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsx("ul", { "data-slot": "deck-horizontal-bars", className: "w-full space-y-3", children: graphic.bars.map((bar, i) => {
+    const r = reveal(3 + i);
+    return /* @__PURE__ */ jsxs("li", { className: r.className, style: r.style, children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-1 flex justify-between gap-3 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { className: "truncate", children: bar.label }),
+        /* @__PURE__ */ jsx("span", { className: "font-semibold tabular-nums", children: bar.display ?? format.format(bar.value) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          "aria-hidden": "true",
+          className: cn(
+            "h-2 overflow-hidden rounded-full",
+            tone.isLight ? "bg-neutral-200" : "bg-white/10"
+          ),
+          children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn("h-full rounded-full", a.fill),
+              style: { width: `${bar.value / max * 100}%` }
+            }
+          )
+        }
+      )
+    ] }, bar.label);
+  }) });
+}
+function KpiRow({ graphic }) {
+  const tone = useTone();
+  return /* @__PURE__ */ jsx(
+    "dl",
+    {
+      "data-slot": "deck-kpi-row",
+      className: "grid w-full grid-cols-2 gap-4 sm:grid-cols-4",
+      children: graphic.kpis.map((kpi, i) => {
+        const Trend = kpi.trend === "up" ? TrendingUp : kpi.trend === "down" ? TrendingDown : Minus;
+        const r = reveal(3 + i);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              r.className,
+              "flex flex-col-reverse rounded-xl border p-4",
+              tone.card,
+              tone.hairline
+            ),
+            style: r.style,
+            children: [
+              /* @__PURE__ */ jsx("dt", { className: cn("text-xs", tone.muted), children: kpi.label }),
+              /* @__PURE__ */ jsxs("dd", { className: "flex items-center gap-2 text-2xl font-bold tabular-nums", children: [
+                kpi.value,
+                kpi.trend && /* @__PURE__ */ jsx(
+                  Trend,
+                  {
+                    "aria-hidden": "true",
+                    className: cn(
+                      "size-4",
+                      kpi.trend === "up" ? "text-success" : kpi.trend === "down" ? "text-destructive" : tone.muted
+                    )
+                  }
+                )
+              ] })
+            ]
+          },
+          kpi.label
+        );
+      })
+    }
+  );
+}
+function points(values, w, h, y) {
+  const step = values.length > 1 ? w / (values.length - 1) : 0;
+  return values.map((v, i) => `${(i * step).toFixed(1)},${(h - y(v) * h).toFixed(1)}`).join(" ");
+}
+function Spark({ graphic }) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  const max = Math.max(1, ...graphic.values);
+  const last = graphic.values[graphic.values.length - 1];
+  return /* @__PURE__ */ jsxs("figure", { "data-slot": "deck-spark", className: "w-full", children: [
+    /* @__PURE__ */ jsxs(
+      "figcaption",
+      {
+        className: cn(
+          "flex items-baseline justify-between text-sm",
+          tone.muted
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { children: graphic.label }),
+          /* @__PURE__ */ jsxs("span", { className: cn("text-2xl font-bold tabular-nums", a.text), children: [
+            last,
+            graphic.suffix
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        viewBox: "0 0 100 30",
+        preserveAspectRatio: "none",
+        className: "mt-2 h-12 w-full overflow-visible",
+        children: /* @__PURE__ */ jsx(
+          "polyline",
+          {
+            points: points(graphic.values, 100, 30, (v) => v / max),
+            fill: "none",
+            strokeWidth: 2,
+            vectorEffect: "non-scaling-stroke",
+            className: a.svgStroke
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ChartTable,
+      {
+        caption: graphic.label,
+        headers: ["#", graphic.label],
+        rows: graphic.values.map((v, i) => [i + 1, v])
+      }
+    )
+  ] });
+}
+function MultiLine({ graphic }) {
+  const tone = useTone();
+  const { labels } = useDeck();
+  const format = useFormat();
+  const [view, setView] = React9.useState("lines");
+  const all = graphic.series.flatMap((s) => s.values);
+  const log = (graphic.scale ?? "log") === "log";
+  const tx = (v) => log ? Math.log10(Math.max(1, v)) : v;
+  const lo = Math.min(...all.map(tx));
+  const hi = Math.max(...all.map(tx));
+  const y = (v) => hi === lo ? 0.5 : (tx(v) - lo) / (hi - lo);
+  const colours = graphic.series.map(
+    (_, i) => accent(ACCENT_CYCLE[i % ACCENT_CYCLE.length], tone.isLight)
+  );
+  const toggle = (active) => cn(
+    "rounded-full px-3 py-1 text-xs font-semibold transition-colors",
+    active ? tone.isLight ? "bg-neutral-900 text-white" : "bg-white text-neutral-900" : cn(tone.muted, "hover:opacity-100")
+  );
+  return /* @__PURE__ */ jsxs("figure", { "data-slot": "deck-multi-line", className: "w-full", children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "group",
+        "aria-label": graphic.caption,
+        className: "mb-3 flex gap-1",
+        children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-pressed": view === "lines",
+              className: toggle(view === "lines"),
+              onClick: () => setView("lines"),
+              children: labels.lines
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-pressed": view === "bars",
+              className: toggle(view === "bars"),
+              onClick: () => setView("bars"),
+              children: labels.bars
+            }
+          )
+        ]
+      }
+    ),
+    view === "lines" ? /* @__PURE__ */ jsx(
+      "svg",
+      {
+        "aria-hidden": "true",
+        viewBox: "0 0 100 50",
+        preserveAspectRatio: "none",
+        className: "h-56 w-full overflow-visible",
+        children: graphic.series.map((s, i) => /* @__PURE__ */ jsx(
+          "polyline",
+          {
+            points: points(s.values, 100, 50, y),
+            fill: "none",
+            strokeWidth: 2.5,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            vectorEffect: "non-scaling-stroke",
+            className: colours[i].svgStroke
+          },
+          s.label
+        ))
+      }
+    ) : /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "grid gap-4 sm:grid-cols-2", children: graphic.series.map((s, i) => {
+      const max = Math.max(1, ...s.values);
+      return /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: cn("mb-1 text-xs font-semibold", colours[i].text),
+            children: s.label
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "flex h-20 items-end gap-1", children: s.values.map((v, j) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn("flex-1 rounded-t-sm", colours[i].fill),
+            style: { height: `${v / max * 100}%` }
+          },
+          j
+        )) })
+      ] }, s.label);
+    }) }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": "true",
+        className: cn("mt-2 flex justify-between text-xs", tone.muted),
+        children: graphic.xLabels.map((l) => /* @__PURE__ */ jsx("span", { children: l }, l))
+      }
+    ),
+    /* @__PURE__ */ jsx("ul", { className: "mt-4 flex flex-wrap gap-x-6 gap-y-2 text-sm", children: graphic.series.map((s, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: cn("size-2.5 rounded-full", colours[i].fill)
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "font-medium", children: s.label }),
+      s.summary && /* @__PURE__ */ jsx("span", { className: tone.muted, children: s.summary })
+    ] }, s.label)) }),
+    graphic.caption && /* @__PURE__ */ jsx("figcaption", { className: cn("mt-2 text-xs", tone.muted), children: graphic.caption }),
+    /* @__PURE__ */ jsx(
+      ChartTable,
+      {
+        caption: graphic.caption ?? graphic.series.map((s) => s.label).join(", "),
+        headers: ["", ...graphic.series.map((s) => s.label)],
+        rows: graphic.xLabels.map((x, i) => [
+          x,
+          ...graphic.series.map((s) => format.format(s.values[i] ?? 0))
+        ])
+      }
+    )
+  ] });
+}
+function Graphic({ graphic }) {
+  const { graphics } = useDeck();
+  switch (graphic.type) {
+    case "bar":
+      return /* @__PURE__ */ jsx(BarChart, { graphic });
+    case "horizontal-bar":
+      return /* @__PURE__ */ jsx(HorizontalBars, { graphic });
+    case "multi-line":
+      return /* @__PURE__ */ jsx(MultiLine, { graphic });
+    case "kpi-row":
+      return /* @__PURE__ */ jsx(KpiRow, { graphic });
+    case "spark":
+      return /* @__PURE__ */ jsx(Spark, { graphic });
+    case "custom": {
+      const Custom = graphics?.[graphic.component];
+      return Custom ? /* @__PURE__ */ jsx(Custom, { ...graphic.props }) : null;
+    }
+  }
+}
+var slideAnchor = (slide, index) => slide.id ?? `slide-${index}`;
+var widthClass = {
+  sm: "max-w-3xl",
+  md: "max-w-4xl",
+  lg: "max-w-5xl",
+  xl: "max-w-6xl"
+};
+function SlideFrame({
+  slide,
+  index,
+  tone: fallback,
+  children,
+  width = "xl",
+  className
+}) {
+  const { labels } = useDeck();
+  const toneName = slide.tone ?? fallback;
+  const tone = TONES[toneName];
+  const title = "title" in slide ? slide.title : void 0;
+  return /* @__PURE__ */ jsx(ToneContext.Provider, { value: tone, children: /* @__PURE__ */ jsxs(
+    "section",
+    {
+      id: slideAnchor(slide, index),
+      "data-slot": "deck-slide",
+      "data-index": index,
+      "data-tone": toneName,
+      role: "group",
+      "aria-roledescription": labels.slide,
+      "aria-label": slide.navLabel ?? title ?? `${index + 1}`,
+      className: cn(
+        "mie-deck-slide relative isolate flex min-h-dvh w-full snap-start snap-always flex-col items-center justify-center overflow-hidden px-5 py-12 sm:px-8 sm:py-14 md:px-12 lg:px-20",
+        tone.surface,
+        tone.text,
+        className
+      ),
+      children: [
+        !tone.isLight && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute inset-0 -z-10 overflow-hidden print:hidden",
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "bg-accent/15 absolute -end-24 -top-24 size-[28rem] rounded-full blur-3xl" }),
+              /* @__PURE__ */ jsx("div", { className: "bg-primary-500/15 absolute -start-24 -bottom-32 size-[32rem] rounded-full blur-3xl" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: cn("relative w-full", widthClass[width]), children })
+      ]
+    }
+  ) });
+}
+var gridCols = (n) => n >= 4 ? "sm:grid-cols-2 lg:grid-cols-4" : n === 3 ? "md:grid-cols-3" : "md:grid-cols-2";
+function MetricsBody({ slide }) {
+  const tone = useTone();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "mt-10 grid grid-cols-1 gap-5",
+          gridCols(slide.metrics.length)
+        ),
+        children: slide.metrics.map((m, i) => /* @__PURE__ */ jsxs(Card, { i: 3 + i, children: [
+          m.icon && /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx(IconChip, { icon: m.icon, accent: m.accent }) }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "text-4xl font-bold",
+                accent(m.accent, tone.isLight).text
+              ),
+              children: /* @__PURE__ */ jsx(CountUp, { value: m.value })
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "mt-2 text-sm font-semibold", children: m.label }),
+          m.description && /* @__PURE__ */ jsx("div", { className: cn("mt-1 text-sm leading-snug", tone.muted), children: m.description })
+        ] }, m.label))
+      }
+    )
+  ] });
+}
+function MetricsRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "brand", children: /* @__PURE__ */ jsx(MetricsBody, { slide }) });
+}
+function ChartBody({ slide }) {
+  const tone = useTone();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { ...reveal(3), className: "mie-deck-reveal mt-10", children: /* @__PURE__ */ jsx(Graphic, { graphic: slide.graphic }) }),
+    slide.description && /* @__PURE__ */ jsx("p", { className: cn("mt-6 max-w-3xl text-sm", tone.muted), children: slide.description }),
+    slide.source && /* @__PURE__ */ jsx(SourceLink, { source: slide.source, className: "mt-4" })
+  ] });
+}
+function ChartRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "deep", children: /* @__PURE__ */ jsx(ChartBody, { slide }) });
+}
+function FeatureHighlightBody({
+  slide
+}) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  const hasGraphic = !!slide.graphic;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(hasGraphic && "grid items-center gap-10 lg:grid-cols-2"),
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(SlideHeader, { eyebrow: slide.eyebrow, title: slide.title }),
+          /* @__PURE__ */ jsx(
+            "p",
+            {
+              ...reveal(2),
+              className: cn(
+                "mie-deck-reveal mt-4 text-lg leading-relaxed",
+                tone.muted
+              ),
+              children: slide.body
+            }
+          ),
+          slide.stat && /* @__PURE__ */ jsxs("div", { ...reveal(3), className: "mie-deck-reveal mt-8", children: [
+            /* @__PURE__ */ jsx("div", { className: cn("text-5xl font-bold", a.text), children: /* @__PURE__ */ jsx(CountUp, { value: slide.stat.value }) }),
+            /* @__PURE__ */ jsx("div", { className: cn("mt-1 text-sm", tone.muted), children: slide.stat.label })
+          ] }),
+          slide.bullets && slide.bullets.length > 0 && /* @__PURE__ */ jsx("ul", { ...reveal(4), className: "mie-deck-reveal mt-6 space-y-2", children: slide.bullets.map((b) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: cn("mt-2 size-1.5 flex-none rounded-full", a.fill)
+              }
+            ),
+            b
+          ] }, b)) }),
+          slide.pullQuote && /* @__PURE__ */ jsx(
+            "blockquote",
+            {
+              ...reveal(5),
+              className: cn(
+                "mie-deck-reveal mt-8 border-s-2 ps-4 italic",
+                a.border,
+                tone.muted
+              ),
+              children: slide.pullQuote
+            }
+          )
+        ] }),
+        hasGraphic && /* @__PURE__ */ jsxs("div", { ...reveal(3), className: "mie-deck-reveal flex flex-col gap-8", children: [
+          /* @__PURE__ */ jsx(Graphic, { graphic: slide.graphic }),
+          slide.secondaryGraphic && /* @__PURE__ */ jsx(Graphic, { graphic: slide.secondaryGraphic })
+        ] })
+      ]
+    }
+  );
+}
+function FeatureHighlightRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "deep", children: /* @__PURE__ */ jsx(FeatureHighlightBody, { slide }) });
+}
+function DeckTable({
+  headers,
+  rows
+}) {
+  const tone = useTone();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...reveal(3),
+      className: cn(
+        "mie-deck-reveal mt-10 overflow-x-auto rounded-2xl border",
+        tone.hairline,
+        tone.card
+      ),
+      children: /* @__PURE__ */ jsxs("table", { className: "min-w-full text-start text-sm sm:text-base", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { className: cn("border-b", tone.hairline), children: headers.map((h, i) => /* @__PURE__ */ jsx(
+          "th",
+          {
+            scope: "col",
+            className: cn(
+              "px-5 py-3 font-semibold",
+              i === 0 ? "text-start" : "text-end",
+              tone.muted
+            ),
+            children: h
+          },
+          h
+        )) }) }),
+        /* @__PURE__ */ jsx("tbody", { children: rows.map((row, r) => /* @__PURE__ */ jsx("tr", { className: cn(r > 0 && "border-t", tone.hairline), children: row.map(
+          (cell, c) => c === 0 ? /* @__PURE__ */ jsx(
+            "th",
+            {
+              scope: "row",
+              className: "px-5 py-3 text-start font-medium",
+              children: cell
+            },
+            c
+          ) : /* @__PURE__ */ jsx("td", { className: "px-5 py-3 text-end tabular-nums", children: cell }, c)
+        ) }, r)) })
+      ] })
+    }
+  );
+}
+function ComparisonTableRenderer({
+  slide,
+  index
+}) {
+  const a = accent("accent", (slide.tone ?? "deep") === "light");
+  const [metric, before, after, change] = slide.headers ?? [
+    "Metric",
+    "Before",
+    "After",
+    "Change"
+  ];
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", width: "lg", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DeckTable,
+      {
+        headers: [metric, before, after, change],
+        rows: slide.rows.map((r) => [
+          r.label,
+          /* @__PURE__ */ jsx("span", { className: "opacity-70", children: r.before }, "b"),
+          r.after,
+          /* @__PURE__ */ jsx("span", { className: cn("font-semibold", a.text), children: r.change }, "c")
+        ])
+      }
+    )
+  ] });
+}
+function ImpactTableRenderer({
+  slide,
+  index
+}) {
+  const [item, impact] = slide.headers ?? ["Investment", "Impact"];
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", width: "lg", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DeckTable,
+      {
+        headers: [item, impact],
+        rows: slide.rows.map((r) => [
+          /* @__PURE__ */ jsxs("span", { children: [
+            r.item,
+            r.detail && /* @__PURE__ */ jsx("span", { className: "block text-sm font-normal opacity-70", children: r.detail })
+          ] }, "i"),
+          /* @__PURE__ */ jsx("span", { className: "block text-start sm:text-end", children: r.impact }, "m")
+        ])
+      }
+    )
+  ] });
+}
+function CardsBody({ slide }) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "mt-10 grid grid-cols-1 gap-5",
+          gridCols(slide.cards.length)
+        ),
+        children: slide.cards.map((card, i) => /* @__PURE__ */ jsxs(Card, { i: 3 + i, children: [
+          card.icon && /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx(IconChip, { icon: card.icon }) }),
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold", children: card.title }),
+          /* @__PURE__ */ jsx("p", { className: cn("mt-2 leading-relaxed", tone.muted), children: card.body }),
+          card.stat && /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
+            /* @__PURE__ */ jsx("div", { className: cn("text-3xl font-bold", a.text), children: /* @__PURE__ */ jsx(CountUp, { value: card.stat }) }),
+            card.statLabel && /* @__PURE__ */ jsx("div", { className: cn("text-sm", tone.muted), children: card.statLabel })
+          ] })
+        ] }, card.title))
+      }
+    ),
+    slide.note && /* @__PURE__ */ jsx("p", { className: cn("mt-8 text-sm italic", tone.muted), children: slide.note })
+  ] });
+}
+function CardsRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "brand", children: /* @__PURE__ */ jsx(CardsBody, { slide }) });
+}
+function RankedListBody({ slide }) {
+  const tone = useTone();
+  const { locale } = useDeck();
+  const a = accent("accent", tone.isLight);
+  const format = new Intl.NumberFormat(locale);
+  const max = Math.max(1, ...slide.entries.map((e) => e.value));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [
+      /* @__PURE__ */ jsx(
+        SlideHeader,
+        {
+          eyebrow: slide.eyebrow,
+          title: slide.title,
+          subtitle: slide.subtitle
+        }
+      ),
+      slide.outOf && /* @__PURE__ */ jsx("p", { className: cn("text-sm", tone.muted), children: slide.outOf })
+    ] }),
+    /* @__PURE__ */ jsx("ol", { className: "mt-8 flex flex-col gap-2", children: slide.entries.map((e, i) => {
+      const r = reveal(3 + i);
+      return /* @__PURE__ */ jsxs(
+        "li",
+        {
+          className: cn(
+            r.className,
+            "grid grid-cols-[2rem_minmax(0,1fr)_auto] items-center gap-4 rounded-xl border px-4 py-3",
+            e.highlighted ? cn(a.soft, a.border) : cn(tone.card, tone.hairline)
+          ),
+          style: r.style,
+          children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "text-sm font-bold tabular-nums",
+                  e.highlighted ? a.text : tone.muted
+                ),
+                children: i + 1
+              }
+            ),
+            /* @__PURE__ */ jsxs("span", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsx("span", { className: "block truncate font-medium", children: e.label }),
+              e.sublabel && /* @__PURE__ */ jsx("span", { className: cn("block truncate text-xs", tone.muted), children: e.sublabel }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: cn(
+                    "mt-2 block h-1.5 overflow-hidden rounded-full",
+                    tone.isLight ? "bg-neutral-200" : "bg-white/10"
+                  ),
+                  children: /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "block h-full rounded-full",
+                        e.highlighted ? a.fill : tone.isLight ? "bg-neutral-400" : "bg-white/40"
+                      ),
+                      style: { width: `${e.value / max * 100}%` }
+                    }
+                  )
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "text-end", children: [
+              /* @__PURE__ */ jsx("span", { className: "block font-semibold tabular-nums", children: e.display ?? format.format(e.value) }),
+              e.secondary && /* @__PURE__ */ jsx("span", { className: cn("block text-xs", tone.muted), children: e.secondary }),
+              e.change != null && e.change !== 0 && /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: cn(
+                    "inline-flex items-center text-xs font-semibold",
+                    e.change > 0 ? "text-success" : "text-destructive"
+                  ),
+                  children: [
+                    e.change > 0 ? /* @__PURE__ */ jsx(ArrowUp, { "aria-hidden": "true", className: "size-3" }) : /* @__PURE__ */ jsx(ArrowDown, { "aria-hidden": "true", className: "size-3" }),
+                    /* @__PURE__ */ jsx("span", { className: "sr-only", children: e.change > 0 ? "+" : "\u2212" }),
+                    Math.abs(e.change)
+                  ]
+                }
+              )
+            ] })
+          ]
+        },
+        e.label
+      );
+    }) }),
+    slide.source && /* @__PURE__ */ jsx(SourceLink, { source: slide.source, className: "mt-4" })
+  ] });
+}
+function RankedListRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "deep", width: "lg", children: /* @__PURE__ */ jsx(RankedListBody, { slide }) });
+}
+function BreakdownRenderer({
+  slide,
+  index
+}) {
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "deep", children: /* @__PURE__ */ jsx(BreakdownBody, { slide }) });
+}
+function BreakdownBody({ slide }) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  const total = slide.breakdown?.reduce((s, b) => s + b.count, 0) || 1;
+  return /* @__PURE__ */ jsxs("div", { className: "grid gap-10 lg:grid-cols-2", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(SlideHeader, { eyebrow: slide.eyebrow, title: slide.title }),
+      slide.body && /* @__PURE__ */ jsx(
+        "p",
+        {
+          ...reveal(2),
+          className: cn(
+            "mie-deck-reveal mt-4 text-lg leading-relaxed",
+            tone.muted
+          ),
+          children: slide.body
+        }
+      ),
+      slide.callout && /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...reveal(3),
+          className: cn(
+            "mie-deck-reveal mt-8 inline-flex items-baseline gap-3 rounded-2xl border px-5 py-3",
+            a.soft,
+            a.border
+          ),
+          children: [
+            /* @__PURE__ */ jsx("span", { className: cn("text-4xl font-bold", a.text), children: /* @__PURE__ */ jsx(CountUp, { value: slide.callout.value }) }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: slide.callout.label })
+          ]
+        }
+      ),
+      slide.talkingPoint && /* @__PURE__ */ jsxs("p", { className: cn("mt-6 text-sm italic", tone.muted), children: [
+        "\u201C",
+        slide.talkingPoint,
+        "\u201D"
+      ] }),
+      slide.pullQuote && /* @__PURE__ */ jsx(
+        "blockquote",
+        {
+          className: cn(
+            "mt-6 border-s-2 ps-4 text-lg font-semibold",
+            a.border
+          ),
+          children: slide.pullQuote
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { ...reveal(3), className: "mie-deck-reveal flex flex-col gap-8", children: [
+      slide.series && /* @__PURE__ */ jsx(Graphic, { graphic: slide.series }),
+      slide.breakdown && slide.breakdown.length > 0 && /* @__PURE__ */ jsx("ul", { className: "space-y-2", children: slide.breakdown.map((b) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-3 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { className: "w-36 flex-none truncate", children: b.label }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "h-2 flex-1 overflow-hidden rounded-full",
+              tone.isLight ? "bg-neutral-200" : "bg-white/10"
+            ),
+            children: /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn("block h-full rounded-full", a.fill),
+                style: { width: `${b.count / total * 100}%` }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "w-10 flex-none text-end font-semibold tabular-nums", children: b.count })
+      ] }, b.label)) }),
+      slide.entries && slide.entries.length > 0 && /* @__PURE__ */ jsx(
+        "ul",
+        {
+          className: cn(
+            "max-h-64 divide-y overflow-y-auto rounded-xl border",
+            tone.hairline,
+            tone.card
+          ),
+          children: slide.entries.map((e) => /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: cn(
+                "flex items-center justify-between gap-3 px-4 py-2 text-sm",
+                tone.hairline
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("span", { className: "min-w-0", children: [
+                  /* @__PURE__ */ jsx("span", { className: "block truncate font-medium", children: e.title }),
+                  e.meta && /* @__PURE__ */ jsx("span", { className: cn("block truncate text-xs", tone.muted), children: e.meta })
+                ] }),
+                e.date && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn("flex-none text-xs tabular-nums", tone.muted),
+                    children: e.date
+                  }
+                )
+              ]
+            },
+            `${e.title}-${e.date ?? ""}`
+          ))
+        }
+      )
+    ] })
+  ] });
+}
+function TabsRenderer({ slide, index }) {
+  const [active, setActive] = React9.useState(0);
+  const baseId = React9.useId();
+  const tabs = React9.useRef([]);
+  const current = slide.tabs[active]?.slide;
+  const onKey = (e) => {
+    const n = slide.tabs.length;
+    let key = e.key;
+    if (isRtl(e.currentTarget)) {
+      if (key === "ArrowRight") key = "ArrowLeft";
+      else if (key === "ArrowLeft") key = "ArrowRight";
+    }
+    const next = key === "ArrowRight" ? (active + 1) % n : key === "ArrowLeft" ? (active - 1 + n) % n : key === "Home" ? 0 : key === "End" ? n - 1 : -1;
+    if (next < 0) return;
+    e.preventDefault();
+    e.stopPropagation();
+    setActive(next);
+    tabs.current[next]?.focus();
+  };
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", children: [
+    /* @__PURE__ */ jsx(SlideHeader, { eyebrow: slide.eyebrow, title: slide.title }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "tablist",
+        "aria-label": slide.title,
+        className: "mt-6 flex flex-wrap gap-2",
+        children: slide.tabs.map((tab, i) => /* @__PURE__ */ jsx(
+          TabButton,
+          {
+            ref: (el) => {
+              tabs.current[i] = el;
+            },
+            id: `${baseId}-tab-${i}`,
+            panelId: `${baseId}-panel`,
+            selected: i === active,
+            icon: tab.icon,
+            onClick: () => setActive(i),
+            onKeyDown: onKey,
+            children: tab.label
+          },
+          tab.label
+        ))
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "tabpanel",
+        id: `${baseId}-panel`,
+        "aria-labelledby": `${baseId}-tab-${active}`,
+        className: "mt-8",
+        children: [
+          current?.type === "metrics" && /* @__PURE__ */ jsx(MetricsBody, { slide: current }),
+          current?.type === "chart" && /* @__PURE__ */ jsx(ChartBody, { slide: current }),
+          current?.type === "feature-highlight" && /* @__PURE__ */ jsx(FeatureHighlightBody, { slide: current }),
+          current?.type === "cards" && /* @__PURE__ */ jsx(CardsBody, { slide: current }),
+          current?.type === "ranked-list" && /* @__PURE__ */ jsx(RankedListBody, { slide: current })
+        ]
+      }
+    )
+  ] });
+}
+var TabButton = React9.forwardRef(({ id, panelId, selected, icon, onClick, onKeyDown, children }, ref) => {
+  const tone = useTone();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      role: "tab",
+      id,
+      "aria-selected": selected,
+      "aria-controls": panelId,
+      tabIndex: selected ? 0 : -1,
+      onClick,
+      onKeyDown,
+      className: cn(
+        "inline-flex items-center gap-2 rounded-full border px-4 py-1.5 text-sm font-semibold transition-colors",
+        selected ? tone.isLight ? "border-neutral-900 bg-neutral-900 text-white" : "border-white bg-white text-neutral-900" : cn(
+          tone.hairline,
+          tone.muted,
+          tone.isLight ? "hover:bg-neutral-100" : "hover:bg-white/10"
+        )
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsx(DeckIcon, { name: icon, className: "size-4" }),
+        children
+      ]
+    }
+  );
+});
+TabButton.displayName = "TabButton";
+function CycleRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "deep");
+  const n = slide.nodes.length;
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "deep", children: /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-10 lg:grid-cols-2", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      slide.eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: slide.eyebrow }),
+      /* @__PURE__ */ jsx(SlideTitle, { children: slide.title }),
+      slide.body && /* @__PURE__ */ jsx(
+        "p",
+        {
+          ...reveal(2),
+          className: cn(
+            "mie-deck-reveal mt-6 text-lg leading-relaxed",
+            tone.muted
+          ),
+          children: slide.body
+        }
+      ),
+      slide.talkingPoint && /* @__PURE__ */ jsxs("p", { className: cn("mt-6 italic", tone.muted), children: [
+        "\u201C",
+        slide.talkingPoint,
+        "\u201D"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(CycleWheel, { nodes: slide.nodes, n })
+  ] }) });
+}
+function CycleWheel({ nodes, n }) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsxs(
+    "ol",
+    {
+      ...reveal(3),
+      className: "mie-deck-reveal relative mx-auto aspect-square w-64 sm:w-80 md:w-96",
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            "aria-hidden": "true",
+            viewBox: "0 0 400 400",
+            className: "mie-deck-spin absolute inset-0 size-full",
+            children: [
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: "200",
+                  cy: "200",
+                  r: "150",
+                  fill: "none",
+                  strokeWidth: "2",
+                  className: tone.isLight ? "stroke-neutral-200" : "stroke-white/10"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: "200",
+                  cy: "200",
+                  r: "150",
+                  fill: "none",
+                  strokeWidth: "2",
+                  strokeDasharray: "50 200",
+                  strokeLinecap: "round",
+                  className: a.svgStroke
+                }
+              ),
+              nodes.map((_, i) => /* @__PURE__ */ jsx(
+                "polygon",
+                {
+                  points: "200,47 207,60 193,60",
+                  transform: `rotate(${360 / n * i + 180 / n} 200 200)`,
+                  className: a.svgFill,
+                  opacity: 0.8
+                },
+                i
+              ))
+            ]
+          }
+        ),
+        nodes.map((node, i) => {
+          const angle = 2 * Math.PI * i / n - Math.PI / 2;
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: cn(
+                "absolute z-10 w-28 -translate-x-1/2 -translate-y-1/2 rounded-xl border px-3 py-2 text-center shadow-lg backdrop-blur sm:w-32",
+                tone.hairline,
+                tone.isLight ? "bg-white" : "bg-neutral-900/90"
+              ),
+              style: {
+                // rtl-ignore -- orbit nodes use trig coordinates; diagram stays LTR
+                left: `${50 + 37.5 * Math.cos(angle)}%`,
+                top: `${50 + 37.5 * Math.sin(angle)}%`
+              },
+              children: [
+                node.icon && /* @__PURE__ */ jsx(
+                  DeckIcon,
+                  {
+                    name: node.icon,
+                    className: cn("mx-auto mb-1 size-4", a.text)
+                  }
+                ),
+                /* @__PURE__ */ jsx("p", { className: "text-xs font-bold sm:text-sm", children: node.label }),
+                node.metric && /* @__PURE__ */ jsx("p", { className: cn("text-sm font-bold sm:text-lg", a.text), children: node.metric })
+              ]
+            },
+            node.label
+          );
+        })
+      ]
+    }
+  );
+}
+function RoadmapRenderer({
+  slide,
+  index
+}) {
+  const { labels } = useDeck();
+  const tone = toneOf(slide, "ink");
+  const a = accent("accent", tone.isLight);
+  const status = {
+    now: labels.statusNow,
+    next: labels.statusNext,
+    later: labels.statusLater
+  };
+  const statusTag = {
+    now: cn(a.soft, a.border, a.text),
+    next: cn(
+      accent("primary", tone.isLight).soft,
+      accent("primary", tone.isLight).border,
+      accent("primary", tone.isLight).text
+    ),
+    later: cn(tone.hairline, tone.muted)
+  };
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "ink", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "ol",
+      {
+        className: cn(
+          "relative mt-10 flex flex-col gap-6 border-s ps-8",
+          a.border
+        ),
+        children: slide.items.map((item, i) => {
+          const r = reveal(3 + i);
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: cn(r.className, "relative"),
+              style: r.style,
+              children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: cn(
+                      "absolute -start-[2.35rem] top-1.5 flex size-4 items-center justify-center rounded-full border-2",
+                      a.border,
+                      tone.isLight ? "bg-white" : "bg-neutral-950"
+                    ),
+                    children: /* @__PURE__ */ jsx("span", { className: cn("size-1.5 rounded-full", a.fill) })
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
+                  item.icon && /* @__PURE__ */ jsx(
+                    IconChip,
+                    {
+                      icon: item.icon,
+                      accent: item.status === "later" ? "primary" : "accent"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold sm:text-xl", children: item.title }),
+                  item.status && /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold tracking-wider uppercase",
+                        statusTag[item.status]
+                      ),
+                      children: status[item.status]
+                    }
+                  )
+                ] }),
+                item.children && item.children.length > 0 && /* @__PURE__ */ jsx("ul", { className: "mt-2 flex flex-wrap gap-x-6 gap-y-1.5", children: item.children.map((child) => /* @__PURE__ */ jsxs(
+                  "li",
+                  {
+                    className: cn(
+                      "flex items-center gap-2 text-sm",
+                      tone.muted
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          "aria-hidden": "true",
+                          className: "size-1 rounded-full bg-current"
+                        }
+                      ),
+                      child
+                    ]
+                  },
+                  child
+                )) })
+              ]
+            },
+            item.title
+          );
+        })
+      }
+    )
+  ] });
+}
+var BASE = 50;
+var PEAK = 6;
+var SIGMA = 15;
+var gaussY = (x) => BASE - (BASE - PEAK) * Math.exp(-((x - 50) ** 2) / (2 * SIGMA * SIGMA));
+function AdoptionCurveRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "ink");
+  const clipId = React9.useId();
+  const pts = [];
+  for (let x = 0; x <= 100; x += 1.5) pts.push(`${x},${gaussY(x).toFixed(2)}`);
+  const area = `M 0,${BASE} L ${pts.join(" L ")} L 100,${BASE} Z`;
+  const values = slide.segments.map((s) => parseFloat(s.pct) || 0);
+  const sum = values.reduce((x, y) => x + y, 0) || 1;
+  const widths = values.map((v) => v / sum * 100);
+  const bands = slide.segments.map((s, i) => ({
+    ...s,
+    x0: widths.slice(0, i).reduce((x, y) => x + y, 0),
+    w: widths[i],
+    spec: accent(
+      s.accent ?? ACCENT_CYCLE[i % ACCENT_CYCLE.length],
+      tone.isLight
+    )
+  }));
+  const hi = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "ink", width: "lg", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { ...reveal(3), className: "mie-deck-reveal relative mt-8 pb-10", children: [
+      slide.annotations?.map((note) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "absolute z-20 w-40 max-w-[42vw] -translate-x-1/2 rounded-lg border px-3 py-1.5 text-center text-xs leading-snug font-semibold",
+            note.emphasis ? cn(hi.soft, hi.border, hi.text) : cn(tone.hairline, tone.card)
+          ),
+          style: {
+            // rtl-ignore -- annotation anchored to LTR timeline axis coordinates
+            left: `${note.atPct}%`,
+            [note.side === "bottom" ? "bottom" : "top"]: 0
+          },
+          children: note.text
+        },
+        note.text
+      )),
+      /* @__PURE__ */ jsx("div", { className: "h-[clamp(180px,30vh,300px)] w-full", children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          viewBox: "0 0 100 56",
+          preserveAspectRatio: "none",
+          className: "size-full overflow-visible",
+          role: "img",
+          "aria-label": slide.segments.map((s) => `${s.label} ${s.pct}`).join(", "),
+          children: [
+            /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("path", { d: area }) }) }),
+            /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: bands.map((b) => /* @__PURE__ */ jsx(
+              "rect",
+              {
+                x: b.x0,
+                y: 0,
+                width: b.w,
+                height: BASE,
+                className: b.spec.svgFill,
+                opacity: 0.8
+              },
+              b.label
+            )) }),
+            /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: `M ${pts.join(" L ")}`,
+                fill: "none",
+                strokeWidth: 1,
+                vectorEffect: "non-scaling-stroke",
+                className: tone.isLight ? "stroke-neutral-900" : "stroke-white"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "line",
+              {
+                x1: 0,
+                y1: BASE,
+                x2: 100,
+                y2: BASE,
+                strokeWidth: 0.5,
+                vectorEffect: "non-scaling-stroke",
+                className: tone.isLight ? "stroke-neutral-400" : "stroke-white/25"
+              }
+            )
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { "aria-hidden": "true", dir: "ltr", className: "mt-2 flex w-full", children: bands.map((b) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "min-w-0 px-1 text-center",
+          style: { flexBasis: `${b.w}%` },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn("text-sm font-bold sm:text-base", b.spec.text),
+                children: b.pct
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "truncate text-[0.7rem] tracking-wide uppercase sm:text-xs",
+                  tone.muted
+                ),
+                children: b.label
+              }
+            )
+          ]
+        },
+        b.label
+      )) }),
+      slide.marker && /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "absolute bottom-0 z-20 -translate-x-1/2 text-center",
+          style: { left: `${slide.marker.atPct}%` },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                "aria-hidden": "true",
+                className: cn("mx-auto h-4 w-px", hi.fill)
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "mt-1 inline-block rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold tracking-wide uppercase",
+                  hi.soft,
+                  hi.border,
+                  hi.text
+                ),
+                children: slide.marker.label
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    slide.source && /* @__PURE__ */ jsx(SourceLink, { source: slide.source, className: "mt-4" })
+  ] });
+}
+function DiagramRenderer({
+  slide,
+  index
+}) {
+  const { components } = useDeck();
+  const tone = toneOf(slide, "deep");
+  const center = new Map(slide.nodes.map((n) => [n.id, n]));
+  const left = slide.callouts?.filter((c) => c.side === "left") ?? [];
+  const right = slide.callouts?.filter((c) => c.side === "right") ?? [];
+  const cols = left.length && right.length ? "lg:grid-cols-[minmax(0,1fr)_minmax(0,2.4fr)_minmax(0,1fr)]" : right.length ? "lg:grid-cols-[minmax(0,2.7fr)_minmax(0,1.25fr)]" : left.length ? "lg:grid-cols-[minmax(0,1.25fr)_minmax(0,2.7fr)]" : "";
+  const stageBg = tone.isLight ? "bg-white" : "bg-neutral-900";
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: cn("mt-8", cols && cn("grid items-center gap-6", cols)), children: [
+      left.length > 0 && /* @__PURE__ */ jsx(Callouts, { callouts: left, end: true }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...reveal(3),
+          className: "mie-deck-reveal relative mx-auto h-[clamp(260px,40vh,440px)] w-full max-w-3xl",
+          children: [
+            slide.boundaries?.map((b) => {
+              const xs = b.nodes.map((id) => center.get(id)?.x ?? 50);
+              const ys = b.nodes.map((id) => center.get(id)?.y ?? 50);
+              const l = Math.min(...xs) - 13;
+              const t = Math.min(...ys) - 17;
+              const spec = accent(b.accent ?? "primary", tone.isLight);
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "absolute rounded-2xl border border-dashed",
+                    tone.hairline
+                  ),
+                  style: {
+                    // rtl-ignore -- group outline shares the SVG edge coordinate space
+                    left: `${l}%`,
+                    top: `${t}%`,
+                    width: `${Math.max(...xs) + 13 - l}%`,
+                    height: `${Math.max(...ys) + 17 - t}%`
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "absolute start-4 -top-3 rounded-full border px-2.5 py-0.5 text-[0.6rem] font-semibold tracking-wide uppercase",
+                        stageBg,
+                        spec.border,
+                        spec.text
+                      ),
+                      children: b.label
+                    }
+                  )
+                },
+                b.label
+              );
+            }),
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                "aria-hidden": "true",
+                viewBox: "0 0 100 100",
+                preserveAspectRatio: "none",
+                className: "absolute inset-0 size-full",
+                children: slide.edges.map((e) => {
+                  const a = center.get(e.from);
+                  const b = center.get(e.to);
+                  if (!a || !b) return null;
+                  return /* @__PURE__ */ jsx(
+                    "line",
+                    {
+                      x1: a.x,
+                      y1: a.y,
+                      x2: b.x,
+                      y2: b.y,
+                      strokeWidth: 1.2,
+                      strokeDasharray: e.dashed ? "4 3" : void 0,
+                      vectorEffect: "non-scaling-stroke",
+                      className: e.accent ? accent(e.accent, tone.isLight).svgStroke : tone.isLight ? "stroke-neutral-400" : "stroke-white/30"
+                    },
+                    `${e.from}-${e.to}`
+                  );
+                })
+              }
+            ),
+            slide.edges.map((e, i) => {
+              const a = center.get(e.from);
+              const b = center.get(e.to);
+              if (!a || !b || !e.flow) return null;
+              return /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: cn(
+                    "mie-deck-flow absolute size-2 -translate-x-1/2 -translate-y-1/2 rounded-full",
+                    accent(e.accent ?? "accent", tone.isLight).fill
+                  ),
+                  style: {
+                    "--mie-from-x": `${a.x}%`,
+                    "--mie-from-y": `${a.y}%`,
+                    "--mie-to-x": `${b.x}%`,
+                    "--mie-to-y": `${b.y}%`,
+                    animationDelay: `${i * 0.5}s`
+                  }
+                },
+                `flow-${e.from}-${e.to}`
+              );
+            }),
+            slide.edges.map((e) => {
+              const a = center.get(e.from);
+              const b = center.get(e.to);
+              if (!a || !b || !e.label) return null;
+              const at = e.labelAt ?? 0.5;
+              return /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "absolute z-10 -translate-x-1/2 -translate-y-1/2 rounded-md border px-1.5 py-0.5 text-[0.6rem] font-medium whitespace-nowrap",
+                    stageBg,
+                    tone.hairline,
+                    tone.muted
+                  ),
+                  style: {
+                    // rtl-ignore -- edge label interpolated in the SVG line coordinate space
+                    left: `${a.x + (b.x - a.x) * at}%`,
+                    top: `${a.y + (b.y - a.y) * at}%`
+                  },
+                  children: e.label
+                },
+                `label-${e.from}-${e.to}`
+              );
+            }),
+            slide.nodes.map((node) => {
+              const spec = accent(node.accent ?? "primary", tone.isLight);
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "absolute z-[5] -translate-x-1/2 -translate-y-1/2",
+                  style: {
+                    // rtl-ignore -- node positioned in the SVG edge coordinate space
+                    left: `${node.x}%`,
+                    top: `${node.y}%`,
+                    width: `${node.w ?? 20}%`
+                  },
+                  children: /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: cn(
+                        "flex flex-col items-center gap-1.5 rounded-xl border px-2 py-3 text-center shadow-lg",
+                        stageBg,
+                        spec.border
+                      ),
+                      children: [
+                        node.image ? /* @__PURE__ */ jsx(
+                          TemplateImg,
+                          {
+                            ...node.image,
+                            components,
+                            className: "h-7 w-auto object-contain sm:h-9"
+                          }
+                        ) : node.icon && /* @__PURE__ */ jsx(
+                          DeckIcon,
+                          {
+                            name: node.icon,
+                            className: cn("size-5 sm:size-6", spec.text)
+                          }
+                        ),
+                        /* @__PURE__ */ jsx("span", { className: "text-[0.62rem] leading-tight font-semibold sm:text-xs", children: node.label })
+                      ]
+                    }
+                  )
+                },
+                node.id
+              );
+            })
+          ]
+        }
+      ),
+      right.length > 0 && /* @__PURE__ */ jsx(Callouts, { callouts: right })
+    ] })
+  ] });
+}
+function Callouts({
+  callouts,
+  end
+}) {
+  const tone = useTone();
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-4", end && "lg:text-end"), children: callouts.map((c, i) => /* @__PURE__ */ jsxs(Card, { i: 4 + i, className: "p-4", children: [
+    c.lead && /* @__PURE__ */ jsx("div", { className: cn("text-sm font-bold", a.text), children: c.lead }),
+    /* @__PURE__ */ jsx("p", { className: cn("mt-1 text-sm leading-snug", tone.muted), children: c.text })
+  ] }, c.text)) });
+}
+function BadgeCard({ cert, i }) {
+  const { components } = useDeck();
+  const tone = useTone();
+  const a = accent(cert.accent ?? "accent", tone.isLight);
+  return /* @__PURE__ */ jsxs(Card, { i, className: "flex flex-col items-center p-3 text-center", children: [
+    cert.image ? /* @__PURE__ */ jsx("div", { className: "mb-2 flex h-11 items-center justify-center rounded-lg bg-white px-2.5", children: /* @__PURE__ */ jsx(
+      TemplateImg,
+      {
+        ...cert.image,
+        components,
+        className: "h-7 w-auto max-w-[72px] object-contain"
+      }
+    ) }) : /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": "true",
+        className: cn(
+          "mb-2 flex size-10 items-center justify-center rounded-lg border text-sm font-extrabold",
+          a.soft,
+          a.border,
+          a.text
+        ),
+        children: cert.badge ?? cert.name.slice(0, 3).toUpperCase()
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "text-[0.8rem] leading-tight font-bold", children: cert.name }),
+    cert.issuer && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "mt-0.5 text-[0.62rem] tracking-wide uppercase",
+          tone.muted
+        ),
+        children: cert.issuer
+      }
+    ),
+    cert.source && /* @__PURE__ */ jsx(SourceLink, { source: cert.source, className: "mt-1.5" })
+  ] });
+}
+function CertificationGridRenderer({
+  slide,
+  index
+}) {
+  const { components } = useDeck();
+  const tone = toneOf(slide, "deep");
+  const count = slide.certifications.length;
+  const featured = slide.featured;
+  const cols = featured ? "sm:grid-cols-3 lg:grid-cols-4" : count >= 5 ? "sm:grid-cols-3 lg:grid-cols-5" : count === 4 ? "sm:grid-cols-2 lg:grid-cols-4" : "sm:grid-cols-3";
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: featured ? "mt-7 grid items-center gap-8 lg:grid-cols-[auto_minmax(0,1fr)] lg:gap-12" : "mt-6",
+        children: [
+          featured && /* @__PURE__ */ jsxs(
+            "div",
+            {
+              ...reveal(3),
+              className: "mie-deck-reveal flex flex-col items-center text-center",
+              children: [
+                /* @__PURE__ */ jsx("div", { className: "flex size-40 items-center justify-center rounded-full bg-white p-2 shadow-2xl sm:size-48", children: featured.image ? /* @__PURE__ */ jsx(
+                  TemplateImg,
+                  {
+                    ...featured.image,
+                    components,
+                    className: "size-full object-contain"
+                  }
+                ) : /* @__PURE__ */ jsx("span", { className: "text-2xl font-extrabold text-neutral-900", children: featured.badge ?? featured.name }) }),
+                /* @__PURE__ */ jsx("p", { className: "mt-4 font-semibold", children: featured.name }),
+                featured.description && /* @__PURE__ */ jsx(
+                  "p",
+                  {
+                    className: cn(
+                      "mt-1 max-w-[15rem] text-sm leading-snug",
+                      tone.muted
+                    ),
+                    children: featured.description
+                  }
+                ),
+                featured.source && /* @__PURE__ */ jsx(SourceLink, { source: featured.source, className: "mt-2.5" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-2 gap-3", cols), children: slide.certifications.map((cert, i) => /* @__PURE__ */ jsx(BadgeCard, { cert, i: 4 + i }, cert.name)) })
+        ]
+      }
+    ),
+    slide.footnote && /* @__PURE__ */ jsx(SourceLink, { source: slide.footnote, className: "mt-6" })
+  ] });
+}
+var VISIBLE = 3;
+function ShowcaseCategory({
+  category,
+  i
+}) {
+  const { labels } = useDeck();
+  const tone = useTone();
+  const a = accent("primary", tone.isLight);
+  const [open, setOpen] = React9.useState(false);
+  const listId = React9.useId();
+  const hidden = category.items.length - VISIBLE;
+  return /* @__PURE__ */ jsxs(Card, { i, className: "p-4", children: [
+    /* @__PURE__ */ jsxs(
+      "h3",
+      {
+        className: cn(
+          "mb-3 flex items-center gap-2 text-xs font-bold tracking-wider uppercase",
+          a.text
+        ),
+        children: [
+          category.icon && /* @__PURE__ */ jsx(DeckIcon, { name: category.icon, className: "size-4" }),
+          category.title,
+          /* @__PURE__ */ jsx("span", { className: cn("ms-auto tabular-nums", tone.muted), children: category.items.length })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("ul", { id: listId, className: "space-y-1", children: (open ? category.items : category.items.slice(0, VISIBLE)).map(
+      (item) => /* @__PURE__ */ jsxs(
+        "li",
+        {
+          className: cn("flex gap-2 text-xs leading-relaxed", tone.muted),
+          children: [
+            /* @__PURE__ */ jsx(
+              ChevronRight,
+              {
+                "aria-hidden": "true",
+                className: "mt-0.5 size-3 flex-none rtl:-scale-x-100"
+              }
+            ),
+            item
+          ]
+        },
+        item
+      )
+    ) }),
+    hidden > 0 && /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-expanded": open,
+        "aria-controls": listId,
+        onClick: () => setOpen((o) => !o),
+        className: cn(
+          "mt-2 text-xs font-medium underline-offset-2 hover:underline",
+          a.text
+        ),
+        children: open ? labels.less : labels.more(hidden)
+      }
+    )
+  ] });
+}
+function ShowcaseRenderer({
+  slide,
+  index
+}) {
+  const { components, labels } = useDeck();
+  const tone = toneOf(slide, "deep");
+  const a = accent("accent", tone.isLight);
+  const video = slide.video;
+  const videoHref = video ? safeHref(video.href) : void 0;
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "deep", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-6 flex flex-col items-start gap-4 sm:flex-row sm:items-end sm:justify-between", children: [
+      /* @__PURE__ */ jsx(
+        SlideHeader,
+        {
+          eyebrow: slide.eyebrow,
+          title: slide.title,
+          subtitle: slide.subtitle
+        }
+      ),
+      slide.total && /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...reveal(2),
+          className: cn(
+            "mie-deck-reveal flex flex-none items-baseline gap-2 rounded-full border px-5 py-2",
+            a.soft,
+            a.border
+          ),
+          children: [
+            /* @__PURE__ */ jsx("span", { className: cn("text-3xl font-bold", a.text), children: /* @__PURE__ */ jsx(CountUp, { value: slide.total.value }) }),
+            /* @__PURE__ */ jsx("span", { className: cn("text-sm", tone.muted), children: slide.total.label })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn("grid gap-6", videoHref && "lg:grid-cols-[1fr_300px]"),
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3", children: slide.categories.map((cat, i) => /* @__PURE__ */ jsx(ShowcaseCategory, { category: cat, i: 3 + i }, cat.title)) }),
+          video && videoHref && /* @__PURE__ */ jsxs(
+            "a",
+            {
+              href: videoHref,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              ...reveal(5),
+              className: cn(
+                "mie-deck-reveal group flex flex-col overflow-hidden rounded-xl border lg:self-start",
+                tone.hairline,
+                tone.card
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "relative flex aspect-video items-center justify-center overflow-hidden bg-neutral-900", children: [
+                  video.thumbnail && /* @__PURE__ */ jsx(
+                    TemplateImg,
+                    {
+                      ...video.thumbnail,
+                      components,
+                      className: "absolute inset-0 size-full object-cover transition-transform duration-300 group-hover:scale-105"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/30" }),
+                  /* @__PURE__ */ jsx("span", { className: "bg-primary-600 relative flex size-14 items-center justify-center rounded-full border-2 border-white/30 shadow-xl transition-transform group-hover:scale-110", children: /* @__PURE__ */ jsx(
+                    Play,
+                    {
+                      "aria-hidden": "true",
+                      className: "ms-1 size-6 fill-white text-white"
+                    }
+                  ) }),
+                  video.duration && /* @__PURE__ */ jsx("span", { className: "absolute end-2 bottom-2 rounded bg-black/60 px-2 py-0.5 font-mono text-xs text-white tabular-nums", children: video.duration })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
+                  /* @__PURE__ */ jsx("p", { className: "mb-1 text-sm font-semibold", children: video.title }),
+                  video.speaker && /* @__PURE__ */ jsx("p", { className: cn("mb-2 text-xs", tone.muted), children: video.speaker }),
+                  /* @__PURE__ */ jsxs(
+                    "span",
+                    {
+                      className: cn(
+                        "inline-flex items-center gap-1 text-xs font-medium",
+                        a.text
+                      ),
+                      children: [
+                        video.cta ?? labels.watchVideo,
+                        /* @__PURE__ */ jsx(ExternalLink, { "aria-hidden": "true", className: "size-3" })
+                      ]
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function Highlights({
+  items
+}) {
+  const r = reveal(3);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        r.className,
+        "mt-10 flex flex-wrap items-center justify-center gap-x-10 gap-y-6"
+      ),
+      style: r.style,
+      children: items.map((h) => /* @__PURE__ */ jsx(HighlightFigure, { value: h.value, label: h.label }, h.label))
+    }
+  );
+}
+function CoverRenderer({
+  slide,
+  index
+}) {
+  const { components } = useDeck();
+  const tone = toneOf(slide, "brand");
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "brand", width: "md", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center text-center", children: [
+    slide.image && /* @__PURE__ */ jsx(
+      TemplateImg,
+      {
+        ...slide.image,
+        priority: index === 0,
+        components,
+        className: "mb-8 h-32 w-auto object-contain sm:h-40"
+      }
+    ),
+    slide.eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: slide.eyebrow }),
+    /* @__PURE__ */ jsx(SlideTitle, { size: "xl", children: slide.title }),
+    slide.subtitle && /* @__PURE__ */ jsx(Subtitle, { className: "mx-auto sm:text-xl", children: slide.subtitle }),
+    slide.highlights && slide.highlights.length > 0 && /* @__PURE__ */ jsx(Highlights, { items: slide.highlights }),
+    (slide.dateline || slide.preparedBy) && /* @__PURE__ */ jsx("p", { className: cn("mt-10 text-sm", tone.muted), children: [slide.preparedBy, slide.dateline].filter(Boolean).join(" \xB7 ") })
+  ] }) });
+}
+function SectionDividerRenderer({
+  slide,
+  index
+}) {
+  const { components } = useDeck();
+  const tone = toneOf(slide, "glow");
+  const a = accent("accent", tone.isLight);
+  const hasImage = !!slide.image;
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "glow", children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: hasImage ? "grid items-center gap-10 md:grid-cols-2 lg:gap-16" : "flex flex-col items-center text-center",
+      children: [
+        slide.image && /* @__PURE__ */ jsx("div", { ...reveal(0), className: "mie-deck-reveal order-2 md:order-1", children: /* @__PURE__ */ jsx(
+          TemplateImg,
+          {
+            ...slide.image,
+            components,
+            className: "mx-auto aspect-[3/4] w-full max-w-sm rounded-2xl object-cover"
+          }
+        ) }),
+        /* @__PURE__ */ jsxs("div", { className: hasImage ? "order-1 md:order-2" : "max-w-4xl", children: [
+          slide.eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: slide.eyebrow }),
+          slide.statement && /* @__PURE__ */ jsx(
+            "p",
+            {
+              ...reveal(1),
+              className: "mie-deck-reveal text-6xl font-extrabold tracking-tight text-balance sm:text-7xl lg:text-8xl",
+              children: slide.statement
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            SlideTitle,
+            {
+              size: slide.statement ? "md" : "lg",
+              className: cn(slide.statement && "mt-3 font-semibold opacity-80"),
+              children: slide.title
+            }
+          ),
+          slide.description && /* @__PURE__ */ jsx(Subtitle, { className: cn(!hasImage && "mx-auto"), children: slide.description }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "aria-hidden": "true",
+              className: cn(
+                "mt-8 h-1 w-24 rounded-full",
+                a.fill,
+                !hasImage && "mx-auto"
+              )
+            }
+          )
+        ] })
+      ]
+    }
+  ) });
+}
+function TableOfContentsRenderer({
+  slide,
+  index
+}) {
+  const { slides, activeSlide, goTo, labels } = useDeck();
+  const tone = toneOf(slide, "brand");
+  const a = accent("accent", tone.isLight);
+  const sections = slide.sections ?? Object.entries(
+    slides.reduce((acc, s, i) => {
+      if (i === index || !("title" in s) || !s.title) return acc;
+      (acc[s.section ?? ""] ??= []).push({
+        number: i + 1,
+        title: s.navLabel ?? s.title
+      });
+      return acc;
+    }, {})
+  ).map(([heading, items]) => ({ heading: heading || void 0, items }));
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "brand", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.description
+      }
+    ),
+    /* @__PURE__ */ jsx("nav", { "aria-label": labels.outline, className: "mt-6 md:columns-2 md:gap-12", children: sections.map((section, s) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ...reveal(3 + s),
+        className: "mie-deck-reveal mb-5 break-inside-avoid",
+        children: [
+          section.heading && /* @__PURE__ */ jsx(
+            "h3",
+            {
+              className: cn(
+                "mb-1.5 text-xs font-semibold tracking-[0.2em] uppercase",
+                a.text
+              ),
+              children: section.heading
+            }
+          ),
+          /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-0.5", children: section.items.map((entry) => {
+            const target = entry.number - 1;
+            const current = target === activeSlide;
+            return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => goTo(target),
+                "aria-current": current ? "true" : void 0,
+                className: cn(
+                  "flex w-full items-baseline gap-3 rounded-lg px-3 py-1 text-start transition-colors",
+                  current ? a.soft : tone.isLight ? "hover:bg-neutral-100" : "hover:bg-white/5"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "text-sm font-semibold tabular-nums",
+                        a.text
+                      ),
+                      children: String(entry.number).padStart(2, "0")
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("span", { children: [
+                    entry.title,
+                    entry.subtitle && /* @__PURE__ */ jsx("span", { className: cn("block text-xs", tone.muted), children: entry.subtitle })
+                  ] })
+                ]
+              }
+            ) }, entry.number);
+          }) })
+        ]
+      },
+      section.heading ?? s
+    )) })
+  ] });
+}
+function BulletListRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "brand");
+  const r = reveal(3);
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "brand", width: "lg", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "ul",
+      {
+        className: cn(r.className, "mt-10 flex flex-col gap-4"),
+        style: r.style,
+        children: slide.items.map((item, i) => /* @__PURE__ */ jsx(Bullet, { item }, i))
+      }
+    ),
+    slide.note && /* @__PURE__ */ jsx("p", { className: cn("mt-8 text-sm italic", tone.muted), children: slide.note })
+  ] });
+}
+function QuoteRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "brand");
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsx(
+    SlideFrame,
+    {
+      slide: {
+        ...slide,
+        navLabel: slide.navLabel ?? slide.title ?? slide.attribution
+      },
+      index,
+      tone: "brand",
+      width: "md",
+      children: /* @__PURE__ */ jsxs("figure", { className: "flex flex-col items-center text-center", children: [
+        slide.eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: slide.eyebrow }),
+        slide.title && /* @__PURE__ */ jsx(SlideTitle, { size: "md", className: "mb-6", children: slide.title }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn("text-7xl leading-none sm:text-8xl", a.text),
+            children: "\u201C"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "blockquote",
+          {
+            ...reveal(2),
+            className: "mie-deck-reveal -mt-4 text-2xl leading-snug font-semibold text-balance sm:text-3xl lg:text-4xl",
+            children: slide.quote
+          }
+        ),
+        (slide.attribution || slide.role) && /* @__PURE__ */ jsxs("figcaption", { ...reveal(3), className: "mie-deck-reveal mt-8", children: [
+          slide.attribution && /* @__PURE__ */ jsx("span", { className: cn("text-lg font-semibold", a.text), children: slide.attribution }),
+          slide.role && /* @__PURE__ */ jsx("span", { className: cn("block text-sm", tone.muted), children: slide.role })
+        ] }),
+        slide.source && /* @__PURE__ */ jsx(SourceLink, { source: slide.source, className: "mt-5" })
+      ] })
+    }
+  );
+}
+function ImageRenderer({
+  slide,
+  index
+}) {
+  const { components } = useDeck();
+  const tone = toneOf(slide, "ink");
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "ink", children: [
+    /* @__PURE__ */ jsx(SlideTitle, { className: "mb-8 text-center", children: slide.title }),
+    /* @__PURE__ */ jsxs("figure", { ...reveal(2), className: "mie-deck-reveal", children: [
+      /* @__PURE__ */ jsx(
+        TemplateImg,
+        {
+          ...slide.image,
+          components,
+          className: "mx-auto max-h-[65dvh] w-auto rounded-2xl object-contain shadow-2xl"
+        }
+      ),
+      slide.caption && /* @__PURE__ */ jsx("figcaption", { className: cn("mt-4 text-center text-sm", tone.muted), children: slide.caption })
+    ] })
+  ] });
+}
+function DefinitionListRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "brand");
+  const a = accent("accent", tone.isLight);
+  return /* @__PURE__ */ jsxs(SlideFrame, { slide, index, tone: "brand", children: [
+    /* @__PURE__ */ jsx(
+      SlideHeader,
+      {
+        eyebrow: slide.eyebrow,
+        title: slide.title,
+        subtitle: slide.subtitle
+      }
+    ),
+    /* @__PURE__ */ jsx("dl", { className: "mt-6 flex flex-col gap-2", children: slide.terms.map((term, i) => {
+      const initial = term.term.charAt(0);
+      const r = reveal(3 + i);
+      return (
+        // A <dl> group div may contain only <dt>/<dd> (axe dlitem).
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              r.className,
+              "rounded-xl border p-3",
+              tone.card,
+              tone.hairline
+            ),
+            style: r.style,
+            children: [
+              /* @__PURE__ */ jsxs("dt", { className: "flex items-center gap-4 text-base font-bold sm:text-lg", children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: cn(
+                      "flex size-10 flex-none items-center justify-center rounded-lg border text-xl font-extrabold",
+                      a.soft,
+                      a.border,
+                      a.text
+                    ),
+                    children: initial
+                  }
+                ),
+                term.term
+              ] }),
+              /* @__PURE__ */ jsxs(
+                "dd",
+                {
+                  className: cn(
+                    "ms-14 mt-0.5 text-sm leading-relaxed",
+                    tone.muted
+                  ),
+                  children: [
+                    term.lead && /* @__PURE__ */ jsxs("span", { className: cn("font-semibold", tone.text), children: [
+                      term.lead,
+                      " "
+                    ] }),
+                    term.definition
+                  ]
+                }
+              )
+            ]
+          },
+          term.term
+        )
+      );
+    }) }),
+    slide.source && /* @__PURE__ */ jsx(SourceLink, { source: slide.source, className: "mt-4" })
+  ] });
+}
+function CopyLink({ url }) {
+  const { labels } = useDeck();
+  const tone = useTone();
+  const [copied, setCopied] = React9.useState(false);
+  React9.useEffect(() => {
+    if (!copied) return;
+    const t = setTimeout(() => setCopied(false), 2e3);
+    return () => clearTimeout(t);
+  }, [copied]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "mt-8 flex w-full max-w-xl items-center gap-2 rounded-xl border p-2",
+        tone.card,
+        tone.hairline
+      ),
+      children: [
+        /* @__PURE__ */ jsx("code", { className: "min-w-0 flex-1 truncate px-2 text-start text-sm", children: url }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => navigator.clipboard?.writeText(url).then(
+              () => setCopied(true),
+              () => {
+              }
+            ),
+            className: cn(
+              "inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-semibold",
+              tone.isLight ? "bg-neutral-900 text-white" : "bg-white text-neutral-900"
+            ),
+            children: [
+              copied ? /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-4" }) : /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-4" }),
+              /* @__PURE__ */ jsx("span", { "aria-live": "polite", children: copied ? labels.copied : labels.copy })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function CtaButton({ link, primary }) {
+  const { components } = useDeck();
+  const tone = useTone();
+  return /* @__PURE__ */ jsxs(
+    TemplateAnchor,
+    {
+      href: link.href,
+      trackingId: link.trackingId,
+      components,
+      className: cn(
+        "inline-flex items-center gap-2 rounded-full px-6 py-3 text-sm font-semibold transition-colors",
+        primary ? "bg-accent text-neutral-950 hover:opacity-90" : cn(
+          "border",
+          tone.hairline,
+          tone.isLight ? "hover:bg-neutral-100" : "hover:bg-white/10"
+        )
+      ),
+      children: [
+        link.label,
+        primary && /* @__PURE__ */ jsx(ArrowRight, { "aria-hidden": "true", className: "size-4 rtl:-scale-x-100" })
+      ]
+    }
+  );
+}
+function ConclusionRenderer({
+  slide,
+  index
+}) {
+  const tone = toneOf(slide, "brand");
+  return /* @__PURE__ */ jsx(SlideFrame, { slide, index, tone: "brand", width: "sm", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center text-center", children: [
+    slide.eyebrow && /* @__PURE__ */ jsx(Eyebrow, { children: slide.eyebrow }),
+    /* @__PURE__ */ jsx(SlideTitle, { children: slide.title }),
+    slide.body && /* @__PURE__ */ jsx(Subtitle, { className: "mx-auto", children: slide.body }),
+    slide.highlights && slide.highlights.length > 0 && /* @__PURE__ */ jsx(Highlights, { items: slide.highlights }),
+    slide.takeaways && slide.takeaways.length > 0 && /* @__PURE__ */ jsx(
+      "ul",
+      {
+        ...reveal(4),
+        className: "mie-deck-reveal mt-10 flex flex-col gap-3 text-start",
+        children: slide.takeaways.map((t) => /* @__PURE__ */ jsx(Bullet, { item: t }, t))
+      }
+    ),
+    slide.share && /* @__PURE__ */ jsxs(Fragment, { children: [
+      slide.share.instructions && /* @__PURE__ */ jsx("p", { className: cn("mt-10 text-sm", tone.muted), children: slide.share.instructions }),
+      /* @__PURE__ */ jsx(CopyLink, { url: slide.share.url })
+    ] }),
+    (slide.cta || slide.secondaryCta) && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ...reveal(5),
+        className: "mie-deck-reveal mt-12 flex flex-wrap items-center justify-center gap-4",
+        children: [
+          slide.cta && /* @__PURE__ */ jsx(CtaButton, { link: slide.cta, primary: true }),
+          slide.secondaryCta && /* @__PURE__ */ jsx(CtaButton, { link: slide.secondaryCta })
+        ]
+      }
+    ),
+    (slide.preparedBy || slide.dateline) && /* @__PURE__ */ jsx("p", { className: cn("mt-10 text-sm", tone.muted), children: [slide.preparedBy, slide.dateline].filter(Boolean).join(" \xB7 ") }),
+    slide.confidentiality && /* @__PURE__ */ jsx(
+      "p",
+      {
+        className: cn("mt-3 text-xs tracking-wider uppercase", tone.muted),
+        children: slide.confidentiality
+      }
+    )
+  ] }) });
+}
+
+// src/components/Deck/registry.tsx
+var slideRenderers = {
+  cover: CoverRenderer,
+  "section-divider": SectionDividerRenderer,
+  "table-of-contents": TableOfContentsRenderer,
+  "bullet-list": BulletListRenderer,
+  quote: QuoteRenderer,
+  image: ImageRenderer,
+  "definition-list": DefinitionListRenderer,
+  conclusion: ConclusionRenderer,
+  metrics: MetricsRenderer,
+  chart: ChartRenderer,
+  "feature-highlight": FeatureHighlightRenderer,
+  "comparison-table": ComparisonTableRenderer,
+  "impact-table": ImpactTableRenderer,
+  cards: CardsRenderer,
+  "ranked-list": RankedListRenderer,
+  breakdown: BreakdownRenderer,
+  cycle: CycleRenderer,
+  roadmap: RoadmapRenderer,
+  "adoption-curve": AdoptionCurveRenderer,
+  diagram: DiagramRenderer,
+  "certification-grid": CertificationGridRenderer,
+  showcase: ShowcaseRenderer,
+  tabs: TabsRenderer
+};
+var typingTarget = (el) => el instanceof HTMLElement && (["INPUT", "TEXTAREA", "SELECT"].includes(el.tagName) || el.isContentEditable || el.getAttribute("role") === "tab");
+var spaceActivates = (el) => el instanceof HTMLElement && (el.tagName === "BUTTON" || el.getAttribute("role") === "button");
+var Deck = React9.forwardRef(
+  ({
+    slides,
+    meta,
+    home,
+    onSlideChange,
+    renderers,
+    graphics,
+    components,
+    icons,
+    labels: labelOverrides,
+    locale,
+    syncHash = true,
+    className,
+    ...rest
+  }, ref) => {
+    const rootRef = React9.useRef(null);
+    const scrollRef = React9.useRef(null);
+    const touchStart = React9.useRef(null);
+    const [active, setActive] = React9.useState(0);
+    const [ready, setReady] = React9.useState(false);
+    const [outline, setOutline] = React9.useState(false);
+    const [fullscreen, setFullscreen] = React9.useState(false);
+    const [hintPulse, setHintPulse] = React9.useState(0);
+    const labels = React9.useMemo(
+      () => ({ ...defaultDeckLabels, ...labelOverrides }),
+      [labelOverrides]
+    );
+    const total = slides.length;
+    React9.useImperativeHandle(ref, () => rootRef.current);
+    const slideEl = React9.useCallback(
+      (i) => scrollRef.current?.querySelector(
+        `[data-slot="deck-slide"][data-index="${i}"]`
+      ),
+      []
+    );
+    const goTo = React9.useCallback(
+      (i) => {
+        const clamped = Math.max(0, Math.min(i, total - 1));
+        const reduce = window.matchMedia?.(
+          "(prefers-reduced-motion: reduce)"
+        ).matches;
+        slideEl(clamped)?.scrollIntoView({
+          behavior: reduce ? "auto" : "smooth"
+        });
+      },
+      [slideEl, total]
+    );
+    React9.useEffect(() => {
+      const root = scrollRef.current;
+      if (!root) return;
+      const observer = new IntersectionObserver(
+        (entries) => {
+          for (const entry of entries) {
+            if (!entry.isIntersecting) continue;
+            const rootHeight = root.clientHeight || window.innerHeight;
+            if (entry.intersectionRatio < 0.5 && entry.intersectionRect.height < rootHeight / 2)
+              continue;
+            const el = entry.target;
+            el.dataset.seen = "";
+            setActive(Number(el.dataset.index));
+          }
+        },
+        { root, threshold: [0.1, 0.25, 0.5] }
+      );
+      root.querySelectorAll('[data-slot="deck-slide"]').forEach((el) => observer.observe(el));
+      setReady(true);
+      return () => observer.disconnect();
+    }, [total]);
+    React9.useEffect(() => {
+      const raw = window.location.hash.slice(1);
+      let hash = raw;
+      try {
+        hash = decodeURIComponent(raw);
+      } catch {
+      }
+      if (!hash) return;
+      const i = slides.findIndex((s, n) => slideAnchor(s, n) === hash);
+      if (i > 0) requestAnimationFrame(() => slideEl(i)?.scrollIntoView());
+    }, []);
+    const reportedSlide = React9.useRef(-1);
+    React9.useEffect(() => {
+      const slide = slides[active];
+      if (!slide) return;
+      if (syncHash && ready) {
+        const hash = `#${slideAnchor(slide, active)}`;
+        if (window.location.hash !== hash)
+          window.history.replaceState(window.history.state, "", hash);
+      }
+      if (reportedSlide.current !== active) {
+        reportedSlide.current = active;
+        onSlideChange?.(slide, active);
+      }
+    }, [active, slides, syncHash, ready]);
+    const toggleFullscreen = React9.useCallback(() => {
+      if (!document.fullscreenElement)
+        rootRef.current?.requestFullscreen?.().catch(() => {
+        });
+      else document.exitFullscreen?.().catch(() => {
+      });
+    }, []);
+    React9.useEffect(() => {
+      const onChange = () => setFullscreen(!!document.fullscreenElement);
+      document.addEventListener("fullscreenchange", onChange);
+      return () => document.removeEventListener("fullscreenchange", onChange);
+    }, []);
+    React9.useEffect(() => {
+      const onKey = (e) => {
+        if (outline || e.defaultPrevented || e.metaKey || e.ctrlKey || e.altKey)
+          return;
+        if (typingTarget(e.target)) return;
+        const key = e.key;
+        if (key === " " && spaceActivates(e.target)) return;
+        const rtl = isRtl(rootRef.current);
+        const nextKey = rtl ? "ArrowLeft" : "ArrowRight";
+        const prevKey = rtl ? "ArrowRight" : "ArrowLeft";
+        if (["ArrowDown", nextKey, "PageDown", " "].includes(key)) {
+          e.preventDefault();
+          goTo(active + 1);
+        } else if (["ArrowUp", prevKey, "PageUp"].includes(key)) {
+          e.preventDefault();
+          goTo(active - 1);
+        } else if (key === "Home") {
+          e.preventDefault();
+          goTo(0);
+        } else if (key === "End") {
+          e.preventDefault();
+          goTo(total - 1);
+        } else if (/^[1-9]$/.test(key)) {
+          goTo(Number(key) - 1);
+        } else if (key.toLowerCase() === "f") {
+          toggleFullscreen();
+        } else if (key === "?") {
+          setHintPulse((p) => p + 1);
+        }
+      };
+      window.addEventListener("keydown", onKey);
+      return () => window.removeEventListener("keydown", onKey);
+    }, [active, goTo, outline, toggleFullscreen, total]);
+    const onTouchEnd = (e) => {
+      if (touchStart.current === null) return;
+      const delta = touchStart.current - e.changedTouches[0].clientY;
+      touchStart.current = null;
+      const el = slideEl(active);
+      if (el && scrollRef.current && el.scrollHeight > scrollRef.current.clientHeight + 20)
+        return;
+      if (Math.abs(delta) > 120) goTo(active + (delta > 0 ? 1 : -1));
+    };
+    const context = React9.useMemo(
+      () => ({
+        slides,
+        activeSlide: active,
+        goTo,
+        labels,
+        components,
+        icons,
+        graphics,
+        renderers,
+        locale
+      }),
+      [
+        slides,
+        active,
+        goTo,
+        labels,
+        components,
+        icons,
+        graphics,
+        renderers,
+        locale
+      ]
+    );
+    const closeOutline = React9.useCallback(() => setOutline(false), []);
+    const progress = total > 1 ? active / (total - 1) * 100 : 0;
+    return /* @__PURE__ */ jsx(DeckProvider, { value: context, children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: rootRef,
+        role: "region",
+        "aria-roledescription": labels.presentation,
+        "aria-label": meta.title,
+        "data-slot": "deck",
+        "data-ready": ready || void 0,
+        className: cn(
+          "mie-deck relative h-dvh w-full overflow-hidden bg-neutral-950 text-white",
+          className
+        ),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxs("h1", { className: "sr-only", children: [
+            meta.title,
+            meta.period ? ` \u2014 ${meta.period}` : ""
+          ] }),
+          home && /* @__PURE__ */ jsxs(
+            TemplateAnchor,
+            {
+              href: home.href,
+              trackingId: home.trackingId,
+              components,
+              className: "mie-deck-chrome absolute start-3 top-3 z-50 inline-flex items-center gap-2 rounded-full border border-white/10 bg-black/25 py-1.5 ps-2 pe-3 text-xs font-semibold text-white/80 backdrop-blur transition-colors hover:bg-white/10 hover:text-white print:hidden",
+              children: [
+                home.logo && /* @__PURE__ */ jsx(
+                  TemplateImg,
+                  {
+                    ...home.logo,
+                    alt: "",
+                    components,
+                    className: "size-[18px] object-contain"
+                  }
+                ),
+                home.label
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(ProgressBar, { progress }),
+          /* @__PURE__ */ jsx(DotNav, { slides, active, goTo, labels }),
+          /* @__PURE__ */ jsx(
+            SlideCounter,
+            {
+              active,
+              total,
+              section: slides[active]?.section
+            }
+          ),
+          /* @__PURE__ */ jsx(KeyboardHints, { pulse: hintPulse, labels }),
+          /* @__PURE__ */ jsx(
+            Controls,
+            {
+              isFullscreen: fullscreen,
+              onToggleFullscreen: toggleFullscreen,
+              onOpenOutline: () => setOutline(true),
+              labels
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: scrollRef,
+              onTouchStart: (e) => {
+                touchStart.current = e.touches[0].clientY;
+              },
+              onTouchEnd,
+              className: "mie-deck-scroll size-full snap-y snap-mandatory overflow-y-auto",
+              children: slides.map((slide, i) => {
+                const Renderer = slide.type === "custom" ? renderers?.[slide.component] : renderers?.[slide.type] ?? slideRenderers[slide.type];
+                return Renderer ? /* @__PURE__ */ jsx(Renderer, { slide, index: i }, slideAnchor(slide, i)) : null;
+              })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            MobileNav,
+            {
+              active,
+              total,
+              onPrev: () => goTo(active - 1),
+              onNext: () => goTo(active + 1),
+              onOpenOutline: () => setOutline(true),
+              labels
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            OutlineDialog,
+            {
+              open: outline,
+              onClose: closeOutline,
+              slides,
+              active,
+              goTo,
+              labels
+            }
+          )
+        ]
+      }
+    ) });
+  }
+);
+Deck.displayName = "Deck";
+
+export { Bullet, CountUp, Deck, DeckIcon, Graphic, HighlightFigure, IconChip, Card as SlideCard, Eyebrow as SlideEyebrow, SlideFrame, SlideHeader, Subtitle as SlideSubtitle, SlideTitle, SourceLink, defaultDeckLabels, reveal, accent as slideAccent, slideAnchor, slideRenderers, TONES as slideTones, toneOf, useDeck, useTone };
+//# sourceMappingURL=deck.js.map
+//# sourceMappingURL=deck.js.map