@active-reach/web-sdk 1.21.0 → 1.22.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import { S as Storage, l as logger, A as Aegis } from "./analytics-DblhjFhs.mjs";
-import { B, E, N, R, U, m } from "./analytics-DblhjFhs.mjs";
+import { S as Storage, l as logger, A as Aegis } from "./analytics-0p0p56H0.mjs";
+import { B, E, N, R, U, m } from "./analytics-0p0p56H0.mjs";
 import { AegisWebPush } from "./push/AegisWebPush.js";
 function debounce(func, wait) {
   let timeoutId = null;
@@ -25,9 +25,700 @@ function throttle(func, limit) {
     }
   };
 }
+const ICONS = {
+  x: [
+    ["path", { d: "M18 6 6 18" }],
+    ["path", { d: "m6 6 12 12" }]
+  ],
+  check: [["path", { d: "M20 6 9 17l-5-5" }]],
+  info: [
+    ["circle", { cx: "12", cy: "12", r: "10" }],
+    ["path", { d: "M12 16v-4" }],
+    ["path", { d: "M12 8h.01" }]
+  ],
+  "triangle-alert": [
+    ["path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }],
+    ["path", { d: "M12 9v4" }],
+    ["path", { d: "M12 17h.01" }]
+  ],
+  "volume-2": [
+    [
+      "path",
+      {
+        d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"
+      }
+    ],
+    ["path", { d: "M16 9a5 5 0 0 1 0 6" }],
+    ["path", { d: "M19.364 18.364a9 9 0 0 0 0-12.728" }]
+  ],
+  "volume-x": [
+    [
+      "path",
+      {
+        d: "M11 4.702a.705.705 0 0 0-1.203-.498L6.413 7.587A1.4 1.4 0 0 1 5.416 8H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2.416a1.4 1.4 0 0 1 .997.413l3.383 3.384A.705.705 0 0 0 11 19.298z"
+      }
+    ],
+    ["line", { x1: "22", x2: "16", y1: "9", y2: "15" }],
+    ["line", { x1: "16", x2: "22", y1: "9", y2: "15" }]
+  ],
+  clock: [
+    ["circle", { cx: "12", cy: "12", r: "10" }],
+    ["polyline", { points: "12 6 12 12 16 14" }]
+  ],
+  play: [["polygon", { points: "6 3 20 12 6 21 6 3" }]],
+  pause: [
+    ["rect", { x: "14", y: "4", width: "4", height: "16", rx: "1" }],
+    ["rect", { x: "6", y: "4", width: "4", height: "16", rx: "1" }]
+  ],
+  square: [["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }]],
+  "square-check": [
+    ["path", { d: "M21 10.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.5" }],
+    ["path", { d: "m9 11 3 3L22 4" }]
+  ],
+  truck: [
+    ["path", { d: "M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2" }],
+    ["path", { d: "M15 18H9" }],
+    [
+      "path",
+      {
+        d: "M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14"
+      }
+    ],
+    ["circle", { cx: "17", cy: "18", r: "2" }],
+    ["circle", { cx: "7", cy: "18", r: "2" }]
+  ],
+  "circle-check": [
+    ["circle", { cx: "12", cy: "12", r: "10" }],
+    ["path", { d: "m9 12 2 2 4-4" }]
+  ],
+  // ── Commerce / value-bar set (rich card editor picker) ───────────────────
+  "shopping-cart": [
+    ["circle", { cx: "8", cy: "21", r: "1" }],
+    ["circle", { cx: "19", cy: "21", r: "1" }],
+    ["path", { d: "M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12" }]
+  ],
+  "shopping-bag": [
+    ["path", { d: "M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z" }],
+    ["path", { d: "M3 6h18" }],
+    ["path", { d: "M16 10a4 4 0 0 1-8 0" }]
+  ],
+  gift: [
+    ["rect", { x: "3", y: "8", width: "18", height: "4", rx: "1" }],
+    ["path", { d: "M12 8v13" }],
+    ["path", { d: "M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7" }],
+    ["path", { d: "M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5" }]
+  ],
+  tag: [
+    ["path", { d: "M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z" }],
+    ["circle", { cx: "7.5", cy: "7.5", r: ".5", fill: "currentColor" }]
+  ],
+  percent: [
+    ["line", { x1: "19", x2: "5", y1: "5", y2: "19" }],
+    ["circle", { cx: "6.5", cy: "6.5", r: "2.5" }],
+    ["circle", { cx: "17.5", cy: "17.5", r: "2.5" }]
+  ],
+  star: [
+    ["path", { d: "M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z" }]
+  ],
+  sparkles: [
+    ["path", { d: "M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z" }],
+    ["path", { d: "M20 3v4" }],
+    ["path", { d: "M22 5h-4" }]
+  ],
+  zap: [
+    ["path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z" }]
+  ],
+  heart: [
+    ["path", { d: "M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z" }]
+  ],
+  bell: [
+    ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0" }],
+    ["path", { d: "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]
+  ],
+  lock: [
+    ["rect", { width: "18", height: "11", x: "3", y: "11", rx: "2", ry: "2" }],
+    ["path", { d: "M7 11V7a5 5 0 0 1 10 0v4" }]
+  ],
+  "badge-check": [
+    ["path", { d: "M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" }],
+    ["path", { d: "m9 12 2 2 4-4" }]
+  ],
+  package: [
+    ["path", { d: "M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z" }],
+    ["path", { d: "M12 22V12" }],
+    ["path", { d: "m3.3 7 8.7 5 8.7-5" }],
+    ["path", { d: "m7.5 4.27 9 5.15" }]
+  ],
+  flame: [
+    ["path", { d: "M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z" }]
+  ],
+  crown: [
+    ["path", { d: "M11.562 3.266a.5.5 0 0 1 .876 0L15.39 8.87a1 1 0 0 0 1.516.294L21.183 5.5a.5.5 0 0 1 .798.519l-2.834 10.246a1 1 0 0 1-.956.734H5.81a1 1 0 0 1-.957-.734L2.02 6.02a.5.5 0 0 1 .798-.519l4.276 3.664a1 1 0 0 0 1.516-.294z" }],
+    ["path", { d: "M5 21h14" }]
+  ],
+  ticket: [
+    ["path", { d: "M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z" }],
+    ["path", { d: "M13 5v2" }],
+    ["path", { d: "M13 17v2" }],
+    ["path", { d: "M13 11v2" }]
+  ],
+  wallet: [
+    ["path", { d: "M19 7V4a1 1 0 0 0-1-1H5a2 2 0 0 0 0 4h15a1 1 0 0 1 1 1v4h-3a2 2 0 0 0 0 4h3a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1" }],
+    ["path", { d: "M3 5v14a2 2 0 0 0 2 2h15a1 1 0 0 0 1-1v-4" }]
+  ],
+  coins: [
+    ["circle", { cx: "8", cy: "8", r: "6" }],
+    ["path", { d: "M18.09 10.37A6 6 0 1 1 10.34 18" }],
+    ["path", { d: "M7 6h1v4" }],
+    ["path", { d: "m16.71 13.88.7.71-2.82 2.82" }]
+  ],
+  trophy: [
+    ["path", { d: "M6 9H4.5a2.5 2.5 0 0 1 0-5H6" }],
+    ["path", { d: "M18 9h1.5a2.5 2.5 0 0 0 0-5H18" }],
+    ["path", { d: "M4 22h16" }],
+    ["path", { d: "M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22" }],
+    ["path", { d: "M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22" }],
+    ["path", { d: "M18 2H6v7a6 6 0 0 0 12 0V2Z" }]
+  ],
+  timer: [
+    ["line", { x1: "10", x2: "14", y1: "2", y2: "2" }],
+    ["line", { x1: "12", x2: "15", y1: "14", y2: "11" }],
+    ["circle", { cx: "12", cy: "14", r: "8" }]
+  ],
+  "map-pin": [
+    ["path", { d: "M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0" }],
+    ["circle", { cx: "12", cy: "10", r: "3" }]
+  ],
+  user: [
+    ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }],
+    ["circle", { cx: "12", cy: "7", r: "4" }]
+  ],
+  "thumbs-up": [
+    ["path", { d: "M7 10v12" }],
+    ["path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z" }]
+  ],
+  "arrow-right": [
+    ["path", { d: "M5 12h14" }],
+    ["path", { d: "m12 5 7 7-7 7" }]
+  ],
+  "chevron-right": [["path", { d: "m9 18 6-6-6-6" }]],
+  plus: [
+    ["path", { d: "M5 12h14" }],
+    ["path", { d: "M12 5v14" }]
+  ],
+  store: [
+    ["path", { d: "m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7" }],
+    ["path", { d: "M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8" }],
+    ["path", { d: "M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4" }],
+    ["path", { d: "M2 7h20" }],
+    ["path", { d: "M22 7v3a2 2 0 0 1-2 2a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7" }]
+  ],
+  rocket: [
+    ["path", { d: "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z" }],
+    ["path", { d: "m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z" }],
+    ["path", { d: "M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" }],
+    ["path", { d: "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" }]
+  ]
+};
+function escapeAttr(value) {
+  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+}
+const SVG_NS = "http://www.w3.org/2000/svg";
+function lucideSvgEl(name, opts = {}) {
+  const node = ICONS[name];
+  if (!node || typeof document === "undefined") return null;
+  const size = opts.size ?? 24;
+  const svg = document.createElementNS(SVG_NS, "svg");
+  svg.setAttribute("width", String(size));
+  svg.setAttribute("height", String(size));
+  svg.setAttribute("viewBox", "0 0 24 24");
+  svg.setAttribute("fill", "none");
+  svg.setAttribute("stroke", opts.color ?? "currentColor");
+  svg.setAttribute("stroke-width", String(opts.strokeWidth ?? 2));
+  svg.setAttribute("stroke-linecap", "round");
+  svg.setAttribute("stroke-linejoin", "round");
+  if (opts.className) svg.setAttribute("class", opts.className);
+  if (opts.ariaLabel) {
+    svg.setAttribute("role", "img");
+    svg.setAttribute("aria-label", opts.ariaLabel);
+  } else {
+    svg.setAttribute("aria-hidden", "true");
+  }
+  for (const [tag, attrs] of node) {
+    const child = document.createElementNS(SVG_NS, tag);
+    for (const [k, v] of Object.entries(attrs)) child.setAttribute(k, String(v));
+    svg.appendChild(child);
+  }
+  return svg;
+}
+function lucideSvg(name, opts = {}) {
+  const node = ICONS[name];
+  if (!node) return "";
+  const size = opts.size ?? 24;
+  const color = opts.color ?? "currentColor";
+  const strokeWidth = opts.strokeWidth ?? 2;
+  const a11y = opts.ariaLabel ? `role="img" aria-label="${escapeAttr(opts.ariaLabel)}"` : 'aria-hidden="true"';
+  const cls = opts.className ? ` class="${escapeAttr(opts.className)}"` : "";
+  const children = node.map(([tag, attrs]) => {
+    const attrStr = Object.entries(attrs).map(([k, v]) => `${k}="${escapeAttr(String(v))}"`).join(" ");
+    return `<${tag} ${attrStr}/>`;
+  }).join("");
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 24 24" fill="none" stroke="${escapeAttr(color)}" stroke-width="${strokeWidth}" stroke-linecap="round" stroke-linejoin="round"${cls} ${a11y}>${children}</svg>`;
+}
+const WEIGHT = {
+  regular: "400",
+  medium: "500",
+  semibold: "600",
+  bold: "700"
+};
+const ICON_PX = { sm: 22, md: 30, lg: 40 };
+const TEXT_PX = { sm: 11.5, md: 13, lg: 15 };
+function interpolateTokens(s, ctx) {
+  if (!s || s.indexOf("{") === -1) return s;
+  const props = ctx.properties && ctx.properties() || {};
+  const cart = ctx.getCartState && ctx.getCartState();
+  return s.replace(/\{([a-z0-9_.]+)\}/gi, (_m, key) => {
+    let v = props[key];
+    if (v == null) {
+      if (key === "cart.total") v = cart == null ? void 0 : cart.total;
+      else if (key === "cart.count") v = cart == null ? void 0 : cart.itemCount;
+    }
+    return v == null || v === "" ? "" : String(v);
+  });
+}
+const ASPECT$2 = { "1/1": "1 / 1", "4/3": "4 / 3", "16/9": "16 / 9" };
+const DEFAULT_CARD_TEMPLATE = {
+  id: "clean",
+  frame: { bg: "#ffffff", border: "#f1f1f3", radius: 14 },
+  elements: [
+    { type: "image", aspect: "1/1", radius: 10 },
+    { type: "price", variant: "pill", color: "#059669" },
+    { type: "title", lines: 2 },
+    { type: "rating" },
+    // Zepto/Blinkit-style ADD: a single OUTLINED pill (white fill, brand
+    // border + brand text) overlaid on the bottom-right of the product image —
+    // NOT a solid filled bar. `overlay:true` anchors it onto the image; the
+    // outline variant paints the white/border look. The rail's tile-body click
+    // still opens the product, so this one CTA owns add-to-cart.
+    { type: "cta", variant: "outline", overlay: true }
+  ]
+};
+function asLook(v) {
+  return v && typeof v === "object" ? v : {};
+}
+function templateFromCardStyle(look) {
+  const elements = [{ type: "image", aspect: "1/1", radius: 10 }];
+  if (look.badge) elements.push({ type: "badge", text: look.badge, color: look.badge_color });
+  if (!look.hide_price) elements.push({ type: "price", variant: "pill", color: "#059669" });
+  elements.push({ type: "title", lines: 2 });
+  if (!look.hide_rating) elements.push({ type: "rating" });
+  if (!look.hide_cta) elements.push({ type: "cta", variant: "fill", text: look.cta_text });
+  return {
+    id: "legacy",
+    frame: {
+      bg: look.background,
+      border: look.border_color,
+      radius: look.radius,
+      accent: look.accent ?? null
+    },
+    elements
+  };
+}
+function resolveGlobalTemplate(ic) {
+  const t = ic.card_template;
+  if (t && typeof t === "object" && Array.isArray(t.elements)) {
+    return t;
+  }
+  const legacy = ic.card_style;
+  if (legacy && typeof legacy === "object") {
+    return templateFromCardStyle(asLook(legacy));
+  }
+  return DEFAULT_CARD_TEMPLATE;
+}
+function applyPerCardOverride(tpl, look) {
+  if (!look || Object.keys(look).length === 0) return tpl;
+  const frame = { ...tpl.frame || {} };
+  if (look.accent) frame.accent = look.accent;
+  if (look.radius !== void 0) frame.radius = look.radius;
+  let elements = (tpl.elements || []).slice();
+  const drop = (type) => elements = elements.filter((e) => e.type !== type);
+  if (look.hide_price) drop("price");
+  if (look.hide_cta) drop("cta");
+  if (look.hide_rating) drop("rating");
+  if (look.cta_text) elements = elements.map((e) => e.type === "cta" ? { ...e, text: look.cta_text } : e);
+  if (look.badge) {
+    const badgeEl = { type: "badge", text: look.badge, color: look.badge_color };
+    elements = elements.some((e) => e.type === "badge") ? elements.map((e) => e.type === "badge" ? badgeEl : e) : [elements[0], badgeEl, ...elements.slice(1)].filter(Boolean);
+  }
+  return { ...tpl, frame, elements };
+}
+function priceText(card) {
+  const meta = card.metadata || {};
+  const p = meta.price;
+  if (p !== void 0 && p !== null) return String(p);
+  if (card.body && /\d/.test(card.body)) return card.body;
+  return void 0;
+}
+function paintPrice(card, el, accent, ctx) {
+  const price = priceText(card);
+  if (price === void 0) return null;
+  const meta = card.metadata || {};
+  const compareAt = meta.compare_at_price ?? meta.compare_at ?? meta.original_price;
+  const row = document.createElement("div");
+  row.style.cssText = "display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;";
+  const p = document.createElement("span");
+  p.textContent = price;
+  if (el.variant === "plain") {
+    p.style.cssText = `color:${accent};font-weight:700;font-size:13px;`;
+  } else {
+    const pillBg = el.color ? ctx.sanitizeColor(el.color) : "#059669";
+    p.style.cssText = `background:${pillBg};color:#fff;font-weight:800;font-size:12px;padding:2px 7px;border-radius:6px;`;
+  }
+  row.appendChild(p);
+  const pNum = parseFloat(price.replace(/[^0-9.]/g, ""));
+  const cNum = compareAt !== void 0 ? parseFloat(String(compareAt).replace(/[^0-9.]/g, "")) : NaN;
+  if (isFinite(cNum) && isFinite(pNum) && cNum > pNum) {
+    const orig = document.createElement("span");
+    orig.textContent = String(compareAt);
+    orig.style.cssText = "text-decoration:line-through;opacity:0.5;font-size:11px;";
+    row.appendChild(orig);
+    const off = document.createElement("span");
+    off.textContent = `-${Math.round((1 - pNum / cNum) * 100)}%`;
+    off.style.cssText = "background:#ef444422;color:#ef4444;font-weight:700;font-size:10px;padding:1px 5px;border-radius:999px;";
+    row.appendChild(off);
+  }
+  return row;
+}
+function paintRating(card) {
+  const meta = card.metadata || {};
+  const avg = Number(meta.avg_rating ?? 0);
+  if (!(avg > 0)) return null;
+  const count = Number(meta.review_count ?? 0);
+  const rr = document.createElement("div");
+  rr.style.cssText = "display:flex;align-items:center;gap:3px;font-size:11px;line-height:1;";
+  const star = document.createElement("span");
+  star.textContent = "★";
+  star.style.cssText = "color:#059669;";
+  const val = document.createElement("span");
+  val.textContent = avg.toFixed(1);
+  val.style.cssText = "color:#059669;font-weight:700;";
+  rr.appendChild(star);
+  rr.appendChild(val);
+  if (count > 0) {
+    const c = document.createElement("span");
+    c.textContent = `(${count})`;
+    c.style.cssText = "color:#94a3b8;";
+    rr.appendChild(c);
+  }
+  return rr;
+}
+function contrastFg(bg) {
+  const raw = bg.replace("#", "");
+  if (raw.length < 3) return "#1f2937";
+  const h = raw.length === 3 ? raw.split("").map((c) => c + c).join("") : raw.slice(0, 6);
+  const r = parseInt(h.slice(0, 2), 16);
+  const g = parseInt(h.slice(2, 4), 16);
+  const b = parseInt(h.slice(4, 6), 16);
+  if ([r, g, b].some((n) => Number.isNaN(n))) return "#1f2937";
+  const lum = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+  return lum < 0.5 ? "#ffffff" : "#1f2937";
+}
+function buildProgressElement(el, ctx, accent, muted) {
+  const { trackEvent, campaign, sanitizeColor } = ctx;
+  const goal = el.goal_type || "cart_total";
+  const moneyGoal = goal === "cart_total";
+  const fill = el.fill ? sanitizeColor(el.fill) : accent;
+  const props = () => ctx.properties && ctx.properties() || {};
+  const sym = () => {
+    var _a;
+    if (el.currency_symbol) return el.currency_symbol;
+    const code = ctx.getCartState && ((_a = ctx.getCartState()) == null ? void 0 : _a.currency);
+    const M = { INR: "₹", USD: "$", EUR: "€", GBP: "£" };
+    return code && M[code] || "";
+  };
+  const threshold = () => {
+    if (typeof el.threshold === "number" && el.threshold > 0) return el.threshold;
+    if (el.threshold_source === "free_delivery_setting") {
+      const v = Number(props()["cart.free_delivery_above"]);
+      if (v > 0) return v;
+    }
+    return 0;
+  };
+  const readCur = () => {
+    const cart = ctx.getCartState && ctx.getCartState();
+    if (goal === "items_in_cart") return Number(cart == null ? void 0 : cart.itemCount) || 0;
+    if (goal === "cart_total") return Number(cart == null ? void 0 : cart.total) || 0;
+    const p = props();
+    if (goal === "loyalty_points") return Number(p["loyalty.points"]) || 0;
+    if (goal === "referrals") return Number(p["referrals.count"]) || 0;
+    return 0;
+  };
+  const wrap = document.createElement("div");
+  wrap.style.cssText = "display:flex;flex-direction:column;gap:3px;min-width:0;width:100%;";
+  const sub = document.createElement("div");
+  sub.style.cssText = `font-size:11.5px;line-height:1.2;color:${muted};white-space:nowrap;overflow:hidden;text-overflow:ellipsis;`;
+  const shell = document.createElement("div");
+  shell.style.cssText = `height:3px;border-radius:999px;background:color-mix(in srgb, ${fill} 16%, transparent);overflow:hidden;`;
+  const bar = document.createElement("div");
+  bar.style.cssText = `height:100%;border-radius:999px;background:${fill};width:0%;transition:width .4s cubic-bezier(.4,0,.2,1);`;
+  shell.appendChild(bar);
+  wrap.appendChild(sub);
+  wrap.appendChild(shell);
+  let firedUnlock = false;
+  const update = () => {
+    const th = threshold();
+    const cur = readCur();
+    const pct = th > 0 ? Math.max(0, Math.min(100, cur / th * 100)) : 0;
+    bar.style.width = `${pct}%`;
+    if (th > 0 && pct >= 100) {
+      sub.textContent = el.reward_text || "Unlocked!";
+      sub.style.color = "#34d399";
+      if (!firedUnlock) {
+        firedUnlock = true;
+        trackEvent(campaign.id, "clicked", { stepId: el.id || "unlocked" });
+      }
+    } else {
+      sub.style.color = muted;
+      const remaining = Math.max(0, th - cur);
+      const pre = moneyGoal ? sym() : "";
+      const pctStr = el.show_pct && th > 0 ? ` · ${Math.round(pct)}%` : "";
+      sub.textContent = th > 0 ? `Shop for ${pre}${remaining.toFixed(0)} more${pctStr}` : el.reward_text || "";
+    }
+  };
+  update();
+  const timer = setInterval(update, 1e3);
+  if (typeof window !== "undefined") {
+    window.addEventListener("beforeunload", () => clearInterval(timer), { once: true });
+  }
+  return wrap;
+}
+function renderCardFromTemplate(card, opts) {
+  const { ctx, action, layout, layoutAccent } = opts;
+  const inline = action === "cart";
+  const { campaign, trackEvent, sanitizeUrl, sanitizeColor } = ctx;
+  const tpl = applyPerCardOverride(opts.template, asLook(card.style));
+  const frame = tpl.frame || {};
+  const meta = card.metadata || {};
+  const accent = typeof frame.accent === "string" && frame.accent ? sanitizeColor(frame.accent) : layoutAccent;
+  const brand = `var(--aegis-brand-accent, ${accent})`;
+  const fg = contrastFg(frame.bg ? sanitizeColor(frame.bg) : "#ffffff");
+  const muted = fg === "#ffffff" ? "rgba(255,255,255,0.72)" : "#6b7280";
+  const tile = document.createElement("div");
+  const radius = frame.radius !== void 0 ? `${parseInt(String(frame.radius), 10) || 12}px` : "12px";
+  const fLayout = frame.layout;
+  const dir = fLayout === "row" ? "row" : "column";
+  const tileGap = frame.gap != null ? frame.gap : 6;
+  const sizing = fLayout ? frame.width != null ? `width:${typeof frame.width === "number" ? `${frame.width}px` : frame.width};` : "flex:1 1 auto; width:100%;" : layout === "grid" ? "" : "flex:0 0 150px; scroll-snap-align:start;";
+  tile.style.cssText = `
+    box-sizing:border-box; display:flex; flex-direction:${dir}; ${fLayout === "row" ? "align-items:center;" : ""} gap:${tileGap}px; position:relative;
+    color:${fg};
+    background:${frame.bg ? sanitizeColor(frame.bg) : "#ffffff"};
+    border:1px solid ${frame.border ? sanitizeColor(frame.border) : "transparent"};
+    border-radius:${radius}; padding:8px;
+    ${frame.max_width ? `max-width:${frame.max_width}px;` : ""}${frame.min_width ? `min-width:${frame.min_width}px;` : ""}
+    ${sizing}
+    cursor:${card.cta_url || inline ? "pointer" : "default"}; transition:transform 0.15s ease;
+  `;
+  const elements = tpl.elements && tpl.elements.length ? tpl.elements : DEFAULT_CARD_TEMPLATE.elements;
+  let imageWrap = null;
+  const paintInto = (container, els) => {
+    for (const el of els) {
+      switch (el.type) {
+        case "image": {
+          const wrap = document.createElement("div");
+          wrap.style.cssText = `position:relative;width:100%;aspect-ratio:${ASPECT$2[el.aspect || "1/1"] || "1 / 1"};border-radius:${el.radius ?? 10}px;overflow:hidden;background:#f7f8fa;`;
+          const safeVideo = card.video_url ? sanitizeUrl(card.video_url) : "";
+          if (safeVideo) {
+            const v = document.createElement("video");
+            v.src = safeVideo;
+            v.muted = true;
+            v.loop = true;
+            v.autoplay = true;
+            v.playsInline = true;
+            v.setAttribute("playsinline", "");
+            v.style.cssText = "width:100%;height:100%;object-fit:cover;display:block;";
+            wrap.appendChild(v);
+          } else if (card.image_url) {
+            const safe = sanitizeUrl(card.image_url);
+            if (safe) {
+              const img = document.createElement("img");
+              img.src = safe;
+              img.alt = "";
+              img.loading = "lazy";
+              img.style.cssText = "width:100%;height:100%;object-fit:cover;display:block;";
+              wrap.appendChild(img);
+            }
+          }
+          imageWrap = wrap;
+          container.appendChild(wrap);
+          break;
+        }
+        case "badge": {
+          const text = el.text;
+          if (!text) break;
+          const badge = document.createElement("span");
+          badge.textContent = text;
+          const bg = el.color ? sanitizeColor(el.color) : brand;
+          badge.style.cssText = `position:absolute;top:6px;left:6px;z-index:1;background:${bg};color:#fff;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:0.03em;padding:3px 6px;border-radius:5px;`;
+          (imageWrap || container).appendChild(badge);
+          break;
+        }
+        case "price": {
+          const node = paintPrice(card, el, accent, ctx);
+          if (node) container.appendChild(node);
+          break;
+        }
+        case "title": {
+          if (!card.title) break;
+          const t = document.createElement("div");
+          t.textContent = card.title;
+          const lines = el.lines && el.lines > 0 ? el.lines : 2;
+          t.style.cssText = `font-size:12.5px;font-weight:600;line-height:1.3;text-align:${el.align ?? "left"};color:${el.color ? sanitizeColor(el.color) : fg};display:-webkit-box;-webkit-line-clamp:${lines};-webkit-box-orient:vertical;overflow:hidden;`;
+          container.appendChild(t);
+          break;
+        }
+        case "subtitle": {
+          if (!card.body) break;
+          const s = document.createElement("div");
+          s.textContent = card.body;
+          const lines = el.lines && el.lines > 0 ? el.lines : 2;
+          s.style.cssText = `font-size:11px;color:${el.color ? sanitizeColor(el.color) : muted};line-height:1.3;text-align:${el.align ?? "left"};display:-webkit-box;-webkit-line-clamp:${lines};-webkit-box-orient:vertical;overflow:hidden;`;
+          container.appendChild(s);
+          break;
+        }
+        case "rating": {
+          const node = paintRating(card);
+          if (node) container.appendChild(node);
+          break;
+        }
+        case "category": {
+          const cat = meta.category;
+          if (typeof cat !== "string" || !cat) break;
+          const chip = document.createElement("span");
+          chip.textContent = cat;
+          chip.style.cssText = "align-self:flex-start;background:#f3f4f6;color:#6b7280;font-size:10px;font-weight:500;padding:2px 7px;border-radius:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;";
+          container.appendChild(chip);
+          break;
+        }
+        // ── rich-card-editor elements (P0) ──────────────────────────────────
+        case "icon": {
+          const px = ICON_PX[el.size || "md"] || 30;
+          const node = document.createElement("div");
+          const iconColor = el.color ? sanitizeColor(el.color) : fg;
+          if (el.bubble) {
+            const bubbleTint = el.color ? sanitizeColor(el.color) : brand;
+            node.style.cssText = `flex:0 0 auto;width:${px}px;height:${px}px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb, ${bubbleTint} 16%, transparent);`;
+          } else {
+            node.style.cssText = "flex:0 0 auto;display:flex;align-items:center;";
+          }
+          const svg = lucideSvgEl(el.icon_name || "circle-check", {
+            size: el.bubble ? Math.round(px * 0.55) : Math.round(px * 0.7),
+            color: iconColor,
+            strokeWidth: 2
+          });
+          if (svg) node.appendChild(svg);
+          container.appendChild(node);
+          break;
+        }
+        case "text": {
+          const t = document.createElement("div");
+          const fs = TEXT_PX[el.size || "md"] || 13;
+          t.style.cssText = `font-size:${fs}px;font-weight:${WEIGHT[el.weight ?? "medium"]};text-align:${el.align ?? "left"};color:${el.color ? sanitizeColor(el.color) : fg};line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;`;
+          t.textContent = interpolateTokens(el.content ?? "", ctx);
+          container.appendChild(t);
+          break;
+        }
+        case "spacer": {
+          const sp = document.createElement("div");
+          sp.style.height = `${el.height ?? 8}px`;
+          container.appendChild(sp);
+          break;
+        }
+        case "progress": {
+          container.appendChild(buildProgressElement(el, ctx, brand, muted));
+          break;
+        }
+        case "group": {
+          const g = document.createElement("div");
+          const gdir = el.layout === "row" ? "row" : "column";
+          g.style.cssText = `display:flex;flex-direction:${gdir};${el.layout === "row" ? "align-items:center;" : ""}gap:${el.gap ?? 4}px;min-width:0;${el.layout === "row" ? "" : "flex:1 1 auto;"}`;
+          paintInto(g, el.elements || []);
+          container.appendChild(g);
+          break;
+        }
+        case "cta": {
+          const label = el.text || card.cta_text || (inline ? "Add" : "Shop");
+          const cta = document.createElement("button");
+          cta.className = "aegis-cta";
+          cta.textContent = label;
+          const overlayOnImage = !!el.overlay && !!imageWrap;
+          if (overlayOnImage) {
+            cta.style.cssText = el.variant === "outline" ? `position:absolute;right:6px;bottom:6px;background:#fff;color:${brand};border:1px solid ${brand};border-radius:9px;padding:5px 18px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.14);` : `position:absolute;right:6px;bottom:6px;background:${brand};color:#fff;border:none;border-radius:9px;padding:5px 18px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.14);`;
+          } else {
+            cta.style.cssText = el.variant === "outline" ? `margin-top:${fLayout === "row" ? "0" : "auto"};background:transparent;color:${brand};border:1px solid ${brand};border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;` : `margin-top:${fLayout === "row" ? "0" : "auto"};background:${brand};color:#fff;border:none;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;`;
+          }
+          cta.addEventListener("click", (e) => {
+            e.stopPropagation();
+            trackEvent(campaign.id, "clicked", { stepId: el.id || "add" });
+            if (inline) {
+              if (typeof window !== "undefined") {
+                window.dispatchEvent(
+                  new CustomEvent("aegis:add-to-cart", {
+                    detail: {
+                      campaign_id: campaign.id,
+                      product_id: meta.product_id,
+                      sku: meta.sku,
+                      title: card.title,
+                      price: meta.price ?? card.body,
+                      image_url: card.image_url,
+                      cta_url: card.cta_url
+                    }
+                  })
+                );
+              }
+              return;
+            }
+            if (card.cta_url) {
+              const safe = sanitizeUrl(card.cta_url);
+              if (safe) ctx.navigate ? ctx.navigate(safe) : window.location.href = safe;
+            }
+          });
+          (overlayOnImage ? imageWrap : container).appendChild(cta);
+          break;
+        }
+      }
+    }
+  };
+  paintInto(tile, elements);
+  const open = (e) => {
+    e.stopPropagation();
+    trackEvent(campaign.id, "clicked");
+    if (inline) {
+      if (typeof window !== "undefined") {
+        window.dispatchEvent(
+          new CustomEvent("aegis:open-product", {
+            detail: {
+              campaign_id: campaign.id,
+              product_id: meta.product_id,
+              sku: meta.sku,
+              cta_url: card.cta_url
+            }
+          })
+        );
+      }
+      return;
+    }
+    if (card.cta_url) {
+      const safe = sanitizeUrl(card.cta_url);
+      if (safe) ctx.navigate ? ctx.navigate(safe) : window.location.href = safe;
+    }
+  };
+  if (inline || card.cta_url) tile.addEventListener("click", open);
+  return tile;
+}
 const MAX_CARDS_RENDERED = 10;
 function renderCarouselCards(ctx) {
-  const { campaign, trackEvent, sanitizeUrl, sanitizeColor, log, addAnimationStyles } = ctx;
+  const { campaign, trackEvent, sanitizeColor, log, addAnimationStyles } = ctx;
   const ic = campaign.interactive_config || {};
   const rawCards = Array.isArray(ic.cards) ? ic.cards : [];
   const cards = rawCards.slice(0, MAX_CARDS_RENDERED);
@@ -70,7 +761,7 @@ function renderCarouselCards(ctx) {
   headerText.appendChild(body);
   header.appendChild(headerText);
   const closeBtn = document.createElement("button");
-  closeBtn.textContent = "✕";
+  closeBtn.innerHTML = lucideSvg("x", { size: 16 });
   closeBtn.setAttribute("aria-label", "Close");
   closeBtn.style.cssText = `
     background: transparent; border: none; color: inherit;
@@ -89,68 +780,16 @@ function renderCarouselCards(ctx) {
     padding-bottom: 4px; -webkit-overflow-scrolling: touch;
   `;
   track.style.msOverflowStyle = "none";
+  const template = resolveGlobalTemplate(ic);
   cards.forEach((c, i) => {
-    const tile = document.createElement("div");
+    const tile = renderCardFromTemplate(c, {
+      template,
+      ctx,
+      action: "navigate",
+      layout: "row",
+      layoutAccent: accent
+    });
     tile.setAttribute("data-card-index", String(i));
-    tile.style.cssText = `
-      flex: 0 0 auto; width: 140px; scroll-snap-align: start;
-      background: ${fg}0a; border-radius: 12px; padding: 10px;
-      display: flex; flex-direction: column; gap: 6px;
-      cursor: ${c.cta_url ? "pointer" : "default"};
-    `;
-    const safeVideo = c.video_url ? sanitizeUrl(c.video_url) : "";
-    if (safeVideo) {
-      const vid = document.createElement("video");
-      vid.src = safeVideo;
-      vid.muted = true;
-      vid.loop = true;
-      vid.autoplay = true;
-      vid.playsInline = true;
-      vid.setAttribute("playsinline", "");
-      vid.style.cssText = "width: 100%; height: 96px; border-radius: 8px; object-fit: cover;";
-      tile.appendChild(vid);
-    } else if (c.image_url) {
-      const img = document.createElement("img");
-      const safe = sanitizeUrl(c.image_url);
-      if (safe) {
-        img.src = safe;
-        img.alt = "";
-        img.loading = "lazy";
-        img.style.cssText = "width: 100%; height: 96px; border-radius: 8px; object-fit: cover;";
-        tile.appendChild(img);
-      }
-    }
-    if (c.title) {
-      const t = document.createElement("div");
-      t.textContent = c.title;
-      t.style.cssText = "font-weight: 600; font-size: 13px; line-height: 1.3;";
-      tile.appendChild(t);
-    }
-    if (c.body) {
-      const b = document.createElement("div");
-      b.textContent = c.body;
-      b.style.cssText = "font-size: 11.5px; opacity: 0.72; line-height: 1.3;";
-      tile.appendChild(b);
-    }
-    if (c.cta_text && c.cta_url) {
-      const cta = document.createElement("button");
-      cta.className = "aegis-cta";
-      cta.textContent = c.cta_text;
-      cta.style.cssText = `
-        margin-top: auto; background: ${accent}; color: #fff;
-        border: none; padding: 6px 10px; border-radius: 999px;
-        font-size: 12px; font-weight: 600; cursor: pointer;
-      `;
-      const goto2 = (e) => {
-        e.stopPropagation();
-        trackEvent(campaign.id, "clicked", { stepId: `card_${i}` });
-        const safe = sanitizeUrl(c.cta_url);
-        if (safe) window.location.href = safe;
-      };
-      cta.addEventListener("click", goto2);
-      tile.appendChild(cta);
-      tile.addEventListener("click", goto2);
-    }
     track.appendChild(tile);
   });
   card.appendChild(track);
@@ -314,7 +953,7 @@ function renderStickyBar(ctx) {
   };
   if (dismissible) {
     const close = document.createElement("button");
-    close.textContent = "✕";
+    close.innerHTML = lucideSvg("x", { size: 16 });
     close.setAttribute("aria-label", "Dismiss");
     close.style.cssText = `
       background: transparent; border: none; color: inherit;
@@ -344,13 +983,12 @@ function buildProgressBar(ctx, inline) {
   const source = ic.progress_source === "sse" ? "sse" : "client";
   addAnimationStyles();
   const brand = sanitizeColor(campaign.background_color || "#4169e1");
+  const accentVar = `var(--aegis-brand-accent, ${brand})`;
   const branded = ic.surface_style === "branded";
-  const bg = branded ? brand : "#ffffff";
+  const bg = branded ? accentVar : "#ffffff";
   const fg = sanitizeColor(campaign.text_color || (branded ? "#ffffff" : "#0f172a"));
-  const fill = sanitizeColor(
-    ic.progress_fill_color || (branded ? "#ffffff" : brand)
-  );
-  const track = branded ? "rgba(255,255,255,0.25)" : `${fill}22`;
+  const fill = ic.progress_fill_color ? sanitizeColor(ic.progress_fill_color) : branded ? "#ffffff" : accentVar;
+  const track = branded ? "rgba(255,255,255,0.25)" : `color-mix(in srgb, ${fill} 14%, transparent)`;
   const bar = document.createElement("div");
   bar.className = "aegis-in-app-progress-bar";
   bar.setAttribute("data-campaign-id", campaign.id);
@@ -730,7 +1368,7 @@ function renderCoachmarkTour(ctx) {
 }
 const MAX_PRODUCTS = 24;
 function renderProductRecommendation(ctx) {
-  const { campaign, trackEvent, sanitizeUrl, sanitizeColor, log, addAnimationStyles } = ctx;
+  const { campaign, trackEvent, sanitizeColor, log, addAnimationStyles } = ctx;
   const ic = campaign.interactive_config || {};
   const rawCards = Array.isArray(ic.cards) ? ic.cards : [];
   const cards = rawCards.slice(0, MAX_PRODUCTS);
@@ -739,7 +1377,7 @@ function renderProductRecommendation(ctx) {
     return;
   }
   const layout = ic.rec_layout || "grid";
-  const ctaDefault = ic.rec_cta_text || "Shop now";
+  const template = resolveGlobalTemplate(ic);
   addAnimationStyles();
   const bg = "#ffffff";
   const fg = "#0f172a";
@@ -782,7 +1420,7 @@ function renderProductRecommendation(ctx) {
   headerText.appendChild(body);
   header.appendChild(headerText);
   const close = document.createElement("button");
-  close.textContent = "✕";
+  close.innerHTML = lucideSvg("x", { size: 18 });
   close.setAttribute("aria-label", "Close");
   close.style.cssText = `
     background: transparent; border: none; color: inherit;
@@ -807,82 +1445,9 @@ function renderProductRecommendation(ctx) {
     `;
   }
   cards.forEach((c) => {
-    const tile = document.createElement("div");
-    const isRow = layout === "row";
-    tile.style.cssText = `
-      background: ${fg}08; border-radius: 12px;
-      padding: 10px; display: flex; flex-direction: column; gap: 6px;
-      cursor: ${c.cta_url ? "pointer" : "default"};
-      ${isRow ? "flex: 0 0 150px; scroll-snap-align: start;" : ""}
-      transition: transform 0.15s ease;
-    `;
-    if (c.image_url) {
-      const img = document.createElement("img");
-      const safe = sanitizeUrl(c.image_url);
-      if (safe) {
-        img.src = safe;
-        img.alt = "";
-        img.loading = "lazy";
-        img.style.cssText = "width: 100%; aspect-ratio: 1 / 1; border-radius: 8px; object-fit: cover;";
-        tile.appendChild(img);
-      }
-    }
-    if (c.title) {
-      const t = document.createElement("div");
-      t.textContent = c.title;
-      t.style.cssText = "font-weight: 600; font-size: 13px; line-height: 1.3;";
-      tile.appendChild(t);
-    }
-    const meta = c.metadata && typeof c.metadata === "object" ? c.metadata : {};
-    const price = meta.price;
-    const compareAt = meta.compare_at_price ?? meta.compare_at ?? meta.original_price;
-    if (price !== void 0) {
-      const priceRow = document.createElement("div");
-      priceRow.style.cssText = "display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap;";
-      const p = document.createElement("span");
-      p.textContent = String(price);
-      p.style.cssText = `color: ${accent}; font-weight: 700; font-size: 13px;`;
-      priceRow.appendChild(p);
-      const pNum = parseFloat(String(price).replace(/[^0-9.]/g, ""));
-      const cNum = compareAt !== void 0 ? parseFloat(String(compareAt).replace(/[^0-9.]/g, "")) : NaN;
-      if (isFinite(cNum) && isFinite(pNum) && cNum > pNum) {
-        const orig = document.createElement("span");
-        orig.textContent = String(compareAt);
-        orig.style.cssText = "text-decoration: line-through; opacity: 0.5; font-size: 11px;";
-        priceRow.appendChild(orig);
-        const off = document.createElement("span");
-        off.textContent = `-${Math.round((1 - pNum / cNum) * 100)}%`;
-        off.style.cssText = "background: #ef444422; color: #ef4444; font-weight: 700; font-size: 10px; padding: 1px 5px; border-radius: 999px;";
-        priceRow.appendChild(off);
-      }
-      tile.appendChild(priceRow);
-    } else if (c.body) {
-      const b = document.createElement("div");
-      b.textContent = c.body;
-      b.style.cssText = "font-size: 11.5px; opacity: 0.72; line-height: 1.3;";
-      tile.appendChild(b);
-    }
-    const cta = document.createElement("button");
-    cta.className = "aegis-cta";
-    cta.textContent = c.cta_text || ctaDefault;
-    cta.style.cssText = `
-      margin-top: auto;
-      background: ${accent}; color: #fff;
-      border: none; padding: 7px 10px; border-radius: 999px;
-      font-size: 12px; font-weight: 600; cursor: pointer;
-    `;
-    const go = (e) => {
-      e.stopPropagation();
-      trackEvent(campaign.id, "clicked");
-      if (c.cta_url) {
-        const safe = sanitizeUrl(c.cta_url);
-        if (safe) window.location.href = safe;
-      }
-    };
-    cta.addEventListener("click", go);
-    tile.appendChild(cta);
-    if (c.cta_url) tile.addEventListener("click", go);
-    grid.appendChild(tile);
+    grid.appendChild(
+      renderCardFromTemplate(c, { template, ctx, action: "navigate", layout, layoutAccent: accent })
+    );
   });
   sheet.appendChild(grid);
   overlay.appendChild(sheet);
@@ -894,6 +1459,88 @@ function renderProductRecommendation(ctx) {
   });
   document.body.appendChild(overlay);
 }
+function renderProductRecommendationInline(ctx, target) {
+  const { campaign, sanitizeColor, addAnimationStyles, log } = ctx;
+  const ic = campaign.interactive_config || {};
+  const rawCards = Array.isArray(ic.cards) ? ic.cards : [];
+  const cards = rawCards.slice(0, MAX_PRODUCTS);
+  if (cards.length === 0) {
+    log("product_recommendation (inline) rendered with zero products — skipping", "warn");
+    return false;
+  }
+  const layout = ic.rec_layout || "row";
+  const template = resolveGlobalTemplate(ic);
+  const fg = "#0f172a";
+  const accent = sanitizeColor(campaign.background_color || "#4169e1");
+  addAnimationStyles();
+  const section = document.createElement("section");
+  section.className = "aegis-in-app-product-rec-inline";
+  section.setAttribute("data-campaign-id", campaign.id);
+  section.style.cssText = `
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+    color: ${fg};
+  `;
+  if (campaign.title) {
+    const title = document.createElement("h2");
+    title.textContent = campaign.title;
+    title.style.cssText = "font-weight: 700; font-size: 16px; margin: 0 0 2px;";
+    section.appendChild(title);
+  }
+  if (campaign.body) {
+    const body = document.createElement("div");
+    body.textContent = campaign.body;
+    body.style.cssText = "font-size: 13px; opacity: 0.65; line-height: 1.4; margin-bottom: 10px;";
+    section.appendChild(body);
+  }
+  const grid = document.createElement("div");
+  const isRow = layout !== "grid";
+  if (layout === "grid") {
+    grid.style.cssText = "display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;";
+  } else {
+    grid.style.cssText = `
+      display: flex; gap: 10px; overflow-x: auto;
+      scroll-snap-type: x proximity; padding: 0 0 6px;
+      -webkit-overflow-scrolling: touch; scrollbar-width: none;
+    `;
+    grid.style.msOverflowStyle = "none";
+  }
+  cards.forEach((c) => {
+    grid.appendChild(
+      renderCardFromTemplate(c, { template, ctx, action: "cart", layout, layoutAccent: accent })
+    );
+  });
+  if (isRow && cards.length > 2) {
+    const wrap = document.createElement("div");
+    wrap.style.cssText = "position: relative;";
+    wrap.appendChild(grid);
+    const arrow = document.createElement("button");
+    arrow.setAttribute("aria-label", "Scroll for more");
+    arrow.innerHTML = "›";
+    arrow.style.cssText = `
+      position: absolute; top: 50%; right: 0; transform: translateY(-50%);
+      width: 30px; height: 30px; border-radius: 999px; border: 1px solid ${fg}1a;
+      background: #fff; color: ${fg}; font-size: 18px; line-height: 1; cursor: pointer;
+      box-shadow: 0 2px 8px rgba(0,0,0,0.12); display: flex; align-items: center;
+      justify-content: center; z-index: 2;
+    `;
+    arrow.addEventListener("click", (e) => {
+      e.stopPropagation();
+      grid.scrollBy({ left: Math.round(grid.clientWidth * 0.8), behavior: "smooth" });
+    });
+    const syncArrow = () => {
+      const atEnd = grid.scrollLeft + grid.clientWidth >= grid.scrollWidth - 8;
+      arrow.style.display = atEnd ? "none" : "flex";
+    };
+    grid.addEventListener("scroll", syncArrow, { passive: true });
+    setTimeout(syncArrow, 0);
+    wrap.appendChild(arrow);
+    section.appendChild(wrap);
+  } else {
+    section.appendChild(grid);
+  }
+  target.appendChild(section);
+  return true;
+}
 const MAX_GROUPS = 12;
 const MAX_FRAMES = 20;
 const DEFAULT_DURATION_MS = 5e3;
@@ -997,7 +1644,7 @@ function renderLauncherBar(ctx, cfg, target) {
   if (floating) {
     const dismiss = document.createElement("button");
     dismiss.type = "button";
-    dismiss.textContent = "✕";
+    dismiss.innerHTML = lucideSvg("x", { size: 14 });
     dismiss.setAttribute("aria-label", "Dismiss stories");
     dismiss.style.cssText = `
       flex: 0 0 auto; align-self: center; margin-left: auto;
@@ -1141,7 +1788,7 @@ function openViewer(ctx, cfg, startGroupIndex, startFrameIndex = 0) {
   };
   const close = document.createElement("button");
   close.type = "button";
-  close.textContent = "✕";
+  close.innerHTML = lucideSvg("x", { size: 18 });
   close.setAttribute("aria-label", "Close");
   close.style.cssText = "position: absolute; top: 12px; right: 10px; z-index: 5; width: 34px; height: 34px; border: none; border-radius: 999px; background: rgba(0,0,0,0.32); color: #fff; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; line-height: 1;";
   stage.appendChild(close);
@@ -1418,7 +2065,7 @@ function openGameModal(ctx, className, maxWidth = 360) {
   };
   const close = document.createElement("button");
   close.type = "button";
-  close.textContent = "✕";
+  close.innerHTML = lucideSvg("x", { size: 15 });
   close.setAttribute("aria-label", "Close");
   close.style.cssText = `position:absolute;top:10px;right:10px;width:30px;height:30px;border:none;border-radius:999px;background:${branded ? "rgba(255,255,255,0.18)" : "rgba(0,0,0,0.05)"};color:${branded ? "#fff" : "#475569"};font-size:15px;cursor:pointer;z-index:1;`;
   close.addEventListener("click", () => dismiss(true));
@@ -2136,14 +2783,15 @@ function buildVideo(ctx, aspect, autoplay, loop) {
     });
     const pill = document.createElement("button");
     pill.type = "button";
-    pill.textContent = "🔇";
+    pill.innerHTML = lucideSvg("volume-x", { size: 14 });
     pill.setAttribute("aria-label", "Unmute");
     pill.style.cssText = "position:absolute;bottom:10px;right:10px;z-index:2;width:34px;height:34px;border:none;border-radius:999px;background:rgba(0,0,0,0.45);color:#fff;font-size:14px;cursor:pointer;";
     pill.addEventListener("click", (e) => {
       var _a2;
       e.stopPropagation();
       vid.muted = !vid.muted;
-      pill.textContent = vid.muted ? "🔇" : "🔊";
+      pill.innerHTML = lucideSvg(vid.muted ? "volume-x" : "volume-2", { size: 14 });
+      pill.setAttribute("aria-label", vid.muted ? "Unmute" : "Mute");
       if (!vid.muted) void ((_a2 = vid.play) == null ? void 0 : _a2.call(vid).catch(() => {
       }));
     });
@@ -2231,7 +2879,7 @@ function renderVideo(ctx) {
   }
   const close = document.createElement("button");
   close.type = "button";
-  close.textContent = "✕";
+  close.innerHTML = lucideSvg("x", { size: 15 });
   close.setAttribute("aria-label", "Close");
   close.style.cssText = "position:absolute;top:10px;left:10px;z-index:3;width:32px;height:32px;border:none;border-radius:999px;background:rgba(0,0,0,0.4);color:#fff;font-size:15px;cursor:pointer;";
   close.addEventListener("click", () => {
@@ -2276,8 +2924,15 @@ const HEX = /^#[0-9a-fA-F]{3,8}$/;
 function safeColor(c, fallback) {
   return c && HEX.test(c) ? c : fallback;
 }
-const RADIUS = { none: "0", lg: "12px", xl: "16px", "2xl": "20px" };
 const ASPECT = { "16:9": "16 / 9", "4:3": "4 / 3", "21:9": "21 / 9" };
+function _injectHeroResponsiveCss() {
+  if (typeof document === "undefined") return;
+  if (document.getElementById("aegis-hero-style")) return;
+  const style = document.createElement("style");
+  style.id = "aegis-hero-style";
+  style.textContent = ".aegis-hero-root{border-radius:16px;}@media (min-width:768px){.aegis-hero-root{border-radius:0;min-height:45vh;max-height:70vh;}}";
+  document.head.appendChild(style);
+}
 function cardHeadline(c) {
   return c.headline ?? c.title ?? "";
 }
@@ -2303,7 +2958,6 @@ function renderHeroInline(ctx, target) {
     chrome.accent && chrome.accent !== "brand" ? chrome.accent : campaign.background_color,
     "#4169e1"
   );
-  const radius = RADIUS[chrome.radius ?? "2xl"] ?? RADIUS["2xl"];
   const variant = chrome.variant ?? "hero_fullbleed";
   if (variant === "announcement_bar") {
     const c = cards[0];
@@ -2326,8 +2980,10 @@ function renderHeroInline(ctx, target) {
     trackEvent(campaign.id, "impression");
     return true;
   }
+  _injectHeroResponsiveCss();
   const root = document.createElement("div");
-  root.style.cssText = `position:relative;width:100%;overflow:hidden;border-radius:${radius};box-shadow:0 1px 2px rgba(16,24,40,0.06);${chrome.aspect_ratio && ASPECT[chrome.aspect_ratio] ? `aspect-ratio:${ASPECT[chrome.aspect_ratio]};` : "min-height:300px;"}`;
+  root.className = "aegis-hero-root";
+  root.style.cssText = `position:relative;width:100%;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,0.06);${chrome.aspect_ratio && ASPECT[chrome.aspect_ratio] ? `aspect-ratio:${ASPECT[chrome.aspect_ratio]};` : "min-height:300px;"}`;
   root.setAttribute("data-campaign-id", campaign.id);
   const track = document.createElement("div");
   track.style.cssText = "display:flex;height:100%;width:100%;transition:transform 0.5s ease;";
@@ -2750,7 +3406,7 @@ class AegisChat {
     const closeBtn = document.createElement("button");
     closeBtn.className = "aegis-chat-close";
     closeBtn.setAttribute("aria-label", "Close chat");
-    closeBtn.textContent = "✕";
+    closeBtn.innerHTML = lucideSvg("x", { size: 16 });
     closeBtn.addEventListener("click", () => this.closePanel());
     header.appendChild(titleEl);
     header.appendChild(closeBtn);
@@ -2806,7 +3462,7 @@ class AegisChat {
     const tipClose = document.createElement("button");
     tipClose.className = "aegis-chat-tip-close";
     tipClose.setAttribute("aria-label", "Dismiss");
-    tipClose.textContent = "✕";
+    tipClose.innerHTML = lucideSvg("x", { size: 14 });
     tipClose.addEventListener("click", (e) => {
       e.stopPropagation();
       this.dismissAttention();
@@ -3772,10 +4428,15 @@ const _AegisInAppManager = class _AegisInAppManager {
     this.ready = new Promise((resolve) => {
       this.readyResolve = resolve;
     });
+    this.pendingPreInitRefresh = false;
     this.currentSurface = null;
     this.currentScreen = null;
     this.currentLocationId = null;
     this.filledSlots = /* @__PURE__ */ new WeakSet();
+    this.slotSignatures = /* @__PURE__ */ new WeakMap();
+    this.slotTimers = /* @__PURE__ */ new WeakMap();
+    this.slotObserver = null;
+    this.slotRenderScheduled = false;
     this.writeKey = config.writeKey;
     this.apiHost = config.apiHost || "https://api.aegis.ai";
     this.userId = config.userId ?? readAnonIdFromStorage$1();
@@ -3887,6 +4548,11 @@ const _AegisInAppManager = class _AegisInAppManager {
       this.connectSSE();
     }
     this.isInitialized = true;
+    if (this.pendingPreInitRefresh) {
+      this.pendingPreInitRefresh = false;
+      this.log("Re-fetching campaigns for surface/screen declared during init");
+      void this.refreshCampaigns();
+    }
     this.log("AegisInApp initialized successfully");
   }
   updateUserId(userId) {
@@ -3935,16 +4601,17 @@ const _AegisInAppManager = class _AegisInAppManager {
    * change `currentSurface`, so arbitrary events never poison the surface gate.
    */
   refreshOnEvent(eventName, isScreenDeclaration = false) {
-    if (!this.isInitialized) {
-      this.log(`refreshOnEvent(${eventName}) before initialize — ignored`);
-      return;
-    }
     if (eventName && _AegisInAppManager.KNOWN_SURFACES.has(eventName)) {
       this.currentSurface = eventName;
     }
     if (isScreenDeclaration && eventName && eventName !== "page_view") {
       this.currentScreen = eventName;
     }
+    if (!this.isInitialized) {
+      this.pendingPreInitRefresh = true;
+      this.log(`refreshOnEvent(${eventName}) before initialize — surface captured, refetch deferred to initialize()`);
+      return;
+    }
     if (this.refreshDebounceTimer) {
       clearTimeout(this.refreshDebounceTimer);
     }
@@ -4162,7 +4829,7 @@ const _AegisInAppManager = class _AegisInAppManager {
     try {
       const context = new URLSearchParams({
         device_type: this.detectDeviceType(),
-        page_url: typeof window !== "undefined" ? window.location.pathname : "/"
+        page_url: typeof window !== "undefined" ? window.location.pathname + window.location.search : "/"
       });
       context.set("is_new_user", this.isNewUser() ? "true" : "false");
       if (this.currentSurface) {
@@ -4320,28 +4987,75 @@ const _AegisInAppManager = class _AegisInAppManager {
     if (!c.surface || c.surface.length === 0) return screenOk;
     return screenOk || this.matchesCurrentSurface(c);
   }
+  // Re-fill slots that mount after a poll (SPA route changes). Observes the DOM
+  // once; when a new [data-aegis-slot] appears it re-runs renderIntoSlots from
+  // the cached campaigns (idempotent — already-filled slots are skipped). Does
+  // NOT loop on the SDK's own injections (those add content INTO a slot, not a
+  // new slot element).
+  ensureSlotObserver() {
+    if (this.slotObserver || typeof MutationObserver === "undefined" || typeof document === "undefined") {
+      return;
+    }
+    this.slotObserver = new MutationObserver((mutations) => {
+      let sawSlot = false;
+      for (const m2 of mutations) {
+        m2.addedNodes.forEach((n) => {
+          var _a, _b;
+          if (sawSlot || n.nodeType !== 1) return;
+          const el = n;
+          if (((_a = el.matches) == null ? void 0 : _a.call(el, "[data-aegis-slot]")) || ((_b = el.querySelector) == null ? void 0 : _b.call(el, "[data-aegis-slot]"))) {
+            sawSlot = true;
+          }
+        });
+        if (sawSlot) break;
+      }
+      if (!sawSlot || this.slotRenderScheduled) return;
+      this.slotRenderScheduled = true;
+      const run = () => {
+        this.slotRenderScheduled = false;
+        this.renderIntoSlots();
+      };
+      if (typeof requestAnimationFrame === "function") requestAnimationFrame(run);
+      else setTimeout(run, 0);
+    });
+    this.slotObserver.observe(document.body, { childList: true, subtree: true });
+  }
   renderIntoSlots() {
     if (typeof document === "undefined") return;
+    this.ensureSlotObserver();
     const slots = document.querySelectorAll("[data-aegis-slot]");
     if (slots.length === 0) return;
     const eligibleByCategory = /* @__PURE__ */ new Map();
+    const seenIds = /* @__PURE__ */ new Set();
     for (const c of this.campaigns) {
       if (!this.matchesCurrentScreenOrSurface(c)) continue;
       const modes = c.delivery_modes;
       const category = c.widget_category;
       if (!modes || !modes.includes("embedded_card")) continue;
       if (!category) continue;
+      if (seenIds.has(c.id)) continue;
+      seenIds.add(c.id);
       const arr2 = eligibleByCategory.get(category);
       if (arr2) arr2.push(c);
       else eligibleByCategory.set(category, [c]);
     }
     if (eligibleByCategory.size === 0) return;
     slots.forEach((slot) => {
-      if (this.filledSlots.has(slot)) return;
       const key = slot.getAttribute("data-aegis-slot");
       if (!key) return;
       const list = eligibleByCategory.get(key);
       if (!list || list.length === 0) return;
+      const sig = list.map((c) => `${c.id}:${c.assigned_variant_id ?? ""}`).join(",");
+      if (this.filledSlots.has(slot) && this.slotSignatures.get(slot) === sig) return;
+      const oldTimer = this.slotTimers.get(slot);
+      if (oldTimer) {
+        clearInterval(oldTimer);
+        this.slotTimers.delete(slot);
+      }
+      slot.querySelectorAll(
+        ":scope > [data-aegis-rotate-pane], :scope > [data-aegis-slot-rendered], :scope > [data-aegis-rotate-dots]"
+      ).forEach((n) => n.remove());
+      this.slotSignatures.set(slot, sig);
       slot.querySelectorAll(":scope > [data-aegis-slot-default]").forEach((d) => d.remove());
       const attrMs = parseInt(slot.getAttribute("data-aegis-slot-rotate") || "0", 10);
       const declaredMs = list.reduce((m2, c) => {
@@ -4350,10 +5064,15 @@ const _AegisInAppManager = class _AegisInAppManager {
         return Number.isFinite(v) && v > m2 ? v : m2;
       }, 0);
       const rotateMs = attrMs > 0 ? attrMs : declaredMs;
+      const flush = slot.hasAttribute("data-aegis-slot-flush");
       if (rotateMs > 0 && list.length > 1) {
-        this.renderRotatingSlot(slot, list, rotateMs);
+        this.renderRotatingSlot(slot, list, rotateMs, flush);
       } else {
-        this.renderCampaignIntoSlot(list[0], slot);
+        const host = document.createElement("div");
+        host.setAttribute("data-aegis-slot-rendered", list[0].id);
+        slot.appendChild(host);
+        this.renderCampaignIntoSlot(list[0], host);
+        if (flush) this._flattenSlotCard(host);
       }
       this.filledSlots.add(slot);
     });
@@ -4366,7 +5085,7 @@ const _AegisInAppManager = class _AegisInAppManager {
    * is deferred at render and fired per campaign on FIRST visibility, so hidden
    * panes never over-count. One rendered pane → no rotation (just shows it).
    */
-  renderRotatingSlot(slot, campaigns, rotateMs) {
+  renderRotatingSlot(slot, campaigns, rotateMs, flush = false) {
     const panes = [];
     for (const c of campaigns) {
       const pane = document.createElement("div");
@@ -4374,8 +5093,10 @@ const _AegisInAppManager = class _AegisInAppManager {
       pane.style.display = "none";
       slot.appendChild(pane);
       this.renderCampaignIntoSlot(c, pane, { deferImpression: true });
-      if (pane.childElementCount > 0) panes.push({ el: pane, campaign: c });
-      else pane.remove();
+      if (pane.childElementCount > 0) {
+        if (flush) this._flattenSlotCard(pane);
+        panes.push({ el: pane, campaign: c });
+      } else pane.remove();
     }
     if (panes.length === 0) return;
     const impressed = /* @__PURE__ */ new Set();
@@ -4386,17 +5107,59 @@ const _AegisInAppManager = class _AegisInAppManager {
       this.emit("campaign-shown", c);
     };
     let idx = 0;
-    panes[0].el.style.display = "";
-    markVisible(panes[0].campaign);
-    if (panes.length === 1) return;
-    const timer = setInterval(() => {
+    const dots = [];
+    if (panes.length > 1) {
+      const bar = document.createElement("div");
+      bar.setAttribute("data-aegis-rotate-dots", "");
+      bar.setAttribute("role", "tablist");
+      bar.setAttribute("aria-label", "Offers");
+      bar.style.cssText = "display:flex;align-items:center;justify-content:center;gap:5px;padding:2px 0 8px;";
+      panes.forEach((_, i) => {
+        const dot = document.createElement("button");
+        dot.type = "button";
+        dot.setAttribute("role", "tab");
+        dot.setAttribute("aria-label", `Offer ${i + 1} of ${panes.length}`);
+        dot.style.cssText = "border:none;padding:0;cursor:pointer;height:6px;width:6px;border-radius:999px;background:rgba(15,23,42,0.2);transition:width .25s ease,background .25s ease;";
+        dot.addEventListener("click", (e) => {
+          e.stopPropagation();
+          show(i, true);
+        });
+        dots.push(dot);
+        bar.appendChild(dot);
+      });
+      slot.appendChild(bar);
+    }
+    const paintDots = () => {
+      dots.forEach((d, i) => {
+        const active = i === idx;
+        d.style.width = active ? "16px" : "6px";
+        d.style.background = active ? "var(--aegis-brand-accent, #4169e1)" : "rgba(15,23,42,0.2)";
+        d.setAttribute("aria-selected", active ? "true" : "false");
+      });
+    };
+    let timer = null;
+    const start = () => setInterval(() => {
+      show(idx + 1);
+    }, rotateMs);
+    function show(i, fromClick = false) {
       panes[idx].el.style.display = "none";
-      idx = (idx + 1) % panes.length;
+      idx = (i % panes.length + panes.length) % panes.length;
       panes[idx].el.style.display = "";
       markVisible(panes[idx].campaign);
-    }, rotateMs);
+      paintDots();
+      if (fromClick && timer) {
+        clearInterval(timer);
+        timer = start();
+      }
+    }
+    panes[0].el.style.display = "";
+    markVisible(panes[0].campaign);
+    paintDots();
+    if (panes.length === 1) return;
+    timer = start();
+    this.slotTimers.set(slot, timer);
     if (typeof window !== "undefined") {
-      window.addEventListener("beforeunload", () => clearInterval(timer), { once: true });
+      window.addEventListener("beforeunload", () => timer && clearInterval(timer), { once: true });
     }
   }
   /**
@@ -4450,6 +5213,14 @@ const _AegisInAppManager = class _AegisInAppManager {
           target.querySelectorAll(":scope > [data-aegis-slot-default]").forEach((d) => d.remove());
         }
       }
+      const spacing = Number(anchor == null ? void 0 : anchor.element_spacing);
+      if (spacing > 0) {
+        if (position === "before" || position === "after") {
+          target.style.margin = `${spacing}px`;
+        } else {
+          target.style.padding = `${spacing}px`;
+        }
+      }
       if (this.filledSlots.has(target)) continue;
       this.renderCampaignIntoSlot(c, target);
       this.filledSlots.add(target);
@@ -4555,7 +5326,12 @@ const _AegisInAppManager = class _AegisInAppManager {
       }
       return;
     }
-    if (campaign.widget_category === "hero") {
+    const _tpl = ic.card_template;
+    const _hasComposedTemplate = !!_tpl && typeof _tpl === "object" && Array.isArray(_tpl.elements);
+    const _isMultiCard = campaign.sub_type === "product_recommendation" || campaign.sub_type === "carousel_cards";
+    if (_hasComposedTemplate && !_isMultiCard) {
+      rendered = this.renderComposedCardSlot(campaign, ic, target);
+    } else if (campaign.widget_category === "hero") {
       rendered = renderHeroInline(this.buildRenderContext(campaign), target);
     } else
       switch (campaign.sub_type) {
@@ -4608,6 +5384,9 @@ const _AegisInAppManager = class _AegisInAppManager {
         case "progress_bar":
           rendered = renderProgressBarInline(this.buildRenderContext(campaign), target);
           break;
+        case "product_recommendation":
+          rendered = renderProductRecommendationInline(this.buildRenderContext(campaign), target);
+          break;
         case "quiz":
           rendered = this.renderQuizSlot(campaign, ic, bg, text, target);
           if (!rendered) {
@@ -4670,6 +5449,34 @@ const _AegisInAppManager = class _AegisInAppManager {
    *  The catch-all for banner + nudge sub_types (birthday, referral, app-install,
    *  win-back, etc.) so EVERY gallery nudge renders on the bill (previously only
    *  star_rating / nps_survey / form were handled → nudges never appeared). */
+  /**
+   * Composed single card — renders a campaign's top-level `card_template`
+   * (frame + elements: icon/text/progress/image/cta/group/…) through the generic
+   * `renderCardFromTemplate` engine. The canonical path for the rich card editor:
+   * the storefront value bar, loyalty nudges, and any operator-composed card all
+   * render here from declarative JSON, on ACS / custom / third-party sites.
+   */
+  renderComposedCardSlot(campaign, ic, target) {
+    const c = campaign;
+    const card = {
+      image_url: typeof c.image_url === "string" ? c.image_url : void 0,
+      title: campaign.title,
+      body: campaign.body,
+      cta_text: typeof c.button_text === "string" ? c.button_text : void 0,
+      cta_url: typeof c.action_url === "string" ? c.action_url : void 0,
+      metadata: ic.card_meta || {}
+    };
+    const template = resolveGlobalTemplate(ic);
+    const { accent } = this._surfacePalette(campaign);
+    const tile = renderCardFromTemplate(card, {
+      template,
+      ctx: this.buildRenderContext(campaign),
+      action: "navigate",
+      layoutAccent: this.sanitizeColor(campaign.background_color || accent)
+    });
+    target.appendChild(tile);
+    return true;
+  }
   renderGenericCardSlot(campaign, ic, bg, text, target) {
     const st = this._slotStyle(campaign);
     const card = this._wrapInSlotCard("aegis-in-app-generic-card", campaign.id, bg, text, st.radius);
@@ -4685,6 +5492,45 @@ const _AegisInAppManager = class _AegisInAppManager {
       im.style.cssText = "width: 100%; height: 96px; object-fit: cover; display: block;";
       card.appendChild(im);
     }
+    const widgetCat = typeof c.widget_category === "string" ? c.widget_category : "";
+    if (widgetCat === "promo" && !img) {
+      const row = document.createElement("div");
+      row.style.cssText = `display:flex; align-items:center; gap:12px; min-height:46px; padding:${st.padY ?? 10}px ${st.padX ?? 14}px;`;
+      const colL = document.createElement("div");
+      colL.style.cssText = "flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px;";
+      if (campaign.title) {
+        const t = document.createElement("div");
+        t.style.cssText = `font-size:13px; font-weight:${st.weight ?? "700"}; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;`;
+        t.textContent = campaign.title;
+        colL.appendChild(t);
+      }
+      if (campaign.body) {
+        const b = document.createElement("div");
+        b.style.cssText = "font-size:11.5px; opacity:0.7; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;";
+        b.textContent = campaign.body;
+        colL.appendChild(b);
+      }
+      row.appendChild(colL);
+      if (buttonText) {
+        const btn = document.createElement("button");
+        btn.type = "button";
+        btn.textContent = buttonText;
+        const accentTok = `var(--aegis-brand-accent, ${text})`;
+        btn.style.cssText = `flex:0 0 auto; align-self:center; cursor:pointer; white-space:nowrap;background:color-mix(in srgb, ${accentTok} 12%, #fff); color:${accentTok}; border:none;border-radius:999px; padding:7px 16px; font-size:12.5px; font-weight:700;`;
+        btn.addEventListener("click", () => {
+          void this.trackEvent(campaign.id, "clicked");
+          if (actionUrl) {
+            window.open(actionUrl, "_blank", "noopener");
+          } else if (typeof window !== "undefined") {
+            window.dispatchEvent(new CustomEvent("aegis:open-login", { detail: { campaign_id: campaign.id } }));
+          }
+        });
+        row.appendChild(btn);
+      }
+      card.appendChild(row);
+      target.appendChild(card);
+      return true;
+    }
     const cbody = document.createElement("div");
     cbody.style.cssText = `padding: ${st.padY ?? 12}px ${st.padX ?? 12}px; display: flex; flex-direction: column; gap: 6px;`;
     if (campaign.title) {
@@ -4828,8 +5674,14 @@ const _AegisInAppManager = class _AegisInAppManager {
       body.style.alignItems = "center";
       body.style.justifyContent = "center";
       const done = document.createElement("div");
-      done.style.cssText = "padding: 8px 0; font-size: 13px; font-weight: 600; text-align: center;";
-      done.textContent = typeof ((_a = campaign.interactive_config) == null ? void 0 : _a.thank_you_message) === "string" ? campaign.interactive_config.thank_you_message : "✓ Thanks — your details are saved.";
+      done.style.cssText = "padding: 8px 0; font-size: 13px; font-weight: 600; text-align: center; display: inline-flex; align-items: center; justify-content: center; gap: 6px;";
+      const customThanks = typeof ((_a = campaign.interactive_config) == null ? void 0 : _a.thank_you_message) === "string" ? campaign.interactive_config.thank_you_message : null;
+      if (customThanks) {
+        done.textContent = customThanks;
+      } else {
+        done.innerHTML = lucideSvg("check", { size: 14 });
+        done.appendChild(document.createTextNode("Thanks — your details are saved."));
+      }
       body.appendChild(done);
       this._playReaction(body, "affirm", "check.json", campaign.interactive_config);
     });
@@ -5169,11 +6021,11 @@ const _AegisInAppManager = class _AegisInAppManager {
       const soundBtn = document.createElement("button");
       soundBtn.type = "button";
       soundBtn.setAttribute("aria-label", "Toggle sound");
-      soundBtn.textContent = soundOn ? "🔊" : "🔇";
+      soundBtn.innerHTML = lucideSvg(soundOn ? "volume-2" : "volume-x", { size: 15 });
       soundBtn.style.cssText = "position: absolute; top: 10px; left: 12px; background: transparent; border: none; font-size: 15px; cursor: pointer; opacity: 0.65; z-index: 6; line-height: 1;";
       soundBtn.addEventListener("click", () => {
         soundOn = !soundOn;
-        soundBtn.textContent = soundOn ? "🔊" : "🔇";
+        soundBtn.innerHTML = lucideSvg(soundOn ? "volume-2" : "volume-x", { size: 15 });
       });
       card.appendChild(soundBtn);
     }
@@ -5288,7 +6140,7 @@ const _AegisInAppManager = class _AegisInAppManager {
           var _a;
           try {
             void ((_a = navigator.clipboard) == null ? void 0 : _a.writeText(r.code));
-            chip.textContent = "Copied ✓";
+            chip.textContent = "Copied";
           } catch {
           }
         });
@@ -5334,7 +6186,7 @@ const _AegisInAppManager = class _AegisInAppManager {
           var _a;
           try {
             void ((_a = navigator.clipboard) == null ? void 0 : _a.writeText(r.code));
-            chip.textContent = "Copied ✓";
+            chip.textContent = "Copied";
           } catch {
           }
         });
@@ -5575,7 +6427,7 @@ const _AegisInAppManager = class _AegisInAppManager {
         pctLabel.textContent = `${pct}%`;
         pctLabel.style.opacity = "0.8";
       } else if (pctLabel && i === selected) {
-        pctLabel.textContent = "✓";
+        pctLabel.innerHTML = lucideSvg("check", { size: 14 });
         pctLabel.style.opacity = "0.8";
       }
     });
@@ -5598,59 +6450,18 @@ const _AegisInAppManager = class _AegisInAppManager {
     }
     const strip = document.createElement("div");
     strip.style.cssText = `display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; padding: ${st.padY ?? 12}px ${st.padX ?? 12}px;`;
+    const template = resolveGlobalTemplate(ic);
+    const ctx = this.buildRenderContext(campaign);
+    const accent = this.sanitizeColor(campaign.background_color || text);
     cards.forEach((c, i) => {
-      const tile = document.createElement("div");
-      const ctaUrl = typeof c.cta_url === "string" ? c.cta_url : "";
-      tile.style.cssText = `flex: 0 0 auto; width: 150px; scroll-snap-align: start; background: ${text}0a; border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; gap: 6px; cursor: ${ctaUrl ? "pointer" : "default"};`;
-      const videoUrl = typeof c.video_url === "string" ? c.video_url : "";
-      const imageUrl = typeof c.image_url === "string" ? c.image_url : "";
-      if (videoUrl) {
-        const v = document.createElement("video");
-        v.src = videoUrl;
-        v.muted = true;
-        v.loop = true;
-        v.autoplay = true;
-        v.playsInline = true;
-        v.setAttribute("playsinline", "");
-        v.style.cssText = "width: 100%; height: 90px; object-fit: cover; display: block;";
-        tile.appendChild(v);
-      } else if (imageUrl) {
-        const im = document.createElement("img");
-        im.src = imageUrl;
-        im.alt = "";
-        im.loading = "lazy";
-        im.style.cssText = "width: 100%; height: 90px; object-fit: cover; display: block;";
-        tile.appendChild(im);
-      }
-      const tb = document.createElement("div");
-      tb.style.cssText = "padding: 0 8px 8px; display: flex; flex-direction: column; gap: 4px;";
-      if (typeof c.title === "string" && c.title) {
-        const tt = document.createElement("div");
-        tt.style.cssText = "font-size: 12px; font-weight: 600; line-height: 1.3;";
-        tt.textContent = c.title;
-        tb.appendChild(tt);
-      }
-      if (typeof c.body === "string" && c.body) {
-        const tbd = document.createElement("div");
-        tbd.style.cssText = "font-size: 10.5px; opacity: 0.72; line-height: 1.3;";
-        tbd.textContent = c.body;
-        tb.appendChild(tbd);
-      }
-      const ctaText = typeof c.cta_text === "string" ? c.cta_text : "";
-      if (ctaText && ctaUrl) {
-        const cta = document.createElement("button");
-        cta.textContent = ctaText;
-        cta.style.cssText = `margin-top: auto; align-self: flex-start; background: ${text}; color: ${bg}; border: none; padding: 5px 10px; border-radius: ${st.btnRadius ?? 999}px; font-size: 11px; font-weight: 600; cursor: pointer;`;
-        const goto = (e) => {
-          e.stopPropagation();
-          void this.trackEvent(campaign.id, "clicked", { stepId: `card_${i}` });
-          window.open(ctaUrl, "_blank", "noopener");
-        };
-        cta.addEventListener("click", goto);
-        tile.addEventListener("click", goto);
-        tb.appendChild(cta);
-      }
-      tile.appendChild(tb);
+      const tile = renderCardFromTemplate(c, {
+        template,
+        ctx,
+        action: "navigate",
+        layout: "row",
+        layoutAccent: accent
+      });
+      tile.setAttribute("data-card-index", String(i));
       strip.appendChild(tile);
     });
     card.appendChild(strip);
@@ -5902,11 +6713,11 @@ const _AegisInAppManager = class _AegisInAppManager {
       const sb = document.createElement("button");
       sb.type = "button";
       sb.setAttribute("aria-label", "Toggle sound");
-      sb.textContent = soundOn ? "🔊" : "🔇";
+      sb.innerHTML = lucideSvg(soundOn ? "volume-2" : "volume-x", { size: 15 });
       sb.style.cssText = "position: absolute; top: 10px; left: 12px; background: transparent; border: none; font-size: 15px; cursor: pointer; opacity: 0.65; z-index: 6; line-height: 1;";
       sb.addEventListener("click", () => {
         soundOn = !soundOn;
-        sb.textContent = soundOn ? "🔊" : "🔇";
+        sb.innerHTML = lucideSvg(soundOn ? "volume-2" : "volume-x", { size: 15 });
       });
       card.appendChild(sb);
     }
@@ -6075,7 +6886,7 @@ const _AegisInAppManager = class _AegisInAppManager {
             var _a;
             try {
               void ((_a = navigator.clipboard) == null ? void 0 : _a.writeText(code));
-              chip.textContent = "Copied ✓";
+              chip.textContent = "Copied";
             } catch {
             }
           });
@@ -6263,6 +7074,19 @@ const _AegisInAppManager = class _AegisInAppManager {
     `;
     return card;
   }
+  /**
+   * Flush a rendered slot card into its host card — drop the per-campaign radius
+   * + shadow so it reads as one unit with the host wrapper (used for the
+   * storefront value bar via `data-aegis-slot-flush`). Targets every
+   * `[data-campaign-id]` card inside `container` (or the container itself).
+   */
+  _flattenSlotCard(container) {
+    const cards = container.matches("[data-campaign-id]") ? [container] : Array.from(container.querySelectorAll("[data-campaign-id]"));
+    for (const el of cards) {
+      el.style.borderRadius = "0";
+      el.style.boxShadow = "none";
+    }
+  }
   // Optional header/brand image atop a survey-style widget (star / nps).
   _appendHeaderImage(body, ic) {
     const url = ic.header_image_url;
@@ -6704,6 +7528,9 @@ const _AegisInAppManager = class _AegisInAppManager {
     }
   }
   displayCampaign(campaign) {
+    if (Array.isArray(campaign.delivery_modes) && campaign.delivery_modes.length > 0 && !campaign.delivery_modes.includes("in_app_overlay")) {
+      return;
+    }
     const proceed = this.emit("campaign-will-show", campaign);
     if (!proceed) {
       this.log(`campaign ${campaign.id} suppressed by campaign-will-show handler`);
@@ -6833,6 +7660,16 @@ const _AegisInAppManager = class _AegisInAppManager {
     return {
       campaign,
       getCartState: this.getCartState,
+      properties: () => {
+        var _a, _b;
+        const cart = (_a = this.getCartState) == null ? void 0 : _a.call(this);
+        const ctxObj = ((_b = campaign.interactive_config) == null ? void 0 : _b.card_context) || {};
+        return {
+          "cart.total": cart == null ? void 0 : cart.total,
+          "cart.count": cart == null ? void 0 : cart.itemCount,
+          ...ctxObj
+        };
+      },
       trackEvent: (id, evt, extra) => {
         void this.trackEvent(id, evt, extra);
       },
@@ -6943,7 +7780,7 @@ const _AegisInAppManager = class _AegisInAppManager {
       '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>'
     );
     if (closeIcon) x.appendChild(closeIcon);
-    else x.textContent = "✕";
+    else x.innerHTML = lucideSvg("x", { size: 14 });
     x.style.cssText = `
       position: absolute; top: 12px; right: 12px; z-index: 4; width: 28px; height: 28px;
       display: flex; align-items: center; justify-content: center; border: none;
@@ -7781,12 +8618,17 @@ const _AegisInAppManager = class _AegisInAppManager {
   _surfacePalette(campaign) {
     const ic = campaign.interactive_config || {};
     const brand = this.sanitizeColor(campaign.background_color || "#4169e1");
-    const branded = ic.surface_style === "branded";
-    if (branded) {
+    const surface = ic.surface_style;
+    if (surface === "branded") {
       const bg = brand;
       const text = campaign.text_color ? this.sanitizeColor(campaign.text_color) : "#ffffff";
       return { bg, text, btnBg: text, btnText: bg, accent: text, branded: true };
     }
+    if (surface === "dark") {
+      const bg = this.sanitizeColor(campaign.background_color || "#0f172a");
+      const text = campaign.text_color ? this.sanitizeColor(campaign.text_color) : "#ffffff";
+      return { bg, text, btnBg: "#ffffff", btnText: bg, accent: text, branded: false };
+    }
     return { bg: "#ffffff", text: "#0f172a", btnBg: brand, btnText: this._contrastText(brand), accent: brand, branded: false };
   }
   inAppStyle(campaign) {
@@ -7890,7 +8732,7 @@ const _AegisInAppManager = class _AegisInAppManager {
       actionsContainer.appendChild(ctaButton);
     }
     const closeButton = document.createElement("button");
-    closeButton.textContent = "✕";
+    closeButton.innerHTML = lucideSvg("x", { size: 18 });
     closeButton.setAttribute("aria-label", "Close");
     closeButton.style.cssText = `
       background: transparent;
@@ -8088,7 +8930,7 @@ const _AegisInAppManager = class _AegisInAppManager {
       pill.replaceChildren();
       const ic = document.createElement("span");
       ic.style.fontSize = "13px";
-      ic.textContent = v.muted ? "🔇" : "🔊";
+      ic.innerHTML = lucideSvg(v.muted ? "volume-x" : "volume-2", { size: 13 });
       pill.appendChild(ic);
       if (v.muted) {
         const t = document.createElement("span");
@@ -8218,7 +9060,7 @@ const _AegisInAppManager = class _AegisInAppManager {
     }
     overlay.appendChild(contentContainer);
     const closeButton = document.createElement("button");
-    closeButton.textContent = "✕";
+    closeButton.innerHTML = lucideSvg("x", { size: isBg ? 18 : 28 });
     closeButton.setAttribute("aria-label", "Close");
     closeButton.style.cssText = `
       position: absolute; top: 20px; right: 20px; z-index: 3; background: ${isBg ? "rgba(0,0,0,0.45)" : "transparent"};
@@ -8346,7 +9188,7 @@ const _AegisInAppManager = class _AegisInAppManager {
     }
     modal.appendChild(content);
     const closeButton = document.createElement("button");
-    closeButton.textContent = "✕";
+    closeButton.innerHTML = lucideSvg("x", { size: 22 });
     closeButton.setAttribute("aria-label", "Close");
     closeButton.style.cssText = `
       position: absolute;
@@ -8419,16 +9261,16 @@ const _AegisInAppManager = class _AegisInAppManager {
     const ic = campaign.interactive_config || {};
     const variant = ic.alert_variant || "";
     const VARIANTS = {
-      info: { glyph: "ℹ", color: "#3b82f6" },
-      success: { glyph: "✓", color: "#10b981" },
-      warning: { glyph: "!", color: "#f59e0b" },
-      error: { glyph: "✕", color: "#ef4444" }
+      info: { icon: "info", color: "#3b82f6" },
+      success: { icon: "check", color: "#10b981" },
+      warning: { icon: "triangle-alert", color: "#f59e0b" },
+      error: { icon: "x", color: "#ef4444" }
     };
     const vspec = VARIANTS[variant];
     if (vspec) {
       const badge = document.createElement("div");
       badge.style.cssText = `width: 48px; height: 48px; border-radius: 50%; margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 800; background: ${vspec.color}22; color: ${vspec.color};`;
-      badge.textContent = vspec.glyph;
+      badge.innerHTML = lucideSvg(vspec.icon, { size: 24 });
       content.appendChild(badge);
     }
     const title = document.createElement("h3");
@@ -8570,7 +9412,7 @@ const _AegisInAppManager = class _AegisInAppManager {
     if (!hasMedia) {
       const placeholder = document.createElement("div");
       placeholder.style.cssText = "width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #1f2937, #0f172a); color: rgba(255,255,255,0.35); font-size: 34px;";
-      placeholder.textContent = "▶";
+      placeholder.innerHTML = lucideSvg("play", { size: 34 });
       mediaWrap.appendChild(placeholder);
     }
     pip.appendChild(mediaWrap);
@@ -8581,7 +9423,7 @@ const _AegisInAppManager = class _AegisInAppManager {
       playGlyph.setAttribute("aria-label", "Play or pause");
       playGlyph.style.cssText = "position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 52px; height: 52px; border-radius: 50%; border: none; background: rgba(0,0,0,0.45); color: #fff; font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.25s ease; backdrop-filter: blur(2px);";
       const syncGlyph = () => {
-        playGlyph.textContent = v.paused ? "▶" : "❚❚";
+        playGlyph.innerHTML = lucideSvg(v.paused ? "play" : "pause", { size: 22 });
         playGlyph.style.opacity = v.paused ? "1" : "0";
       };
       const togglePlay = () => {
@@ -8608,7 +9450,7 @@ const _AegisInAppManager = class _AegisInAppManager {
         mutePill.replaceChildren();
         const ic2 = document.createElement("span");
         ic2.style.fontSize = "13px";
-        ic2.textContent = v.muted ? "🔇" : "🔊";
+        ic2.innerHTML = lucideSvg(v.muted ? "volume-x" : "volume-2", { size: 13 });
         mutePill.appendChild(ic2);
         if (v.muted) {
           const t = document.createElement("span");
@@ -8703,7 +9545,7 @@ const _AegisInAppManager = class _AegisInAppManager {
         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       `;
       if (expandBtn) {
-        expandBtn.textContent = "✕";
+        expandBtn.innerHTML = lucideSvg("x", { size: 16 });
         expandBtn.setAttribute("aria-label", "Minimize");
       }
       if (video && video.muted) {
@@ -8726,7 +9568,7 @@ const _AegisInAppManager = class _AegisInAppManager {
     }
     const closeButton = document.createElement("button");
     closeButton.type = "button";
-    closeButton.textContent = "✕";
+    closeButton.innerHTML = lucideSvg("x", { size: 16 });
     closeButton.setAttribute("aria-label", "Close");
     closeButton.style.cssText = ctrlBtnCss;
     closeButton.addEventListener("click", (e) => {
@@ -9746,13 +10588,29 @@ function evaluateRule(rule, snapshot, namespaces) {
   const result = evaluateExpr(rule.when, snapshot, namespaces);
   return result === true;
 }
-class IntentRuleEvaluator {
+const _IntentRuleEvaluator = class _IntentRuleEvaluator {
   constructor() {
     this.armed = [];
     this.snapshot = {};
     this.namespaces = {};
     this.firedThisSession = /* @__PURE__ */ new Set();
     this.silencedThisSession = /* @__PURE__ */ new Set();
+    this.oneInterruptionPerSession = false;
+    this.interruptiveBudgetSpent = false;
+    this.ttfiMs = 0;
+    this.sessionStartMs = Date.now();
+    this.nowFn = () => Date.now();
+  }
+  /** Tune governance. `now` also (re)bases the TTFI session clock. */
+  setGovernance(opts) {
+    if (opts.oneInterruptionPerSession !== void 0) {
+      this.oneInterruptionPerSession = opts.oneInterruptionPerSession;
+    }
+    if (opts.ttfiMs !== void 0) this.ttfiMs = opts.ttfiMs;
+    if (opts.now) {
+      this.nowFn = opts.now;
+      this.sessionStartMs = opts.now();
+    }
   }
   // ─── snapshot management ───
   updateSignal(signal, value) {
@@ -9788,12 +10646,15 @@ class IntentRuleEvaluator {
   }
   markFired(campaignId) {
     this.firedThisSession.add(campaignId);
+    this.interruptiveBudgetSpent = true;
   }
   /** Clear all per-session state. Caller invokes on logout or explicit
    *  session reset. */
   reset() {
     this.firedThisSession.clear();
     this.silencedThisSession.clear();
+    this.interruptiveBudgetSpent = false;
+    this.sessionStartMs = this.nowFn();
   }
   // ─── the main dispatch ───
   /**
@@ -9816,6 +10677,11 @@ class IntentRuleEvaluator {
    *   5. If nothing matches, return 'none'.
    */
   onSignalChanged(signal) {
+    if (this.oneInterruptionPerSession && this.interruptiveBudgetSpent) {
+      return { kind: "none" };
+    }
+    const sessionElapsedMs = this.nowFn() - this.sessionStartMs;
+    const exemptFromTtfi = _IntentRuleEvaluator.EXIT_SIGNALS.includes(signal);
     const candidates = this.armed.filter((c) => c.rule.fire_on.includes(signal)).filter((c) => !this.firedThisSession.has(c.id)).filter((c) => !this.silencedThisSession.has(c.id)).sort((a, b) => {
       if (b.rule.priority !== a.rule.priority) {
         return b.rule.priority - a.rule.priority;
@@ -9825,6 +10691,9 @@ class IntentRuleEvaluator {
     for (let i = 0; i < candidates.length; i++) {
       const c = candidates[i];
       if (!evaluateRule(c.rule, this.snapshot, this.namespaces)) continue;
+      if (this.ttfiMs > 0 && sessionElapsedMs < this.ttfiMs && !exemptFromTtfi) {
+        continue;
+      }
       if (c.rule.suppress_competing) {
         const suppressIds = this.armed.filter((other) => other.id !== c.id).map((other) => other.id);
         suppressIds.forEach((id) => this.silencedThisSession.add(id));
@@ -9838,7 +10707,12 @@ class IntentRuleEvaluator {
     }
     return { kind: "none" };
   }
-}
+};
+_IntentRuleEvaluator.EXIT_SIGNALS = [
+  "exit_intent",
+  "back_button"
+];
+let IntentRuleEvaluator = _IntentRuleEvaluator;
 class ContactScoresFetcher {
   constructor(cfg) {
     this.lastFetchedAt = 0;
@@ -10192,7 +11066,7 @@ class PrefetchBundleClient {
     }
     let response;
     try {
-      response = await fetch(url, { method: "GET", headers });
+      response = await fetch(url, { method: "GET", headers, cache: "no-cache" });
     } catch (err) {
       logger.warn("prefetch-bundle fetch network error:", err);
       return this.currentBundle;
@@ -11217,8 +12091,8 @@ class AegisWidgetManager {
       { label: "Prize 3", color: "#48dbfb" },
       { label: "Prize 4", color: "#ff6348" }
     ];
-    const SVG_NS = "http://www.w3.org/2000/svg";
-    const wheel = document.createElementNS(SVG_NS, "svg");
+    const SVG_NS2 = "http://www.w3.org/2000/svg";
+    const wheel = document.createElementNS(SVG_NS2, "svg");
     wheel.setAttribute("viewBox", "-160 -160 320 320");
     wheel.setAttribute("width", "300");
     wheel.setAttribute("height", "300");
@@ -11234,7 +12108,7 @@ class AegisWidgetManager {
       const x2 = Math.cos(end) * radius;
       const y2 = Math.sin(end) * radius;
       const largeArc = anglePer > Math.PI ? 1 : 0;
-      const path = document.createElementNS(SVG_NS, "path");
+      const path = document.createElementNS(SVG_NS2, "path");
       path.setAttribute(
         "d",
         `M 0 0 L ${x1.toFixed(2)} ${y1.toFixed(2)} A ${radius} ${radius} 0 ${largeArc} 1 ${x2.toFixed(2)} ${y2.toFixed(2)} Z`
@@ -11246,7 +12120,7 @@ class AegisWidgetManager {
       const labelAngle = start + anglePer / 2;
       const lx = Math.cos(labelAngle) * radius * 0.65;
       const ly = Math.sin(labelAngle) * radius * 0.65;
-      const text = document.createElementNS(SVG_NS, "text");
+      const text = document.createElementNS(SVG_NS2, "text");
       text.setAttribute("x", lx.toFixed(2));
       text.setAttribute("y", ly.toFixed(2));
       text.setAttribute("fill", "#ffffff");
@@ -11358,7 +12232,8 @@ class AegisWidgetManager {
       font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     `;
     const closeBtn = document.createElement("button");
-    closeBtn.innerHTML = "✕";
+    closeBtn.innerHTML = lucideSvg("x", { size: 16 });
+    closeBtn.setAttribute("aria-label", "Close");
     closeBtn.className = "aegis-spin-wheel-close";
     closeBtn.style.cssText = `
       position: absolute;
@@ -12338,8 +13213,9 @@ class AegisWidgetManager {
     }
     if (config.show_timer && config.timer_minutes) {
       const timer = document.createElement("div");
-      timer.style.cssText = "margin: 0 0 24px 0; text-align: center; font-size: 14px; color: #999;";
-      timer.textContent = `⏰ Offer expires in ${config.timer_minutes} minutes`;
+      timer.style.cssText = "margin: 0 0 24px 0; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 14px; color: #999;";
+      timer.innerHTML = lucideSvg("clock", { size: 14 });
+      timer.appendChild(document.createTextNode(`Offer expires in ${config.timer_minutes} minutes`));
       modal.appendChild(timer);
     }
     const ctaButton = document.createElement("button");
@@ -12470,7 +13346,7 @@ class AegisWidgetManager {
         });
         modal.innerHTML = `
           <div style="text-align: center; padding: 20px;">
-            <div style="font-size: 48px; margin-bottom: 16px;">✅</div>
+            <div style="margin-bottom: 16px; color: #10b981;">${lucideSvg("check", { size: 48 })}</div>
             <h3 style="margin: 0 0 12px 0; color: #1a73e8;">Thank You!</h3>
             <p style="margin: 0; color: #666;">Check your email for your discount code!</p>
           </div>
@@ -12716,6 +13592,9 @@ class AegisMessageRuntime {
       getCartState: () => this.deriveCartState()
     });
     this.intentRuleEvaluator = new IntentRuleEvaluator();
+    if (config.governance) {
+      this.intentRuleEvaluator.setGovernance(config.governance);
+    }
     this.contactScores = new ContactScoresFetcher({
       // Falls back to same-origin when no apiHost configured (storefront
       // typical case) — matches WidgetManager/InAppManager handling