@akropolys/kiku 1.7.7 → 1.7.9

package/dist/index.js

@@ -826,7 +826,7 @@ I couldn't find any matching products in the store.`;
 }
 
 // src/components/KikuButton.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_react_dom = require("react-dom");
 var import_sdk5 = require("@akropolys/sdk");
 var import_sdk6 = require("@akropolys/sdk");
@@ -1139,9 +1139,226 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
   );
 }
 
-// src/components/KikuButton.tsx
+// src/components/MarkupEditor.tsx
+var import_react5 = require("react");
 var import_jsx_runtime7 = require("react/jsx-runtime");
-var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var COLORS = ["#111111", "#ff5a5a", "#ffb300", "#22c55e", "#06b6d4", "#d946ef", "#9ca3af"];
+var MAX_EXPORT_DIM = 1280;
+function MarkupEditor({ src, onCancel, onSend }) {
+  const [img, setImg] = (0, import_react5.useState)(null);
+  const [loadError, setLoadError] = (0, import_react5.useState)(false);
+  const [tool, setTool] = (0, import_react5.useState)("pen");
+  const [color, setColor] = (0, import_react5.useState)(COLORS[1]);
+  const [actions, setActions] = (0, import_react5.useState)([]);
+  const [pendingText, setPendingText] = (0, import_react5.useState)(null);
+  const [textValue, setTextValue] = (0, import_react5.useState)("");
+  const [instruction, setInstruction] = (0, import_react5.useState)("");
+  const [exportError, setExportError] = (0, import_react5.useState)(false);
+  const canvasRef = (0, import_react5.useRef)(null);
+  const drawingRef = (0, import_react5.useRef)(null);
+  const textInputRef = (0, import_react5.useRef)(null);
+  (0, import_react5.useEffect)(() => {
+    const el = new Image();
+    el.crossOrigin = "anonymous";
+    el.onload = () => setImg(el);
+    el.onerror = () => setLoadError(true);
+    el.src = src;
+  }, [src]);
+  const dims = (() => {
+    if (!img) return { w: 0, h: 0 };
+    const scale = Math.min(1, MAX_EXPORT_DIM / Math.max(img.naturalWidth, img.naturalHeight));
+    return { w: Math.round(img.naturalWidth * scale), h: Math.round(img.naturalHeight * scale) };
+  })();
+  const markLayer = (0, import_react5.useRef)(null);
+  const paint = (live) => {
+    const canvas = canvasRef.current;
+    if (!canvas || !img) return;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return;
+    if (!markLayer.current) markLayer.current = document.createElement("canvas");
+    const layer = markLayer.current;
+    layer.width = canvas.width;
+    layer.height = canvas.height;
+    const lctx = layer.getContext("2d");
+    const all = live ? [...actions, live] : actions;
+    for (const a of all) {
+      if (a.kind === "stroke") {
+        lctx.save();
+        lctx.globalCompositeOperation = a.tool === "eraser" ? "destination-out" : "source-over";
+        lctx.strokeStyle = a.color;
+        lctx.lineWidth = a.tool === "eraser" ? a.size * 3 : a.size;
+        lctx.lineCap = "round";
+        lctx.lineJoin = "round";
+        lctx.beginPath();
+        a.points.forEach((p, i) => i === 0 ? lctx.moveTo(p.x, p.y) : lctx.lineTo(p.x, p.y));
+        if (a.points.length === 1) lctx.lineTo(a.points[0].x + 0.01, a.points[0].y);
+        lctx.stroke();
+        lctx.restore();
+      } else {
+        lctx.save();
+        lctx.fillStyle = a.color;
+        lctx.font = `600 ${a.size}px system-ui, sans-serif`;
+        lctx.fillText(a.value, a.x, a.y);
+        lctx.restore();
+      }
+    }
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
+    ctx.drawImage(layer, 0, 0);
+  };
+  (0, import_react5.useEffect)(() => {
+    paint();
+  }, [img, actions, dims.w, dims.h]);
+  (0, import_react5.useEffect)(() => {
+    if (pendingText) textInputRef.current?.focus();
+  }, [pendingText]);
+  const toCanvasPoint = (e) => {
+    const canvas = canvasRef.current;
+    const rect = canvas.getBoundingClientRect();
+    return {
+      x: (e.clientX - rect.left) / rect.width * canvas.width,
+      y: (e.clientY - rect.top) / rect.height * canvas.height
+    };
+  };
+  const strokeSize = () => Math.max(4, Math.round(dims.w / 180));
+  const textSize = () => Math.max(18, Math.round(dims.w / 28));
+  const onPointerDown = (e) => {
+    if (!img) return;
+    const p = toCanvasPoint(e);
+    if (tool === "text") {
+      setPendingText({ x: p.x, y: p.y });
+      setTextValue("");
+      return;
+    }
+    e.target.setPointerCapture(e.pointerId);
+    drawingRef.current = { kind: "stroke", tool, color, size: strokeSize(), points: [p] };
+    paint(drawingRef.current);
+  };
+  const onPointerMove = (e) => {
+    if (!drawingRef.current) return;
+    drawingRef.current.points.push(toCanvasPoint(e));
+    paint(drawingRef.current);
+  };
+  const onPointerUp = () => {
+    if (!drawingRef.current) return;
+    const done = drawingRef.current;
+    drawingRef.current = null;
+    setActions((prev) => [...prev, done]);
+  };
+  const commitText = () => {
+    if (pendingText && textValue.trim()) {
+      setActions((prev) => [...prev, { kind: "text", x: pendingText.x, y: pendingText.y, color, value: textValue.trim(), size: textSize() }]);
+    }
+    setPendingText(null);
+    setTextValue("");
+  };
+  const handleSend = () => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    try {
+      paint();
+      const dataUrl = canvas.toDataURL("image/jpeg", 0.92);
+      onSend(dataUrl, instruction.trim());
+    } catch {
+      setExportError(true);
+    }
+  };
+  const hasMarks = actions.length > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup", role: "dialog", "aria-label": "Mark up image", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup-head", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-markup-title", children: "Mark where you want the change" }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-markup-cancel", onClick: onCancel, children: "Cancel" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-markup-stage", children: loadError ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-markup-error", children: "This image can't be edited here." }) : !img ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-markup-loading", children: "Loading image\u2026" }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup-canvas-wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "canvas",
+        {
+          ref: canvasRef,
+          width: dims.w,
+          height: dims.h,
+          className: `hsk-markup-canvas hsk-markup-canvas--${tool}`,
+          onPointerDown,
+          onPointerMove,
+          onPointerUp,
+          onPointerLeave: onPointerUp
+        }
+      ),
+      pendingText && canvasRef.current && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "input",
+        {
+          ref: textInputRef,
+          className: "hsk-markup-textinput",
+          style: {
+            left: `${pendingText.x / dims.w * 100}%`,
+            top: `${pendingText.y / dims.h * 100}%`,
+            color
+          },
+          value: textValue,
+          placeholder: "Type, then Enter",
+          onChange: (e) => setTextValue(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter") commitText();
+            if (e.key === "Escape") {
+              setPendingText(null);
+              setTextValue("");
+            }
+          },
+          onBlur: commitText
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup-tools", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-markup-colors", children: COLORS.map((c) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "button",
+        {
+          className: `hsk-markup-color${color === c ? " hsk-markup-color--on" : ""}`,
+          style: { background: c },
+          onClick: () => {
+            setColor(c);
+            if (tool === "eraser") setTool("pen");
+          },
+          "aria-label": `Colour ${c}`
+        },
+        c
+      )) }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: `hsk-markup-tool${tool === "pen" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("pen"), children: "Sketch" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: `hsk-markup-tool${tool === "text" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("text"), children: "Text" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: `hsk-markup-tool${tool === "eraser" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("eraser"), children: "Eraser" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-markup-tool", onClick: () => setActions((prev) => prev.slice(0, -1)), disabled: !hasMarks, children: "Undo" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-markup-tool", onClick: () => setActions([]), disabled: !hasMarks, children: "Clear" })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-markup-send", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "input",
+        {
+          className: "hsk-markup-instruction",
+          value: instruction,
+          placeholder: "Describe the change \u2014 e.g. add the sofa here",
+          onChange: (e) => setInstruction(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter" && (hasMarks || instruction.trim())) handleSend();
+          }
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "button",
+        {
+          className: "hsk-markup-go",
+          onClick: handleSend,
+          disabled: !img || !hasMarks && !instruction.trim(),
+          children: "Send"
+        }
+      )
+    ] }),
+    exportError && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-markup-error", children: "Couldn't process this image \u2014 try a newer visualization." })
+  ] });
+}
+
+// src/components/KikuButton.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
   "svg",
   {
     className: cn("hsk-brand-mark", className),
@@ -1150,52 +1367,52 @@ var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */ (0, import_jsx_runt
     viewBox: "0 0 100 100",
     xmlns: "http://www.w3.org/2000/svg",
     "aria-label": "kiku",
-    children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "55", cy: "82", r: "3.4" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("circle", { cx: "55", cy: "82", r: "3.4" })
     ] })
   }
 );
 var SparkleIcon2 = KikuIcon;
-var ArrowUpIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "m5 12 7-7 7 7" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 19V5" })
+var ArrowUpIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "m5 12 7-7 7 7" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 19V5" })
 ] });
-var StopIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "5", y: "5", width: "14", height: "14", rx: "2" }) });
-var ExternalIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "15 3 21 3 21 9" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
+var StopIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("rect", { x: "5", y: "5", width: "14", height: "14", rx: "2" }) });
+var ExternalIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("polyline", { points: "15 3 21 3 21 9" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
 ] });
-var ContinueIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M8 5v14l11-7z" }) });
-var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+var ContinueIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M8 5v14l11-7z" }) });
+var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
 ] });
-var ChevronRightIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "m9 18 6-6-6-6" }) });
-var HistoryIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 3v5h5" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 7v5l4 2" })
+var ChevronRightIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "m9 18 6-6-6-6" }) });
+var HistoryIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M3 3v5h5" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 7v5l4 2" })
 ] });
-var BookmarkIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M19 21 12 16l-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z" }) });
-var TrashIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 6h18" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+var BookmarkIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M19 21 12 16l-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z" }) });
+var TrashIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M3 6h18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
 ] });
-var PaperclipIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
-var MicIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
+var PaperclipIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
+var MicIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
 ] });
-var MicOffIcon = () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
+var MicOffIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
 ] });
 var DEFAULT_CHIPS = [];
 function extractName(raw) {
@@ -1245,7 +1462,7 @@ function KikuPickerMenu({
   onDismiss
 }) {
   const discussed = sources.filter((s) => s.id && referencedIds.includes(s.id));
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "div",
     {
       className: "hsk-kiku-picker",
@@ -1253,7 +1470,7 @@ function KikuPickerMenu({
       "aria-label": "@kiku commands",
       onMouseDown: (e) => e.preventDefault(),
       children: [
-        discussed.map((src, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        discussed.map((src, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "button",
           {
             className: "hsk-kiku-picker-item",
@@ -1263,9 +1480,9 @@ function KikuPickerMenu({
               onDismiss();
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon", children: src.image ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: src.image, alt: "" }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BookmarkIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-item-name", children: src.name }),
-              src.price && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "hsk-kiku-picker-item-price", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon", children: src.image ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: src.image, alt: "" }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BookmarkIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-item-name", children: src.name }),
+              src.price && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-kiku-picker-item-price", children: [
                 src.currency ?? defaultCurrency,
                 " ",
                 parseFloat(String(src.price).replace(/[^0-9.]/g, "") || "0").toLocaleString()
@@ -1274,7 +1491,7 @@ function KikuPickerMenu({
           },
           src.id ?? i
         )),
-        discussed.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        discussed.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "button",
           {
             className: "hsk-kiku-picker-item",
@@ -1284,8 +1501,8 @@ function KikuPickerMenu({
               onDismiss();
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BookmarkIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "hsk-kiku-picker-item-name", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BookmarkIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-kiku-picker-item-name", children: [
                 "Capture all (",
                 discussed.length,
                 ")"
@@ -1293,7 +1510,7 @@ function KikuPickerMenu({
             ]
           }
         ),
-        discussed.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        discussed.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "button",
           {
             className: "hsk-kiku-picker-item",
@@ -1303,12 +1520,12 @@ function KikuPickerMenu({
               onDismiss();
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BookmarkIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "Capture current page" })
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(BookmarkIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "Capture current page" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "button",
           {
             className: "hsk-kiku-picker-item",
@@ -1318,12 +1535,12 @@ function KikuPickerMenu({
               onDismiss();
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HistoryIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "What have you saved?" })
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(HistoryIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "What have you saved?" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "button",
           {
             className: "hsk-kiku-picker-item",
@@ -1333,8 +1550,8 @@ function KikuPickerMenu({
               onDismiss();
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TrashIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "Delete this" })
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(TrashIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "Delete this" })
             ]
           }
         )
@@ -1343,22 +1560,22 @@ function KikuPickerMenu({
   );
 }
 function AtPickerMenu({ onSelect, onDismiss }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "div",
     {
       className: "hsk-kiku-picker",
       role: "menu",
       "aria-label": "Extensions",
       onMouseDown: (e) => e.preventDefault(),
-      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
         "button",
         {
           className: "hsk-kiku-picker-item",
           role: "menuitem",
           onClick: () => onSelect("@kiku"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-icon hsk-kiku-picker-icon--accent", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "kiku \u2014 capture & remember" })
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-icon hsk-kiku-picker-icon--accent", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-picker-item-name", children: "kiku \u2014 capture & remember" })
           ]
         }
       )
@@ -1366,11 +1583,11 @@ function AtPickerMenu({ onSelect, onDismiss }) {
   );
 }
 function SourceImg({ src, alt, onImageClick }) {
-  const [failed, setFailed] = (0, import_react5.useState)(false);
+  const [failed, setFailed] = (0, import_react6.useState)(false);
   if (failed) {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { width: "100%", height: "100%", display: "flex", alignItems: "center", justifyContent: "center", background: "var(--hsk-chat-source-bg, rgba(0,0,0,.04))", color: "var(--hsk-chat-muted, #888)" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) });
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { width: "100%", height: "100%", display: "flex", alignItems: "center", justifyContent: "center", background: "var(--hsk-chat-source-bg, rgba(0,0,0,.04))", color: "var(--hsk-chat-muted, #888)" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "img",
     {
       src,
@@ -1386,15 +1603,15 @@ function SourceImg({ src, alt, onImageClick }) {
 function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClick, referencedIds = [], compact = false }) {
   const client = (0, import_sdk6.useAkropolysContext)();
   const isProperty = client?.vertical === "property";
-  const railRef = (0, import_react5.useRef)(null);
-  const [showNext, setShowNext] = (0, import_react5.useState)(false);
-  const measure = (0, import_react5.useCallback)(() => {
+  const railRef = (0, import_react6.useRef)(null);
+  const [showNext, setShowNext] = (0, import_react6.useState)(false);
+  const measure = (0, import_react6.useCallback)(() => {
     const el = railRef.current;
     if (!el) return;
     const atEnd = el.scrollLeft + el.clientWidth >= el.scrollWidth - 8;
     setShowNext(el.scrollWidth > el.clientWidth + 4 && !atEnd);
   }, []);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     measure();
     const el = railRef.current;
     if (!el) return;
@@ -1411,20 +1628,20 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
   };
   const display = sources.filter((s) => s.id && referencedIds.includes(s.id));
   if (display.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn("hsk-cb-sources-wrap", compact && "hsk-cb-sources-wrap--compact"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-sources", ref: railRef, children: display.map((src, si) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("hsk-cb-sources-wrap", compact && "hsk-cb-sources-wrap--compact"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-sources", ref: railRef, children: display.map((src, si) => {
       const isReferenced = !!(src.id && referencedIds.includes(src.id));
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
         "div",
         {
           className: cn("hsk-cb-source", isReferenced && "hsk-cb-source--referenced"),
           style: { animationDelay: `${si * 50}ms` },
           onClick: () => onSelectSource?.(src),
           children: [
-            src.image ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-src-imgwrap", style: { position: "relative" }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SourceImg, { src: src.image, alt: src.name, onImageClick }),
-              isReferenced && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, { size: 10 }) }),
-              isProperty && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: {
+            src.image ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-src-imgwrap", style: { position: "relative" }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SourceImg, { src: src.image, alt: src.name, onImageClick }),
+              isReferenced && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, { size: 10 }) }),
+              isProperty && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: {
                 position: "absolute",
                 top: "6px",
                 right: "6px",
@@ -1439,14 +1656,14 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
                 color: "#fbbf24",
                 // Gold sparkle badge
                 boxShadow: "0 2px 4px rgba(0,0,0,0.2)"
-              }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, { size: 12 }) })
-            ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-src-imgwrap-empty", style: { position: "relative" }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}),
-              isReferenced && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, { size: 10 }) })
+              }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, { size: 12 }) })
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-src-imgwrap-empty", style: { position: "relative" }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}),
+              isReferenced && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, { size: 10 }) })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-src-info", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-src-name", children: src.name }),
-              src.price && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-src-price", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-src-info", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-src-name", children: src.name }),
+              src.price && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-src-price", children: [
                 src.currency ?? defaultCurrency,
                 " ",
                 parseFloat(String(src.price).replace(/[^0-9.]/g, "") || "0").toLocaleString()
@@ -1457,15 +1674,15 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
         src.id ?? si
       );
     }) }),
-    showNext && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    showNext && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           className: "hsk-cb-sources-fade",
           style: { background: "linear-gradient(to right, transparent, var(--hsk-fade-bg, #0e0e0f))" }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-sources-next", onClick: scrollNext, "aria-label": "See more", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ChevronRightIcon, {}) })
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-sources-next", onClick: scrollNext, "aria-label": "See more", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ChevronRightIcon, {}) })
     ] })
   ] });
 }
@@ -1542,14 +1759,14 @@ function SmartContextPills({
     pills.push({ emoji: "\u{1F4A1}", label: "Recommend something", query: "What do you recommend for me?" });
   }
   if (pills.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-action-pills", children: pills.map((pill) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-action-pills", children: pills.map((pill) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "button",
     {
       className: "hsk-action-pill",
       onClick: () => onSend(pill.query),
       disabled: loading,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-pill-emoji", children: pill.emoji }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-pill-emoji", children: pill.emoji }),
         pill.label
       ]
     },
@@ -1610,10 +1827,10 @@ function parseThinking(text) {
   };
 }
 function ThinkingBlock({ text, isComplete, seconds: fixedSeconds }) {
-  const startRef = (0, import_react5.useRef)(Date.now());
-  const [seconds, setSeconds] = (0, import_react5.useState)(() => isComplete ? null : 0);
-  const [isOpen, setIsOpen] = (0, import_react5.useState)(!isComplete);
-  (0, import_react5.useEffect)(() => {
+  const startRef = (0, import_react6.useRef)(Date.now());
+  const [seconds, setSeconds] = (0, import_react6.useState)(() => isComplete ? null : 0);
+  const [isOpen, setIsOpen] = (0, import_react6.useState)(!isComplete);
+  (0, import_react6.useEffect)(() => {
     if (isComplete) {
       if (seconds !== null) {
         setSeconds(Math.max(1, Math.round((Date.now() - startRef.current) / 1e3)));
@@ -1630,8 +1847,8 @@ function ThinkingBlock({ text, isComplete, seconds: fixedSeconds }) {
   const finalSeconds = fixedSeconds ?? seconds;
   const label = isComplete ? finalSeconds !== null && finalSeconds !== void 0 ? `Thought for ${finalSeconds}s` : "Thought process" : `Thinking${seconds ? ` \xB7 ${seconds}s` : "\u2026"}`;
   const expandable = !!text;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cn("hsk-cb-think", !isComplete && "hsk-cb-think--live"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("hsk-cb-think", !isComplete && "hsk-cb-think--live"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "button",
       {
         type: "button",
@@ -1639,16 +1856,20 @@ function ThinkingBlock({ text, isComplete, seconds: fixedSeconds }) {
         onClick: expandable ? () => setIsOpen((o) => !o) : void 0,
         "aria-expanded": expandable ? isOpen : void 0,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: !isComplete ? "hsk-cb-think-spin" : void 0, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 6v6l4 2" })
+          isComplete ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 6v6l4 2" })
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-cb-typing", "aria-hidden": "true", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", {}),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", {}),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", {})
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: label }),
-          expandable && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: cn("hsk-cb-think-chevron", isOpen && "hsk-cb-think-chevron--open"), children: "\u25B6" })
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: label }),
+          expandable && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: cn("hsk-cb-think-chevron", isOpen && "hsk-cb-think-chevron--open"), children: "\u25B6" })
         ]
       }
     ),
-    expandable && isOpen && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-think-body", children: text })
+    expandable && isOpen && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-think-body", children: text })
   ] });
 }
 function ChatModal({
@@ -1669,18 +1890,18 @@ function ChatModal({
 }) {
   const client = (0, import_sdk6.useAkropolysContext)();
   const { messages, sources, loading, streaming, error, lastAction, lastIntent, send, stop, stopped, interrupted, continueGenerating, reset, referencedIds } = (0, import_sdk5.useKiku)();
-  const [input, setInput] = (0, import_react5.useState)("");
-  const [shopperName, setShopperNameState] = (0, import_react5.useState)(() => {
+  const [input, setInput] = (0, import_react6.useState)("");
+  const [shopperName, setShopperNameState] = (0, import_react6.useState)(() => {
     try {
       return client.getShopperName?.() ?? "";
     } catch {
       return "";
     }
   });
-  const [nameSkipped, setNameSkipped] = (0, import_react5.useState)(false);
+  const [nameSkipped, setNameSkipped] = (0, import_react6.useState)(false);
   const awaitingName = messages.length === 0 && !shopperName && !nameSkipped;
-  const [attachments, setAttachments] = (0, import_react5.useState)([]);
-  const imageInputRef = (0, import_react5.useRef)(null);
+  const [attachments, setAttachments] = (0, import_react6.useState)([]);
+  const imageInputRef = (0, import_react6.useRef)(null);
   const handleImageFiles = (files) => {
     if (!files || files.length === 0) return;
     Array.from(files).forEach((file) => {
@@ -1698,11 +1919,11 @@ function ChatModal({
   const removeAttachment = (idx) => {
     setAttachments((prev) => prev.filter((_, i) => i !== idx));
   };
-  const [voiceState, setVoiceState] = (0, import_react5.useState)("idle");
-  const recognitionRef = (0, import_react5.useRef)(null);
-  const pendingVoiceRef = (0, import_react5.useRef)(null);
+  const [voiceState, setVoiceState] = (0, import_react6.useState)("idle");
+  const recognitionRef = (0, import_react6.useRef)(null);
+  const pendingVoiceRef = (0, import_react6.useRef)(null);
   const hasSpeechAPI = typeof window !== "undefined" && ("SpeechRecognition" in window || "webkitSpeechRecognition" in window);
-  const startVoice = (0, import_react5.useCallback)(() => {
+  const startVoice = (0, import_react6.useCallback)(() => {
     if (!hasSpeechAPI || voiceState !== "idle") return;
     const SR = window.SpeechRecognition || window.webkitSpeechRecognition;
     const recognition = new SR();
@@ -1740,25 +1961,26 @@ function ChatModal({
     };
     recognition.start();
   }, [hasSpeechAPI, voiceState, voiceLang]);
-  const stopVoice = (0, import_react5.useCallback)(() => {
+  const stopVoice = (0, import_react6.useCallback)(() => {
     recognitionRef.current?.stop();
     setVoiceState("idle");
   }, []);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     return () => recognitionRef.current?.abort();
   }, []);
   const activeChips = chips;
   const activeTitle = title;
   const activePlaceholder = awaitingName ? "Type your name\u2026" : placeholder;
-  const [selectedProduct, setSelectedProduct] = (0, import_react5.useState)(null);
-  const [lightboxSrc, setLightboxSrc] = (0, import_react5.useState)(null);
-  const bottomRef = (0, import_react5.useRef)(null);
-  const textareaRef = (0, import_react5.useRef)(null);
-  const [keyInput, setKeyInput] = (0, import_react5.useState)("");
-  const [keyPhase, setKeyPhase] = (0, import_react5.useState)("idle");
-  const [mintedKey, setMintedKey] = (0, import_react5.useState)(null);
-  const [mintedPub, setMintedPub] = (0, import_react5.useState)(null);
-  const [copied, setCopied] = (0, import_react5.useState)(null);
+  const [selectedProduct, setSelectedProduct] = (0, import_react6.useState)(null);
+  const [lightboxSrc, setLightboxSrc] = (0, import_react6.useState)(null);
+  const [markupSrc, setMarkupSrc] = (0, import_react6.useState)(null);
+  const bottomRef = (0, import_react6.useRef)(null);
+  const textareaRef = (0, import_react6.useRef)(null);
+  const [keyInput, setKeyInput] = (0, import_react6.useState)("");
+  const [keyPhase, setKeyPhase] = (0, import_react6.useState)("idle");
+  const [mintedKey, setMintedKey] = (0, import_react6.useState)(null);
+  const [mintedPub, setMintedPub] = (0, import_react6.useState)(null);
+  const [copied, setCopied] = (0, import_react6.useState)(null);
   const copyValue = (value, which) => {
     try {
       navigator.clipboard?.writeText(value);
@@ -1767,17 +1989,17 @@ function ChatModal({
     setCopied(which);
     setTimeout(() => setCopied((c) => c === which ? null : c), 1600);
   };
-  const [keyCountdown, setKeyCountdown] = (0, import_react5.useState)(KIKU_KEY_REVEAL_SECONDS);
-  const [minting, setMinting] = (0, import_react5.useState)(false);
-  const [showKikuPicker, setShowKikuPicker] = (0, import_react5.useState)(false);
-  const [showAtPicker, setShowAtPicker] = (0, import_react5.useState)(false);
-  (0, import_react5.useEffect)(() => {
+  const [keyCountdown, setKeyCountdown] = (0, import_react6.useState)(KIKU_KEY_REVEAL_SECONDS);
+  const [minting, setMinting] = (0, import_react6.useState)(false);
+  const [showKikuPicker, setShowKikuPicker] = (0, import_react6.useState)(false);
+  const [showAtPicker, setShowAtPicker] = (0, import_react6.useState)(false);
+  (0, import_react6.useEffect)(() => {
     if (!lastAction) return;
     if (lastAction.type === "request_kiku_key") {
       setKeyPhase("prompt_key");
     }
   }, [lastAction]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (!mintedKey) return;
     setKeyCountdown(KIKU_KEY_REVEAL_SECONDS);
     const t = setInterval(() => {
@@ -1828,9 +2050,9 @@ function ChatModal({
       setMinting(false);
     }
   };
-  const msgsContainerRef = (0, import_react5.useRef)(null);
-  const messageRefs = (0, import_react5.useRef)([]);
-  (0, import_react5.useEffect)(() => {
+  const msgsContainerRef = (0, import_react6.useRef)(null);
+  const messageRefs = (0, import_react6.useRef)([]);
+  (0, import_react6.useEffect)(() => {
     const container = msgsContainerRef.current;
     if (!container) return;
     const lastMsg = messages[messages.length - 1];
@@ -1843,14 +2065,14 @@ function ChatModal({
       bottomRef.current?.scrollIntoView({ behavior: "smooth" });
     }
   }, [messages, loading, selectedProduct]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const prev = document.body.style.overflow;
     document.body.style.overflow = "hidden";
     return () => {
       document.body.style.overflow = prev;
     };
   }, []);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const h = (e) => {
       if (e.key !== "Escape") return;
       if (lightboxSrc) {
@@ -1862,7 +2084,7 @@ function ChatModal({
     document.addEventListener("keydown", h);
     return () => document.removeEventListener("keydown", h);
   }, [lightboxSrc, onClose]);
-  const handleReset = (0, import_react5.useCallback)(() => {
+  const handleReset = (0, import_react6.useCallback)(() => {
     reset();
     setKeyPhase("idle");
   }, [reset]);
@@ -1916,7 +2138,7 @@ function ChatModal({
       textareaRef.current.focus();
     }
   };
-  const handleKikuCapture = (0, import_react5.useCallback)((product) => {
+  const handleKikuCapture = (0, import_react6.useCallback)((product) => {
     const name = product.name || "";
     const display = `@kiku capture${name ? " " + name : ""}`;
     const q = name || "capture current page";
@@ -1926,7 +2148,7 @@ function ChatModal({
     setAttachments([]);
     send(q, display, toSend.length > 0 ? toSend : void 0, "capture");
   }, [attachments, send]);
-  const handleKikuCaptureAll = (0, import_react5.useCallback)((products) => {
+  const handleKikuCaptureAll = (0, import_react6.useCallback)((products) => {
     const targets = products.filter((p) => p.id).map((p) => ({
       name: p.name || "",
       url: p.url || "",
@@ -1941,14 +2163,14 @@ function ChatModal({
     setAttachments([]);
     send(names || "capture all", display, void 0, "capture_all", targets);
   }, [defaultCurrency, send]);
-  const handleKikuViewHistory = (0, import_react5.useCallback)(() => {
+  const handleKikuViewHistory = (0, import_react6.useCallback)(() => {
     const display = "@kiku what have you saved?";
     setInput("");
     setSelectedProduct(null);
     setAttachments([]);
     send("show my saved items", display, void 0, "view_history");
   }, [send]);
-  const handleKikuDelete = (0, import_react5.useCallback)(() => {
+  const handleKikuDelete = (0, import_react6.useCallback)(() => {
     const display = "@kiku delete this";
     setInput("");
     setSelectedProduct(null);
@@ -1981,7 +2203,7 @@ function ChatModal({
     t.style.height = "auto";
     t.style.height = `${Math.min(t.scrollHeight, 140)}px`;
   };
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (voiceState !== "processing") return;
     const transcript = pendingVoiceRef.current;
     if (!transcript) {
@@ -1997,7 +2219,7 @@ function ChatModal({
   }, [voiceState]);
   const blurVal = typeof backdropBlur === "number" ? `${backdropBlur}px` : backdropBlur ?? "20px";
   const displayMessages = messages;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "div",
     {
       className: cn("hsk-cb-overlay", classNames.overlay),
@@ -2009,7 +2231,7 @@ function ChatModal({
         ...backdropColor ? { background: backdropColor } : {},
         ...customStyles
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
         "div",
         {
           className: cn("hsk-cb-panel", classNames.panel),
@@ -2022,48 +2244,62 @@ function ChatModal({
             }
           },
           children: [
-            lightboxSrc && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-lightbox", onClick: () => setLightboxSrc(null), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-lightbox-close", onClick: () => setLightboxSrc(null), "aria-label": "Close image", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CloseIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: lightboxSrc, alt: "", className: "hsk-lightbox-img", onClick: (e) => e.stopPropagation() })
+            lightboxSrc && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-lightbox", onClick: () => setLightboxSrc(null), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-lightbox-close", onClick: () => setLightboxSrc(null), "aria-label": "Close image", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: lightboxSrc, alt: "", className: "hsk-lightbox-img", onClick: (e) => e.stopPropagation() })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-main", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-left", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-topbar-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-topbar-title", children: activeTitle }) })
+            markupSrc && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-markup-overlay", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              MarkupEditor,
+              {
+                src: markupSrc,
+                onCancel: () => setMarkupSrc(null),
+                onSend: (dataUrl, instruction) => {
+                  setMarkupSrc(null);
+                  handleSend(
+                    instruction || "Apply the change indicated by the markings on the image.",
+                    [{ type: "image", data: dataUrl, annotated: true }]
+                  );
+                }
+              }
+            ) }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-main", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-topbar", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-topbar-left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-topbar-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-topbar-title", children: activeTitle }) })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-topbar-actions", children: [
-                  messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-topbar-btn", onClick: handleReset, children: "Clear chat" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CloseIcon, {}) })
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-topbar-actions", children: [
+                  messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-topbar-btn", onClick: handleReset, children: "Clear chat" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon, {}) })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-msgs", ref: msgsContainerRef, children: [
-                displayMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-empty", children: [
-                  awaitingName ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("h2", { className: "hsk-cb-hello", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-msgs", ref: msgsContainerRef, children: [
+                displayMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-empty", children: [
+                  awaitingName ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("h2", { className: "hsk-cb-hello", children: [
                       "Hi, I'm ",
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("b", { children: "kiku" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("b", { children: "kiku" }),
                       "."
                     ] }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "hsk-cb-hello-lead", children: "I can search, visualize, or capture anything for you \u2014 on this site or any other." }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "hsk-cb-hello-ask", children: "What should I call you?" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-hello-skip", onClick: () => setNameSkipped(true), children: "Skip for now" })
-                  ] }) : shopperName ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("h2", { className: "hsk-cb-hello", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "hsk-cb-hello-lead", children: "I can search, visualize, or capture anything for you \u2014 on this site or any other." }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "hsk-cb-hello-ask", children: "What should I call you?" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-hello-skip", onClick: () => setNameSkipped(true), children: "Skip for now" })
+                  ] }) : shopperName ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("h2", { className: "hsk-cb-hello", children: [
                       "Hi, ",
                       shopperName,
                       "."
                     ] }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "hsk-cb-hello-lead", children: "What can I find for you today?" })
-                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("h2", { className: "hsk-cb-hello", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "hsk-cb-hello-lead", children: "What can I find for you today?" })
+                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("h2", { className: "hsk-cb-hello", children: [
                       "Hi, I'm ",
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("b", { children: "kiku" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("b", { children: "kiku" }),
                       "."
                     ] }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "hsk-cb-hello-lead", children: "Ask me to search, visualize, or capture anything \u2014 I look across the whole site in real time." })
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "hsk-cb-hello-lead", children: "Ask me to search, visualize, or capture anything \u2014 I look across the whole site in real time." })
                   ] }),
-                  !awaitingName && activeChips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-chips", children: activeChips.map((chip) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  !awaitingName && activeChips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-chips", children: activeChips.map((chip) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "button",
                     {
                       className: "hsk-cb-chip",
@@ -2074,40 +2310,41 @@ function ChatModal({
                   )) })
                 ] }) : displayMessages.map((msg, idx) => {
                   const isLast = idx === displayMessages.length - 1;
+                  const isLastUser = msg.role === "user" && !displayMessages.slice(idx + 1).some((m) => m.role === "user");
                   const isUser = msg.role === "user";
                   const compareSources = sources.filter((s) => s.id && referencedIds.includes(s.id));
                   const showMatrix = isLast && lastIntent === "compare" && compareSources.length >= 2;
                   const displayContent = !isUser && showMatrix ? stripMarkdownTables(msg.content) : msg.content;
-                  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-msg-group", ref: (el) => {
+                  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-msg-group", ref: (el) => {
                     messageRefs.current[idx] = el;
-                  }, children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-user-msg", children: [
-                    msg.images && msg.images.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-user-imgs", children: msg.images.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: img, alt: `attachment ${i + 1}`, className: "hsk-cb-user-img-thumb" }, i)) }),
-                    msg.content && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-user-bubble", children: /^@kiku\b/i.test(msg.content) ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-kiku-badge", children: "@kiku" }),
+                  }, children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `hsk-cb-user-msg${isLastUser ? " hsk-sent" : ""}`, children: [
+                    msg.images && msg.images.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-imgs", children: msg.images.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: img, alt: `attachment ${i + 1}`, className: "hsk-cb-user-img-thumb" }, i)) }),
+                    msg.content && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-bubble", children: /^@kiku\b/i.test(msg.content) ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-kiku-badge", children: "@kiku" }),
                       msg.content.replace(/^@kiku\s*/i, "")
                     ] }) : msg.content })
-                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-body", children: [
+                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-body", children: [
                       (() => {
                         const parsed = parseThinking(displayContent);
                         const thinking = msg.thinking || parsed.thinking;
                         const content = parsed.content;
                         const isComplete = msg.thinking ? content.length > 0 || !(isLast && streaming) : parsed.isComplete;
-                        return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-                          (thinking || msg.thoughtForSeconds != null) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ThinkingBlock, { text: thinking, isComplete, seconds: msg.thoughtForSeconds }),
-                          content && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-text", children: [
+                        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+                          (thinking || msg.thoughtForSeconds != null) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ThinkingBlock, { text: thinking, isComplete, seconds: msg.thoughtForSeconds }),
+                          content && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-text", children: [
                             renderMarkdown(content, isLast && streaming),
-                            isLast && streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { display: "inline-block", width: "0.5em", height: "1.05em", marginLeft: "2px", verticalAlign: "text-bottom", background: "currentColor", opacity: 0.55, borderRadius: "1px" } })
+                            isLast && streaming && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { style: { display: "inline-block", width: "0.5em", height: "1.05em", marginLeft: "2px", verticalAlign: "text-bottom", background: "currentColor", opacity: 0.55, borderRadius: "1px" } })
                           ] })
                         ] });
                       })(),
-                      msg.visualizing && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-viz hsk-cb-viz--loading", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-viz-spinner" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Visualizing\u2026" })
+                      msg.visualizing && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-viz hsk-cb-viz--loading", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-viz-spinner" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: "Visualizing\u2026" })
                       ] }),
-                      msg.visualization && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-viz", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                      msg.visualization && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-viz", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                           "img",
                           {
                             src: msg.visualization,
@@ -2118,16 +2355,36 @@ function ChatModal({
                             }
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-viz-disclaimer", children: "AI-generated preview \u2014 colours, size and placement may differ from the real product." })
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-viz-foot", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-viz-disclaimer", children: "AI-generated preview \u2014 colours, size and placement may differ from the real product." }),
+                          isLast && !streaming && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-viz-mark", onClick: () => setMarkupSrc(msg.visualization), children: "Mark & edit" })
+                        ] })
                       ] }),
-                      showMatrix && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ComparisonMatrix, { sources: compareSources, defaultCurrency }),
+                      !isUser && (msg.knowledgeImages?.length ?? 0) > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-kimgs", children: msg.knowledgeImages.map((ref) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-kimg-group", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-kimg-grid", children: ref.images.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                          "img",
+                          {
+                            src: img.url,
+                            alt: img.note || ref.title || "Reference image",
+                            className: "hsk-cb-kimg",
+                            loading: "lazy",
+                            onClick: () => setLightboxSrc(img.url),
+                            onError: (e) => {
+                              e.target.style.display = "none";
+                            }
+                          },
+                          i
+                        )) }),
+                        (ref.title || ref.images[0]?.note) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-kimg-caption", children: ref.title || ref.images[0]?.note })
+                      ] }, ref.entryId)) }),
+                      showMatrix && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ComparisonMatrix, { sources: compareSources, defaultCurrency }),
                       (() => {
                         const msgReferencedIds = isLast ? referencedIds : msg.referencedIds ?? [];
                         const msgSources = isLast ? sources : msg.sources ?? [];
                         const msgIntent = isLast ? lastIntent : msg.intent;
                         const hiddenIntent = msgIntent === "compare" || msgIntent === "capture" || msgIntent === "capture_all" || msgIntent === "delete" || msgIntent === "view_history";
                         const showCarousel = msgReferencedIds.length > 0 && !hiddenIntent && (!isLast || lastAction?.type !== "request_kiku_key");
-                        return showCarousel && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                        return showCarousel && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                           SourcesCarousel,
                           {
                             sources: msgSources,
@@ -2139,11 +2396,11 @@ function ChatModal({
                           }
                         );
                       })(),
-                      isLast && !loading && lastAction?.url && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-action-pills", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("a", { className: "hsk-action-pill", href: lastAction.url, children: [
+                      isLast && !loading && lastAction?.url && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-action-pills", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("a", { className: "hsk-action-pill", href: lastAction.url, children: [
                         String(lastAction.type || "continue").replace(/_/g, " "),
                         " \u2192"
                       ] }) }),
-                      isLast && !loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                      isLast && !loading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                         SmartContextPills,
                         {
                           intent: lastIntent,
@@ -2155,16 +2412,16 @@ function ChatModal({
                     ] })
                   ] }) }, idx);
                 }),
-                selectedProduct && loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+                selectedProduct && loading && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
                   "div",
                   {
                     className: "hsk-cb-selected-product",
                     onClick: () => selectedProduct.url && window.open(selectedProduct.url, "_blank"),
                     children: [
-                      selectedProduct.image && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { className: "hsk-cb-selected-img", src: selectedProduct.image, alt: selectedProduct.name }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-info", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-selected-name", children: selectedProduct.name }),
-                        selectedProduct.price && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-selected-price", children: [
+                      selectedProduct.image && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { className: "hsk-cb-selected-img", src: selectedProduct.image, alt: selectedProduct.name }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-selected-info", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-selected-name", children: selectedProduct.name }),
+                        selectedProduct.price && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-selected-price", children: [
                           selectedProduct.currency ?? defaultCurrency,
                           " ",
                           parseFloat(String(selectedProduct.price ?? "").replace(/[^0-9.]/g, "") || "0").toLocaleString()
@@ -2173,22 +2430,22 @@ function ChatModal({
                     ]
                   }
                 ),
-                loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-typing-row", style: { display: "flex", alignItems: "center", gap: "10px" }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-thinking-icon", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { className: "hsk-brand-mark", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { className: "hsk-brand-mark hsk-brand-mark--sheen", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-orbit", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "hsk-handle-ring", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-ball" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-ball" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-ball" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-ball" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-ball" })
+                loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-typing-row", style: { display: "flex", alignItems: "center", gap: "10px" }, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-thinking-icon", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { className: "hsk-brand-mark", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { className: "hsk-brand-mark hsk-brand-mark--sheen", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-orbit", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-handle-ring", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-ball" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-ball" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-ball" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-ball" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-ball" })
                     ] }) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-handle-rest" })
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-handle-rest" })
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-thinking-text", children: "Thinking\u2026" })
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-thinking-text", children: "Thinking\u2026" })
                 ] }),
-                lastAction?.type === "open_memory" && lastAction.url && !loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+                lastAction?.type === "open_memory" && lastAction.url && !loading && !streaming && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
                   "a",
                   {
                     className: "hsk-cb-memory-pill",
@@ -2197,23 +2454,23 @@ function ChatModal({
                     rel: "noopener noreferrer",
                     children: [
                       "Open my memory on mimi",
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ExternalIcon, {})
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ExternalIcon, {})
                     ]
                   }
                 ),
-                (stopped || interrupted) && !loading && !streaming && messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-stopped", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-stopped-label", children: stopped ? "You stopped this response." : "This response was interrupted." }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { className: "hsk-cb-continue", onClick: continueGenerating, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContinueIcon, {}),
+                (stopped || interrupted) && !loading && !streaming && messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-stopped", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-stopped-label", children: stopped ? "You stopped this response." : "This response was interrupted." }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { className: "hsk-cb-continue", onClick: continueGenerating, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContinueIcon, {}),
                     messages[messages.length - 1]?.role === "assistant" ? "Continue generating" : "Generate response"
                   ] })
                 ] }),
-                error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError(error) }),
-                keyPhase === "prompt_key" && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-phone-form", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("label", { className: "hsk-cb-phone-label", children: "Paste your public id \u2014 or create one" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError(error) }),
+                keyPhase === "prompt_key" && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-phone-form", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("label", { className: "hsk-cb-phone-label", children: "Paste your public id \u2014 or create one" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                       "input",
                       {
                         type: "text",
@@ -2225,49 +2482,49 @@ function ChatModal({
                         autoFocus: true
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8 }, children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleUseExistingKey, disabled: !keyInput.trim(), children: "Use my id" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleCreateKey, disabled: minting, children: minting ? "Creating\u2026" : "I'm new \u2014 create one" })
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", gap: 8 }, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleUseExistingKey, disabled: !keyInput.trim(), children: "Use my id" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-phone-submit", onClick: handleCreateKey, disabled: minting, children: minting ? "Creating\u2026" : "I'm new \u2014 create one" })
                     ] })
                   ] }) }) })
                 ] }),
-                mintedKey && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { padding: "12px 14px", border: "1px solid var(--hsk-border, #e5e5e5)", borderRadius: "var(--hsk-border-radius, 0px)", display: "flex", flexDirection: "column", gap: 12 }, children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your secret \u2014 shown only once" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { style: { display: "block", fontSize: 14, fontWeight: 700, marginBottom: 6, wordBreak: "break-all" }, children: mintedKey }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedKey, "secret"), children: copied === "secret" ? "Copied" : "Copy secret" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Keep it private \u2014 use it to unlock your memory at mimi.akropolys.cloud. If lost, the memory is lost with it." })
+                mintedKey && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { padding: "12px 14px", border: "1px solid var(--hsk-border, #e5e5e5)", borderRadius: "var(--hsk-border-radius, 0px)", display: "flex", flexDirection: "column", gap: 12 }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your secret \u2014 shown only once" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { style: { display: "block", fontSize: 14, fontWeight: 700, marginBottom: 6, wordBreak: "break-all" }, children: mintedKey }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedKey, "secret"), children: copied === "secret" ? "Copied" : "Copy secret" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Keep it private \u2014 use it to unlock your memory at mimi.akropolys.cloud. If lost, the memory is lost with it." })
                       ] })
                     ] }),
-                    mintedPub && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your public id" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { style: { display: "block", fontSize: 13, fontWeight: 600, marginBottom: 6, wordBreak: "break-all", opacity: 0.85 }, children: mintedPub }),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedPub, "pub"), children: copied === "pub" ? "Copied" : "Copy id" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Paste this on any site to keep saving to the same memory." })
+                    mintedPub && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your public id" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { style: { display: "block", fontSize: 13, fontWeight: 600, marginBottom: 6, wordBreak: "break-all", opacity: 0.85 }, children: mintedPub }),
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedPub, "pub"), children: copied === "pub" ? "Copied" : "Copy id" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Paste this on any site to keep saving to the same memory." })
                       ] })
                     ] }),
-                    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { fontSize: 11, opacity: 0.6 }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { fontSize: 11, opacity: 0.6 }, children: [
                       "Hidden in ",
                       keyCountdown,
                       "s."
                     ] })
                   ] }) }) })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: bottomRef, style: { height: 1 } })
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: bottomRef, style: { height: 1 } })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
-                showAtPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
+                showAtPicker && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   AtPickerMenu,
                   {
                     onSelect: handleSelectExtension,
                     onDismiss: () => setShowAtPicker(false)
                   }
                 ),
-                showKikuPicker && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                showKikuPicker && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   KikuPickerMenu,
                   {
                     sources,
@@ -2280,9 +2537,9 @@ function ChatModal({
                     onDismiss: () => setShowKikuPicker(false)
                   }
                 ),
-                attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-img-strip", children: attachments.map((att, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-img-thumb-wrap", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("img", { src: att.data, alt: `attachment ${i + 1}`, className: "hsk-cb-img-thumb" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                attachments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-img-strip", children: attachments.map((att, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-img-thumb-wrap", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: att.data, alt: `attachment ${i + 1}`, className: "hsk-cb-img-thumb" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "button",
                     {
                       className: "hsk-cb-img-thumb-remove",
@@ -2292,8 +2549,8 @@ function ChatModal({
                     }
                   )
                 ] }, i)) }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "hsk-cb-input-box", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-input-box", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "input",
                     {
                       ref: imageInputRef,
@@ -2304,7 +2561,7 @@ function ChatModal({
                       onChange: (e) => handleImageFiles(e.target.files)
                     }
                   ),
-                  enableVision && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  enableVision && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "button",
                     {
                       className: "hsk-cb-attach-btn",
@@ -2312,10 +2569,10 @@ function ChatModal({
                       disabled: loading,
                       "aria-label": "Attach image",
                       title: "Attach image",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(PaperclipIcon, {})
+                      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(PaperclipIcon, {})
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "textarea",
                     {
                       ref: textareaRef,
@@ -2329,7 +2586,7 @@ function ChatModal({
                       autoFocus: true
                     }
                   ),
-                  hasSpeechAPI && enableVoice && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+                  hasSpeechAPI && enableVoice && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
                     "button",
                     {
                       className: cn(
@@ -2342,32 +2599,32 @@ function ChatModal({
                       "aria-label": voiceState === "idle" ? "Start voice input" : "Stop recording",
                       title: voiceState === "idle" ? "Voice input" : "Stop",
                       children: [
-                        voiceState === "listening" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MicIcon2, {}),
-                        voiceState === "listening" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-mic-pulse" })
+                        voiceState === "listening" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MicOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MicIcon2, {}),
+                        voiceState === "listening" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-mic-pulse" })
                       ]
                     }
                   ),
-                  loading || streaming ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  loading || streaming ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "button",
                     {
                       className: cn("hsk-cb-send", "hsk-cb-send--stop", classNames.sendButton),
                       onClick: stop,
                       "aria-label": "Stop generating",
                       title: "Stop generating",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(StopIcon, {})
+                      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(StopIcon, {})
                     }
-                  ) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "button",
                     {
                       className: cn("hsk-cb-send", classNames.sendButton),
                       onClick: () => handleSend(),
                       disabled: !input.trim() && attachments.length === 0,
                       "aria-label": "Send message",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ArrowUpIcon2, {})
+                      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ArrowUpIcon2, {})
                     }
                   )
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "hsk-cb-hint", children: "kiku \xB7 searches the whole catalogue in real time" })
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-hint", children: "kiku \xB7 searches the whole catalogue in real time" })
               ] })
             ] })
           ]
@@ -2393,9 +2650,9 @@ function KikuButton({
   enableVision = false,
   visionCategoryHint
 }) {
-  const [open, setOpen] = (0, import_react5.useState)(false);
-  const [mounted, setMounted] = (0, import_react5.useState)(false);
-  (0, import_react5.useEffect)(() => {
+  const [open, setOpen] = (0, import_react6.useState)(false);
+  const [mounted, setMounted] = (0, import_react6.useState)(false);
+  (0, import_react6.useEffect)(() => {
     setMounted(true);
     if (typeof window !== "undefined" && !window.__akropolys_nav_patched) {
       window.__akropolys_nav_patched = true;
@@ -2429,8 +2686,8 @@ function KikuButton({
     ...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
     ...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
   } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "button",
       {
         className: cn("hsk-cb-btn", classNames.button, className),
@@ -2439,13 +2696,13 @@ function KikuButton({
         "data-hsk-theme": hskThemeAttr,
         "aria-label": "Open AI chat",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "hsk-cb-btn-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SparkleIcon2, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-cb-btn-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon2, {}) }),
           label !== void 0 ? label : null
         ]
       }
     ),
     open && mounted && (0, import_react_dom.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         ChatModal,
         {
           title,
@@ -2470,11 +2727,11 @@ function KikuButton({
 }
 
 // src/components/Sparkle.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_react_dom2 = require("react-dom");
 var import_sdk7 = require("@akropolys/sdk");
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
   "svg",
   {
     className: cn("hsk-brand-mark", className),
@@ -2483,19 +2740,19 @@ var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */ (0, import_jsx_
     viewBox: "0 0 100 100",
     xmlns: "http://www.w3.org/2000/svg",
     "aria-label": "kiku",
-    children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("circle", { cx: "55", cy: "82", r: "3.4" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "55", cy: "82", r: "3.4" })
     ] })
   }
 );
-var CloseIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+var CloseIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
 ] });
-var ArrowUpIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "m5 12 7-7 7 7" }),
-  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 19V5" })
+var ArrowUpIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "m5 12 7-7 7 7" }),
+  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M12 19V5" })
 ] });
 var getFriendlyError2 = (err) => {
   let str = "";
@@ -2529,17 +2786,17 @@ function SparkleModal({
   product: initialProduct
 }) {
   const client = (0, import_sdk7.useAkropolysContext)();
-  const [fetchedProduct, setFetchedProduct] = (0, import_react6.useState)(null);
+  const [fetchedProduct, setFetchedProduct] = (0, import_react7.useState)(null);
   const displayProduct = initialProduct || fetchedProduct;
   const { results, loading: searchLoading, search } = (0, import_sdk7.useSearch)({ type: "vector" });
   const { messages, sources, loading: chatLoading, error: chatError, send } = (0, import_sdk7.useKiku)();
-  const [chatInput, setChatInput] = (0, import_react6.useState)("");
-  const [isMobile, setIsMobile] = (0, import_react6.useState)(false);
-  const [showSpecs, setShowSpecs] = (0, import_react6.useState)(false);
-  const [collapseSimilar, setCollapseSimilar] = (0, import_react6.useState)(false);
-  const chatBottomRef = (0, import_react6.useRef)(null);
-  const chatTextareaRef = (0, import_react6.useRef)(null);
-  (0, import_react6.useEffect)(() => {
+  const [chatInput, setChatInput] = (0, import_react7.useState)("");
+  const [isMobile, setIsMobile] = (0, import_react7.useState)(false);
+  const [showSpecs, setShowSpecs] = (0, import_react7.useState)(false);
+  const [collapseSimilar, setCollapseSimilar] = (0, import_react7.useState)(false);
+  const chatBottomRef = (0, import_react7.useRef)(null);
+  const chatTextareaRef = (0, import_react7.useRef)(null);
+  (0, import_react7.useEffect)(() => {
     if (!initialProduct && !fetchedProduct) {
       client.api.searchVector(productName, 1).then((res) => {
         if (res.results && res.results.length > 0) {
@@ -2549,7 +2806,7 @@ function SparkleModal({
     }
     search(productName, limit);
   }, [productName, initialProduct, fetchedProduct, client, limit, search]);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     const handleResize = () => setIsMobile(window.innerWidth <= 768);
     handleResize();
     if (typeof window !== "undefined") {
@@ -2557,17 +2814,17 @@ function SparkleModal({
       return () => window.removeEventListener("resize", handleResize);
     }
   }, []);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     if (results.length > 0) onResult?.(results);
   }, [results, onResult]);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     const h = (e) => {
       if (e.key === "Escape") onClose();
     };
     document.addEventListener("keydown", h);
     return () => document.removeEventListener("keydown", h);
   }, [onClose]);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     chatBottomRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages, chatLoading]);
   const blurVal = typeof backdropBlur === "number" ? `${backdropBlur}px` : backdropBlur ?? "16px";
@@ -2621,7 +2878,7 @@ Question: ${q}`;
     }
   ] : messages;
   if (isMobile) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "div",
       {
         className: cn("hsk-sp-backdrop hsk-sp-mobile-view", classNames.backdrop),
@@ -2632,13 +2889,13 @@ Question: ${q}`;
           background: bg ?? void 0,
           ...customStyles
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("hsk-sp-card hsk-sp-fullscreen hsk-sp-mobile-card", classNames.card), onClick: (e) => e.stopPropagation(), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-header-body", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-header-title-row", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
-                displayProduct && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: cn("hsk-sp-card hsk-sp-fullscreen hsk-sp-mobile-card", classNames.card), onClick: (e) => e.stopPropagation(), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-header", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-header-body", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-header-title-row", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
+                displayProduct && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                   "button",
                   {
                     type: "button",
@@ -2648,32 +2905,32 @@ Question: ${q}`;
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-header-sub", children: "kiku" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-header-sub", children: "kiku" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon2, {}) })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CloseIcon2, {}) })
           ] }),
-          searchLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-bar" }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-chat-container", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-msgs", children: [
+          searchLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-bar" }),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-chat-container", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-msgs", children: [
               displayMessages.map((msg, idx) => {
                 const isUser = msg.role === "user";
-                return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-body", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }),
-                    idx === 0 && displayProduct && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-attachment-deck", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-main-card", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-main-card-img", children: displayProduct.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: "\xF0\u0178\u203A\x8D" }) }),
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-main-card-info", children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-main-card-brand", children: displayProduct.brand || displayProduct.category || "Product" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-main-card-name", children: displayProduct.name }),
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-main-card-price", children: [
+                return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-ai-body", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }),
+                    idx === 0 && displayProduct && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-attachment-deck", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-main-card", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-main-card-img", children: displayProduct.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "\xF0\u0178\u203A\x8D" }) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-main-card-info", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-main-card-brand", children: displayProduct.brand || displayProduct.category || "Product" }),
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-main-card-name", children: displayProduct.name }),
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-main-card-price", children: [
                             displayProduct.currency ?? "KES",
                             " ",
                             parseFloat(displayProduct.price?.replace(/[^0-9.]/g, "") || "0").toLocaleString()
                           ] })
                         ] }),
-                        (displayProduct.specs && Object.keys(displayProduct.specs).length > 0 || displayProduct.description) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                        (displayProduct.specs && Object.keys(displayProduct.specs).length > 0 || displayProduct.description) && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                           "button",
                           {
                             type: "button",
@@ -2692,21 +2949,21 @@ Question: ${q}`;
                           }
                         );
                         if (similarProducts.length === 0) return null;
-                        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-inline", children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-title", children: "Similar Products" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-list", children: similarProducts.map((r) => {
+                        return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-inline", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-title", children: "Similar Products" }),
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-list", children: similarProducts.map((r) => {
                             const price = parseFloat(r.entity.price?.replace(/[^0-9.]/g, "") || "0");
                             const currency = r.entity.currency ?? "KES";
-                            return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                            return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
                               "div",
                               {
                                 className: "hsk-sp-mobile-similar-carousel-item",
                                 onClick: () => handleNav(r),
                                 children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-img", children: r.entity.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: "\xF0\u0178\u203A\x8D" }) }),
-                                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-meta", children: [
-                                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-name", title: r.entity.name, children: r.entity.name }),
-                                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-price", children: [
+                                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-img", children: r.entity.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "\xF0\u0178\u203A\x8D" }) }),
+                                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-meta", children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-similar-carousel-name", title: r.entity.name, children: r.entity.name }),
+                                    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-similar-carousel-price", children: [
                                       currency,
                                       " ",
                                       price.toLocaleString()
@@ -2723,19 +2980,19 @@ Question: ${q}`;
                   ] })
                 ] }) }, idx);
               }),
-              chatLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-typing-row", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-typing", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" })
+              chatLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-typing-row", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-typing", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" })
                 ] })
               ] }),
-              chatError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: chatBottomRef, style: { height: 1 } })
+              chatError && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { ref: chatBottomRef, style: { height: 1 } })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-input-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-input-box", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-input-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-input-box", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 "textarea",
                 {
                   ref: chatTextareaRef,
@@ -2748,34 +3005,34 @@ Question: ${q}`;
                   disabled: chatLoading
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 "button",
                 {
                   className: "hsk-cb-send",
                   onClick: () => handleSend(),
                   disabled: !chatInput.trim() || chatLoading,
                   "aria-label": "Send message",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ArrowUpIcon3, {})
+                  children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ArrowUpIcon3, {})
                 }
               )
             ] }) })
           ] }),
-          showSpecs && displayProduct && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-mobile-specs-overlay", onClick: () => setShowSpecs(false), children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-specs-drawer", onClick: (e) => e.stopPropagation(), children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-specs-header", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h3", { children: "Specifications" }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", onClick: () => setShowSpecs(false), children: "Close" })
+          showSpecs && displayProduct && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-mobile-specs-overlay", onClick: () => setShowSpecs(false), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-specs-drawer", onClick: (e) => e.stopPropagation(), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-specs-header", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h3", { children: "Specifications" }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { type: "button", onClick: () => setShowSpecs(false), children: "Close" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-specs-body", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { className: "hsk-sp-mobile-specs-title", children: displayProduct.name }),
-              displayProduct.description && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-specs-desc", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h5", { children: "Description" }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: displayProduct.description })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-specs-body", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h4", { className: "hsk-sp-mobile-specs-title", children: displayProduct.name }),
+              displayProduct.description && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-specs-desc", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h5", { children: "Description" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { children: displayProduct.description })
               ] }),
-              displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-specs-list", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h5", { children: "Details" }),
-                Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-mobile-spec-row", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-mobile-spec-label", children: key }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-mobile-spec-value", children: val })
+              displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-specs-list", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h5", { children: "Details" }),
+                Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-mobile-spec-row", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-mobile-spec-label", children: key }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-mobile-spec-value", children: val })
                 ] }, key))
               ] })
             ] })
@@ -2784,7 +3041,7 @@ Question: ${q}`;
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     "div",
     {
       className: cn("hsk-sp-backdrop", classNames.backdrop),
@@ -2795,65 +3052,65 @@ Question: ${q}`;
         background: bg ?? void 0,
         ...customStyles
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cn("hsk-sp-card hsk-sp-fullscreen", classNames.card), onClick: (e) => e.stopPropagation(), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-header", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-header-body", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-header-sub", children: "Ask questions, compare specs, or check similar products" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: cn("hsk-sp-card hsk-sp-fullscreen", classNames.card), onClick: (e) => e.stopPropagation(), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-header", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-header-body", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-header-sub", children: "Ask questions, compare specs, or check similar products" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon2, {}) })
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CloseIcon2, {}) })
         ] }),
-        searchLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-bar" }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-body", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-details-pane", children: [
-            displayProduct && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-product-profile-container", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-product-profile", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-details-imgwrap", children: displayProduct.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-details-meta", children: [
-                  displayProduct.brand && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-brand", children: displayProduct.brand }),
-                  displayProduct.category && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-cat", children: displayProduct.category }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h2", { className: "hsk-sp-details-name", children: displayProduct.name }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-item-price-row", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-currency", children: displayProduct.currency ?? "KES" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-price", children: parseFloat(displayProduct.price?.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
-                    displayProduct.originalPrice && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-original-price", children: parseFloat(displayProduct.originalPrice.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
-                    displayProduct.discount && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-sp-item-discount", children: [
+        searchLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-bar" }),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-body", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-details-pane", children: [
+            displayProduct && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-product-profile-container", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-product-profile", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-details-imgwrap", children: displayProduct.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-details-meta", children: [
+                  displayProduct.brand && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-brand", children: displayProduct.brand }),
+                  displayProduct.category && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-cat", children: displayProduct.category }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h2", { className: "hsk-sp-details-name", children: displayProduct.name }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-item-price-row", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-currency", children: displayProduct.currency ?? "KES" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-price", children: parseFloat(displayProduct.price?.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
+                    displayProduct.originalPrice && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-original-price", children: parseFloat(displayProduct.originalPrice.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
+                    displayProduct.discount && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "hsk-sp-item-discount", children: [
                       "(",
                       displayProduct.discount,
                       ")"
                     ] })
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-item-meta-badges", children: [
-                    displayProduct.rating && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-rating", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-item-meta-badges", children: [
+                    displayProduct.rating && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-rating", children: [
                       "\xE2\u02DC\u2026 ",
                       parseFloat(displayProduct.rating.toString()).toFixed(1),
                       " ",
                       displayProduct.reviewCount ? `(${displayProduct.reviewCount})` : ""
                     ] }),
-                    displayProduct.availability && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: `hsk-sp-meta-badge hsk-sp-meta-badge-avail ${displayProduct.availability.toLowerCase().includes("in") ? "in-stock" : "out-stock"}`, children: displayProduct.availability }),
-                    displayProduct.stock && !displayProduct.availability && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-stock", children: [
+                    displayProduct.availability && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: `hsk-sp-meta-badge hsk-sp-meta-badge-avail ${displayProduct.availability.toLowerCase().includes("in") ? "in-stock" : "out-stock"}`, children: displayProduct.availability }),
+                    displayProduct.stock && !displayProduct.availability && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-stock", children: [
                       "Stock: ",
                       displayProduct.stock
                     ] })
                   ] })
                 ] })
               ] }),
-              displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-specs-horizontal", children: Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-spec-item-horizontal", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "hsk-sp-spec-label-horizontal", children: [
+              displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-specs-horizontal", children: Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-spec-item-horizontal", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "hsk-sp-spec-label-horizontal", children: [
                   key,
                   ":"
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-spec-value-horizontal", title: val, children: val })
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-spec-value-horizontal", title: val, children: val })
               ] }, key)) }),
-              displayProduct.description && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-details-desc", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h4", { children: "Description" }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: displayProduct.description })
+              displayProduct.description && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-details-desc", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h4", { children: "Description" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { children: displayProduct.description })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-similar-section", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h3", { children: "Similar Products" }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-results", children: (() => {
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-similar-section", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h3", { children: "Similar Products" }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-results", children: (() => {
                 const similarProducts = results.filter(
                   (r) => {
                     const isSameName = !!(r.entity.name && displayProduct?.name && r.entity.name.toLowerCase() === displayProduct.name.toLowerCase());
@@ -2862,29 +3119,29 @@ Question: ${q}`;
                   }
                 );
                 if (!searchLoading && similarProducts.length === 0) {
-                  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-empty", children: "No similar products found." });
+                  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-empty", children: "No similar products found." });
                 }
                 return similarProducts.map((r, i) => {
                   const price = parseFloat(r.entity.price?.replace(/[^0-9.]/g, "") || "0");
                   const currency = r.entity.currency ?? "KES";
-                  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
                     "div",
                     {
                       className: cn("hsk-sp-item", classNames.item),
                       style: { animationDelay: `${i * 55}ms`, cursor: "pointer" },
                       onClick: () => handleNav(r),
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-img-wrap", children: r.entity.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-item-body", children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { children: [
-                            r.entity.category && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-item-cat", children: r.entity.category }),
-                            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-item-name", title: r.entity.name, children: r.entity.name })
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-img-wrap", children: r.entity.images?.[0] ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-item-body", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+                            r.entity.category && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-item-cat", children: r.entity.category }),
+                            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-item-name", title: r.entity.name, children: r.entity.name })
                           ] }),
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-item-price-row", children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-currency", children: currency }),
-                            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-item-price", children: price.toLocaleString() })
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-item-price-row", children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-currency", children: currency }),
+                            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-item-price", children: price.toLocaleString() })
                           ] }),
-                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-actions", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-actions", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                             "button",
                             {
                               className: "hsk-sp-action hsk-sp-action-primary",
@@ -2904,29 +3161,29 @@ Question: ${q}`;
               })() })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-sp-chat-pane", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-msgs", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-sp-chat-pane", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-msgs", children: [
               displayMessages.map((msg, idx) => {
                 const isUser = msg.role === "user";
-                return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }) })
+                return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-ai-msg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }) })
                 ] }) }, idx);
               }),
-              chatLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-typing-row", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {}) }),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-typing", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-dot" })
+              chatLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-typing-row", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-typing", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-dot" })
                 ] })
               ] }),
-              chatError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: chatBottomRef, style: { height: 1 } })
+              chatError && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { ref: chatBottomRef, style: { height: 1 } })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "hsk-cb-input-box", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-input-wrap", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hsk-cb-input-box", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                   "textarea",
                   {
                     ref: chatTextareaRef,
@@ -2939,22 +3196,22 @@ Question: ${q}`;
                     disabled: chatLoading
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                   "button",
                   {
                     className: "hsk-cb-send",
                     onClick: () => handleSend(),
                     disabled: !chatInput.trim() || chatLoading,
                     "aria-label": "Send message",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ArrowUpIcon3, {})
+                    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ArrowUpIcon3, {})
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-cb-hint", children: "Akropolys \xB7 instant product knowledge" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-cb-hint", children: "Akropolys \xB7 instant product knowledge" })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "hsk-sp-footer", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "hsk-sp-esc", children: "Esc to close" }) })
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "hsk-sp-footer", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hsk-sp-esc", children: "Esc to close" }) })
       ] })
     }
   );
@@ -2972,9 +3229,9 @@ function Sparkle({
   product,
   children
 }) {
-  const [open, setOpen] = (0, import_react6.useState)(false);
-  const [mounted, setMounted] = (0, import_react6.useState)(false);
-  (0, import_react6.useEffect)(() => {
+  const [open, setOpen] = (0, import_react7.useState)(false);
+  const [mounted, setMounted] = (0, import_react7.useState)(false);
+  (0, import_react7.useEffect)(() => {
     setMounted(true);
   }, []);
   const customStyles = {
@@ -2984,8 +3241,8 @@ function Sparkle({
     ...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
     ...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "button",
       {
         className: cn("hsk-sp-btn", classNames.button, className),
@@ -2993,11 +3250,11 @@ function Sparkle({
         style: customStyles,
         title: "Find similar products",
         "aria-label": "Find similar products",
-        children: children || /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SparkleIcon3, {})
+        children: children || /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SparkleIcon3, {})
       }
     ),
     open && mounted && (0, import_react_dom2.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         SparkleModal,
         {
           productName,