@blinq_ai/widget 0.1.1 → 0.1.2

package/dist/browser.cjs

@@ -573,6 +573,12 @@ function collectNormalizedPageContext() {
 }
 
 // src/page-tools.ts
+var DEFAULT_ACTION_POLICY = {
+  actions_enabled: true,
+  action_mode: "execute_with_confirmation",
+  pointer_overlay_enabled: true
+};
+var GUIDANCE_SAFE_TOOL_NAMES = /* @__PURE__ */ new Set(["blinq.scroll_to_element"]);
 function isBrowser2() {
   return typeof window !== "undefined" && typeof document !== "undefined";
 }
@@ -669,6 +675,12 @@ function findTarget(selector) {
   }
   return target;
 }
+function shouldRequestConfirmation(toolName, readOnly) {
+  if (readOnly) {
+    return false;
+  }
+  return !GUIDANCE_SAFE_TOOL_NAMES.has(toolName);
+}
 function isDuplicateNativeToolError(error) {
   if (!(error instanceof Error)) {
     return false;
@@ -830,6 +842,15 @@ function buildSemanticToolDefinition(descriptor) {
   }
   return null;
 }
+function selectorFromArguments(argumentsPayload) {
+  for (const key of ["selector", "field_selector", "submit_selector", "form_selector"]) {
+    const value = argumentsPayload[key];
+    if (typeof value === "string" && value.trim()) {
+      return value.trim();
+    }
+  }
+  return null;
+}
 function detectNativeWebMcpSupport() {
   if (!isBrowser2() || !window.isSecureContext) {
     return false;
@@ -845,10 +866,17 @@ var PageToolRegistry = class {
   nativeToolsActive = false;
   highlightLayer = null;
   highlightTimer = null;
+  actionPolicy = { ...DEFAULT_ACTION_POLICY };
   constructor(confirmationHandler) {
     this.confirmationHandler = confirmationHandler;
     this.refreshToolCatalog();
   }
+  setActionPolicy(nextPolicy) {
+    this.actionPolicy = {
+      ...DEFAULT_ACTION_POLICY,
+      ...nextPolicy
+    };
+  }
   buildBaseTools() {
     const tools = /* @__PURE__ */ new Map();
     tools.set("blinq.read_visible_page_context", {
@@ -1022,7 +1050,7 @@ var PageToolRegistry = class {
   }
   getToolCapabilities() {
     this.refreshToolCatalog();
-    return Array.from(this.tools.values()).map((tool) => tool.capability);
+    return Array.from(this.tools.values()).filter((tool) => this.isToolAllowed(tool)).map((tool) => tool.capability);
   }
   clearHighlights() {
     if (this.highlightTimer !== null) {
@@ -1048,13 +1076,52 @@ var PageToolRegistry = class {
     this.highlightLayer = layer;
     return layer;
   }
+  ensureHighlightStyle() {
+    if (document.getElementById("blinq-highlight-style")) {
+      return;
+    }
+    const style = document.createElement("style");
+    style.id = "blinq-highlight-style";
+    style.textContent = `
+      @keyframes blinq-highlight-pulse {
+        0%, 100% { opacity: 0.55; transform: scale(1); }
+        50% { opacity: 1; transform: scale(1.02); }
+      }
+
+      @keyframes blinq-highlight-ripple {
+        0% { opacity: 0.36; transform: translate(-50%, -50%) scale(0.8); }
+        100% { opacity: 0; transform: translate(-50%, -50%) scale(1.7); }
+      }
+
+      @keyframes blinq-pointer-bob {
+        0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
+        50% { transform: translate3d(0, -2px, 0) scale(1.03); }
+      }
+    `;
+    document.head.appendChild(style);
+  }
   highlightTargets(targets, options) {
     if (!isBrowser2() || targets.length === 0) {
       return false;
     }
     this.clearHighlights();
     const layer = this.ensureHighlightLayer();
+    this.ensureHighlightStyle();
     let highlightedCount = 0;
+    let primaryRect = null;
+    const backdrop = document.createElement("div");
+    Object.assign(backdrop.style, {
+      position: "fixed",
+      inset: "0",
+      background: "rgba(15, 23, 42, 0.08)",
+      backdropFilter: "blur(1.5px)",
+      opacity: "0",
+      transition: "opacity 180ms ease"
+    });
+    layer.appendChild(backdrop);
+    window.requestAnimationFrame(() => {
+      backdrop.style.opacity = "1";
+    });
     for (const target of targets) {
       if (!target.selector) {
         continue;
@@ -1068,21 +1135,30 @@ var PageToolRegistry = class {
       if (!element) {
         continue;
       }
+      if (!primaryRect) {
+        element.scrollIntoView({
+          block: "center",
+          inline: "nearest"
+        });
+      }
       const rect = element.getBoundingClientRect();
       if (rect.width <= 0 || rect.height <= 0) {
         continue;
       }
+      if (!primaryRect) {
+        primaryRect = rect;
+      }
       const frame = document.createElement("div");
       Object.assign(frame.style, {
         position: "fixed",
-        left: `${Math.max(rect.left - 6, 4)}px`,
-        top: `${Math.max(rect.top - 6, 4)}px`,
-        width: `${Math.max(rect.width + 12, 18)}px`,
-        height: `${Math.max(rect.height + 12, 18)}px`,
-        border: "2px solid rgba(17, 17, 17, 0.92)",
-        borderRadius: "16px",
-        background: "rgba(17, 17, 17, 0.05)",
-        boxShadow: "0 0 0 1px rgba(255, 255, 255, 0.85), 0 18px 38px rgba(17, 17, 17, 0.14)",
+        left: `${Math.max(rect.left - 8, 4)}px`,
+        top: `${Math.max(rect.top - 8, 4)}px`,
+        width: `${Math.max(rect.width + 16, 24)}px`,
+        height: `${Math.max(rect.height + 16, 24)}px`,
+        border: "3px solid rgba(17, 17, 17, 0.94)",
+        borderRadius: "18px",
+        background: "rgba(255, 255, 255, 0.16)",
+        boxShadow: "0 0 0 1px rgba(255, 255, 255, 0.9), 0 24px 48px rgba(15, 23, 42, 0.18)",
         opacity: "0",
         transform: "scale(0.985)",
         transition: "opacity 180ms ease, transform 180ms ease"
@@ -1090,9 +1166,9 @@ var PageToolRegistry = class {
       const glow = document.createElement("div");
       Object.assign(glow.style, {
         position: "absolute",
-        inset: "-8px",
-        borderRadius: "20px",
-        border: "1px solid rgba(17, 17, 17, 0.14)",
+        inset: "-10px",
+        borderRadius: "22px",
+        border: "1px solid rgba(37, 99, 235, 0.22)",
         animation: "blinq-highlight-pulse 1.2s ease-in-out infinite"
       });
       frame.appendChild(glow);
@@ -1101,15 +1177,15 @@ var PageToolRegistry = class {
         badge.textContent = target.label;
         Object.assign(badge.style, {
           position: "absolute",
-          top: "-14px",
+          top: "-16px",
           left: "10px",
-          maxWidth: "min(220px, 70vw)",
-          padding: "4px 10px",
+          maxWidth: "min(260px, 70vw)",
+          padding: "6px 12px",
           borderRadius: "999px",
           background: "#111111",
           color: "#ffffff",
           fontFamily: '"Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
-          fontSize: "11px",
+          fontSize: "12px",
           fontWeight: "600",
           lineHeight: "1.3",
           whiteSpace: "nowrap",
@@ -1126,16 +1202,57 @@ var PageToolRegistry = class {
       });
       highlightedCount += 1;
     }
-    if (!document.getElementById("blinq-highlight-style")) {
-      const style = document.createElement("style");
-      style.id = "blinq-highlight-style";
-      style.textContent = `
-        @keyframes blinq-highlight-pulse {
-          0%, 100% { opacity: 0.55; transform: scale(1); }
-          50% { opacity: 1; transform: scale(1.02); }
-        }
+    if (this.actionPolicy.pointer_overlay_enabled && primaryRect) {
+      const pointer = document.createElement("div");
+      pointer.setAttribute("data-blinq-pointer", options?.interaction ?? "explain");
+      pointer.innerHTML = `
+        <div style="position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,0.92);box-shadow:0 14px 28px rgba(15,23,42,0.18);"></div>
+        <svg viewBox="0 0 40 40" width="40" height="40" fill="none" aria-hidden="true" style="position:relative;z-index:1;">
+          <path d="M8 5L28 22H18.4L23.2 34.8L17.8 36.8L13 24H6.6L8 5Z" fill="#111111"/>
+          <path d="M8 5L28 22H18.4L23.2 34.8L17.8 36.8L13 24H6.6L8 5Z" stroke="#ffffff" stroke-width="1.4" stroke-linejoin="round"/>
+        </svg>
       `;
-      document.head.appendChild(style);
+      Object.assign(pointer.style, {
+        position: "fixed",
+        left: `${Math.max(primaryRect.left - 72, 12)}px`,
+        top: `${Math.max(primaryRect.bottom + 44, 12)}px`,
+        width: "40px",
+        height: "40px",
+        zIndex: "2147483647",
+        opacity: "0",
+        transform: "translate3d(0, 0, 0) scale(0.92)",
+        transition: "left 380ms cubic-bezier(.22,1,.36,1), top 380ms cubic-bezier(.22,1,.36,1), opacity 180ms ease, transform 380ms cubic-bezier(.22,1,.36,1)",
+        filter: "drop-shadow(0 16px 28px rgba(15, 23, 42, 0.2))",
+        animation: "blinq-pointer-bob 1.1s ease-in-out infinite"
+      });
+      layer.appendChild(pointer);
+      const pointerTargetLeft = Math.max(primaryRect.left + 14, 8);
+      const pointerTargetTop = Math.max(primaryRect.top + 14, 8);
+      window.requestAnimationFrame(() => {
+        pointer.style.opacity = "1";
+        pointer.style.left = `${pointerTargetLeft}px`;
+        pointer.style.top = `${pointerTargetTop}px`;
+        pointer.style.transform = "translate3d(0, 0, 0) scale(1)";
+      });
+      if (options?.interaction === "execute") {
+        const ripple = document.createElement("div");
+        Object.assign(ripple.style, {
+          position: "fixed",
+          left: `${primaryRect.left + Math.min(primaryRect.width, 32) / 2}px`,
+          top: `${primaryRect.top + Math.min(primaryRect.height, 32) / 2}px`,
+          width: "34px",
+          height: "34px",
+          borderRadius: "999px",
+          border: "3px solid rgba(17, 17, 17, 0.58)",
+          background: "rgba(17, 17, 17, 0.12)",
+          pointerEvents: "none",
+          opacity: "0",
+          transform: "translate(-50%, -50%) scale(0.8)",
+          animation: "blinq-highlight-ripple 560ms ease-out 1 forwards",
+          animationDelay: "320ms"
+        });
+        layer.appendChild(ripple);
+      }
     }
     if (highlightedCount === 0) {
       this.clearHighlights();
@@ -1146,8 +1263,38 @@ var PageToolRegistry = class {
     }, options?.durationMs ?? 2200);
     return true;
   }
+  isToolAllowed(tool) {
+    if (tool.capability.read_only) {
+      return true;
+    }
+    if (GUIDANCE_SAFE_TOOL_NAMES.has(tool.capability.name)) {
+      return this.actionPolicy.actions_enabled;
+    }
+    return this.actionPolicy.actions_enabled && this.actionPolicy.action_mode === "execute_with_confirmation";
+  }
+  async previewToolRequest(request, options) {
+    const selector = selectorFromArguments(request.arguments);
+    if (!selector) {
+      return false;
+    }
+    const label = (request.target_summary || request.display_name || "").trim() || void 0;
+    const highlighted = this.highlightTargets(
+      [{ selector, label }],
+      {
+        durationMs: options?.durationMs ?? (options?.interaction === "execute" ? 1600 : 2200),
+        interaction: options?.interaction ?? "explain"
+      }
+    );
+    if (!highlighted) {
+      return false;
+    }
+    await new Promise(
+      (resolve) => window.setTimeout(resolve, options?.interaction === "execute" ? 520 : 240)
+    );
+    return true;
+  }
   canExecuteWriteTools() {
-    return isBrowser2();
+    return isBrowser2() && this.actionPolicy.actions_enabled && this.actionPolicy.action_mode === "execute_with_confirmation";
   }
   async executeTool(request) {
     let tool = this.tools.get(request.tool_name);
@@ -1163,7 +1310,22 @@ var PageToolRegistry = class {
     }
     const displayName = request.display_name ?? tool.capability.name;
     const targetSummary = request.target_summary ?? tool.describeTarget?.(request.arguments) ?? tool.capability.description;
-    const requiresConfirmation = request.requires_confirmation ?? !tool.capability.read_only;
+    const requiresConfirmation = request.requires_confirmation ?? shouldRequestConfirmation(request.tool_name, tool.capability.read_only);
+    if (request.tool_name !== "blinq.highlight_element") {
+      await this.previewToolRequest(request, {
+        interaction: tool.capability.read_only ? "explain" : "execute"
+      });
+    }
+    if (!tool.capability.read_only && !this.isToolAllowed(tool)) {
+      return {
+        status: "success",
+        result: {
+          success: true,
+          guided: true,
+          preview_only: true
+        }
+      };
+    }
     if (!tool.capability.read_only && requiresConfirmation) {
       const confirmed = await this.confirmationHandler({
         displayName,
@@ -1205,6 +1367,9 @@ var PageToolRegistry = class {
     this.refreshToolCatalog();
     this.unregisterNativeTools();
     for (const [toolName, tool] of this.tools) {
+      if (!this.isToolAllowed(tool)) {
+        continue;
+      }
       const controller = new AbortController();
       try {
         modelContext.registerTool(
@@ -1247,6 +1412,7 @@ var PageToolRegistry = class {
 
 // src/embed-shell.tsx
 var React = __toESM(require("react"), 1);
+var import_lucide_react = require("lucide-react");
 var import_react = require("@assistant-ui/react");
 var import_jsx_runtime = require("react/jsx-runtime");
 function cn(...values) {
@@ -1303,87 +1469,44 @@ function Badge({
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cn(badgeClassName(variant), className), ...props });
 }
 function LauncherIcon() {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    "svg",
-    {
-      viewBox: "0 0 24 24",
-      width: "18",
-      height: "18",
-      fill: "none",
-      "aria-hidden": "true",
-      className: "blinq-launcher-agent",
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "blinq-agent-orbit", cx: "12", cy: "12", r: "9" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "blinq-agent-spark", cx: "18.6", cy: "8.2", r: "1.2" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "path",
-          {
-            className: "blinq-agent-antenna",
-            d: "M12 4.8V6.8",
-            stroke: "currentColor",
-            strokeWidth: "1.6",
-            strokeLinecap: "round"
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "blinq-agent-antenna-dot", cx: "12", cy: "4.1", r: "1.1", fill: "currentColor" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "rect",
-          {
-            className: "blinq-agent-head",
-            x: "7",
-            y: "7.4",
-            width: "10",
-            height: "9.2",
-            rx: "3.2",
-            fill: "currentColor"
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "blinq-agent-eye", cx: "10.2", cy: "11.3", r: "0.9", fill: "#111111" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "blinq-agent-eye", cx: "13.8", cy: "11.3", r: "0.9", fill: "#111111" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "path",
-          {
-            className: "blinq-agent-mouth",
-            d: "M10 14.2c.7.55 1.38.82 2 .82s1.3-.27 2-.82",
-            stroke: "#111111",
-            strokeWidth: "1.3",
-            strokeLinecap: "round"
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "path",
-          {
-            className: "blinq-agent-neck",
-            d: "M10.2 17.1h3.6",
-            stroke: "currentColor",
-            strokeWidth: "1.4",
-            strokeLinecap: "round"
-          }
-        )
-      ]
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Bot, { "aria-hidden": "true", className: "blinq-launcher-icon", size: 30, strokeWidth: 1.7 });
+}
+function AssistantAvatar({
+  avatarUrl,
+  assistantName
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-avatar", "aria-hidden": "true", children: [
+    avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: avatarUrl, alt: "", className: "blinq-avatar-image" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Bot, { className: "blinq-avatar-icon", size: 24, strokeWidth: 1.8 }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "blinq-avatar-status" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "blinq-avatar-label", children: assistantName.slice(0, 1) })
+  ] });
 }
 function CollapseIcon() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M6 12h12", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round" }) });
 }
 function MicrophoneIcon({ listening }) {
   if (listening) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "7", y: "7", width: "10", height: "10", rx: "2.5", fill: "currentColor" }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", "aria-hidden": "true", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "8.25", stroke: "currentColor", strokeWidth: "1.65" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "9.1", y: "9.1", width: "5.8", height: "5.8", rx: "1.6", fill: "currentColor" })
+    ] });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", "aria-hidden": "true", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "path",
       {
-        d: "M12 3.75a2.75 2.75 0 0 1 2.75 2.75v5.25a2.75 2.75 0 1 1-5.5 0V6.5A2.75 2.75 0 0 1 12 3.75Z",
-        fill: "currentColor"
+        d: "M12 4.35a3.05 3.05 0 0 1 3.05 3.05v4.7a3.05 3.05 0 1 1-6.1 0V7.4A3.05 3.05 0 0 1 12 4.35Z",
+        stroke: "currentColor",
+        strokeWidth: "1.7"
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "path",
       {
-        d: "M7.5 10.5a.75.75 0 0 1 .75.75a3.75 3.75 0 1 0 7.5 0a.75.75 0 0 1 1.5 0A5.25 5.25 0 0 1 12.75 16.4V18.5H15a.75.75 0 0 1 0 1.5H9a.75.75 0 0 1 0-1.5h2.25v-2.1A5.25 5.25 0 0 1 6.75 11.25a.75.75 0 0 1 .75-.75Z",
-        fill: "currentColor"
+        d: "M7.95 11.35a4.05 4.05 0 1 0 8.1 0M12 16.45v3.2M9.2 19.65h5.6",
+        stroke: "currentColor",
+        strokeWidth: "1.7",
+        strokeLinecap: "round"
       }
     )
   ] });
@@ -1392,7 +1515,7 @@ function SendIcon() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "path",
     {
-      d: "M5.5 12h11M12.5 5l6.5 7-6.5 7",
+      d: "M5.5 18.5 18.5 5.5M8.25 5.5h10.25v10.25",
       stroke: "currentColor",
       strokeWidth: "1.8",
       strokeLinecap: "round",
@@ -1554,7 +1677,7 @@ function VoiceWaveform({
   const waveform = samples.length > 0 ? samples : [0.18];
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-recording-input", role: "status", "aria-live": "polite", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-recording-time", children: formatRecordingDuration(durationMs) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-recording-waveform", "aria-hidden": "true", children: waveform.map((sample, index) => {
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-recording-wave-shell", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-recording-waveform", "aria-hidden": "true", children: waveform.map((sample, index) => {
       const scale = Math.max(0.16, Math.min(1, sample));
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "span",
@@ -1564,9 +1687,21 @@ function VoiceWaveform({
         },
         `voice-wave-${index}`
       );
-    }) })
+    }) }) })
   ] });
 }
+function planStepStatusLabel(step, isCurrent) {
+  if (step.status === "completed") {
+    return "\u0413\u043E\u0442\u043E\u0432\u043E";
+  }
+  if (step.status === "failed") {
+    return "\u041E\u0448\u0438\u0431\u043A\u0430";
+  }
+  if (step.status === "cancelled") {
+    return "\u041E\u0442\u043C\u0435\u043D\u0435\u043D\u043E";
+  }
+  return isCurrent ? "\u0421\u0435\u0439\u0447\u0430\u0441" : "\u0414\u0430\u043B\u0435\u0435";
+}
 function ActionCard({
   item,
   accentColor,
@@ -1596,9 +1731,6 @@ function ActionCard({
               {
                 type: "button",
                 onClick: onApprove,
-                style: {
-                  background: accentColor
-                },
                 children: "\u0412\u044B\u043F\u043E\u043B\u043D\u0438\u0442\u044C"
               }
             )
@@ -1614,17 +1746,17 @@ function PlanCard({
   onDecline
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, { className: "blinq-action-card blinq-plan-card", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-plan-header", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, { children: "\u041F\u043B\u0430\u043D" }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardDescription, { children: item.goal })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, { variant: item.status === "completed" ? "default" : item.status === "failed" ? "outline" : "soft", children: item.status === "completed" ? "\u0413\u043E\u0442\u043E\u0432\u043E" : item.status === "failed" ? "\u041E\u0448\u0438\u0431\u043A\u0430" : item.status === "awaiting_navigation" ? "\u041F\u0435\u0440\u0435\u0445\u043E\u0434" : "\u0412 \u0440\u0430\u0431\u043E\u0442\u0435" })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, { className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, { className: "blinq-plan-content", children: [
       item.progressLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-action-state", children: item.progressLabel }) : null,
       item.statusReason ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-card-description", children: item.statusReason }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-2", children: item.steps.map((step, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-plan-steps", children: item.steps.map((step, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
         "div",
         {
           className: "blinq-plan-step",
@@ -1633,7 +1765,10 @@ function PlanCard({
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "blinq-plan-step-index", children: index + 1 }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-plan-step-copy", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: step.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-plan-step-title-row", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-plan-step-title", children: step.title }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "blinq-plan-step-status-pill", children: planStepStatusLabel(step, index === item.currentStepIndex) })
+              ] }),
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-plan-step-meta", children: step.status === "completed" ? "\u0412\u044B\u043F\u043E\u043B\u043D\u0435\u043D\u043E" : step.status === "failed" ? "\u041E\u0448\u0438\u0431\u043A\u0430" : step.status === "cancelled" ? "\u041E\u0442\u043C\u0435\u043D\u0435\u043D\u043E" : index === item.currentStepIndex ? "\u0422\u0435\u043A\u0443\u0449\u0438\u0439 \u0448\u0430\u0433" : "\u041E\u0436\u0438\u0434\u0430\u0435\u0442" })
             ] })
           ]
@@ -1647,6 +1782,53 @@ function PlanCard({
     ] })
   ] });
 }
+function GuideCard({
+  guide,
+  onStartGuide,
+  onAdvanceGuide,
+  onDismissGuide,
+  onCompleteGuide,
+  onRunGuideStep
+}) {
+  const currentStep = guide.steps[Math.min(guide.currentStepIndex, Math.max(guide.steps.length - 1, 0))] ?? null;
+  const isStarted = guide.state === "started";
+  const isCompleted = guide.state === "completed";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, { className: "blinq-guide-card", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-plan-header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, { children: "Guide \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardDescription, { children: guide.summary || "\u041F\u043E\u0448\u0430\u0433\u043E\u0432\u0430\u044F \u043F\u043E\u043C\u043E\u0449\u044C \u043F\u043E \u0442\u0435\u043A\u0443\u0449\u0435\u043C\u0443 \u0438\u043D\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443." })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, { variant: guide.source === "live" ? "soft" : "accent", children: guide.source === "live" ? "Live" : "Published" })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContent, { className: "blinq-guide-content", children: !isStarted ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-card-description", children: "\u0410\u0441\u0441\u0438\u0441\u0442\u0435\u043D\u0442 \u0443\u0436\u0435 \u043F\u043E\u0434\u0433\u043E\u0442\u043E\u0432\u0438\u043B guide \u0434\u043B\u044F \u044D\u0442\u043E\u0439 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u044B \u0438 \u043C\u043E\u0436\u0435\u0442 \u043F\u0440\u043E\u0432\u0435\u0441\u0442\u0438 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044F \u043F\u043E \u0448\u0430\u0433\u0430\u043C." }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", variant: "outline", onClick: onDismissGuide, children: "\u0421\u043A\u0440\u044B\u0442\u044C" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", onClick: onStartGuide, children: "\u041D\u0430\u0447\u0430\u0442\u044C guide" })
+      ] })
+    ] }) : currentStep && !isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-guide-step-shell", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-guide-step-meta", children: [
+          "\u0428\u0430\u0433 ",
+          Math.min(guide.currentStepIndex + 1, guide.totalSteps),
+          " \u0438\u0437 ",
+          guide.totalSteps
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-guide-step-title", children: currentStep.title }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-guide-step-copy", children: currentStep.body })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", variant: "outline", onClick: onDismissGuide, children: "\u0421\u043A\u0440\u044B\u0442\u044C" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", variant: "outline", onClick: onRunGuideStep, children: currentStep.actionKind ? "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C / \u0432\u044B\u043F\u043E\u043B\u043D\u0438\u0442\u044C \u0448\u0430\u0433" : "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435" }),
+        guide.currentStepIndex + 1 >= guide.totalSteps ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", onClick: onCompleteGuide, children: "\u0417\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044C" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", onClick: onAdvanceGuide, children: "\u0414\u0430\u043B\u044C\u0448\u0435" })
+      ] })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-card-description", children: "Guide \u0437\u0430\u0432\u0435\u0440\u0448\u0451\u043D. \u041C\u043E\u0436\u043D\u043E \u043F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C \u0440\u0430\u0431\u043E\u0442\u0443 \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435 \u0441\u0430\u043C\u043E\u0441\u0442\u043E\u044F\u0442\u0435\u043B\u044C\u043D\u043E." }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-actions", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, { type: "button", onClick: onDismissGuide, children: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C" }) })
+    ] }) })
+  ] });
+}
 function AssistantConversationThread({
   items,
   showThinkingIndicator,
@@ -1723,34 +1905,52 @@ function WidgetEmbedShell({
   onApproveAction,
   onDeclineAction,
   onApprovePlan,
-  onDeclinePlan
+  onDeclinePlan,
+  onStartGuide,
+  onAdvanceGuide,
+  onDismissGuide,
+  onCompleteGuide,
+  onRunGuideStep
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",
     {
       className: "blinq-shell",
       "data-side": state.side,
+      "data-theme": state.themeVariant,
       style: { ["--blinq-accent"]: state.accentColor },
       children: [
         !state.minimized ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-panel", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-header-row", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-header-copy", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-heading", children: state.assistantName }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                Button,
-                {
-                  type: "button",
-                  size: "icon-sm",
-                  variant: "ghost",
-                  "aria-label": "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C \u0432\u0438\u0434\u0436\u0435\u0442",
-                  title: "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C \u0432\u0438\u0434\u0436\u0435\u0442",
-                  onClick: onCollapse,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CollapseIcon, {})
-                }
-              )
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-header", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-header-row", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AssistantAvatar, { avatarUrl: state.avatarUrl, assistantName: state.assistantName }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "blinq-header-copy", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-heading", children: state.assistantName }),
+              state.statusText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-status-line", children: state.statusText }) : null
             ] }),
-            state.statusText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-status-line", children: state.statusText }) : null
-          ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              Button,
+              {
+                type: "button",
+                size: "icon-sm",
+                variant: "ghost",
+                "aria-label": "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C \u0432\u0438\u0434\u0436\u0435\u0442",
+                title: "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C \u0432\u0438\u0434\u0436\u0435\u0442",
+                onClick: onCollapse,
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CollapseIcon, {})
+              }
+            )
+          ] }) }),
+          state.guide ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            GuideCard,
+            {
+              guide: state.guide,
+              onStartGuide,
+              onAdvanceGuide,
+              onDismissGuide,
+              onCompleteGuide,
+              onRunGuideStep
+            }
+          ) : null,
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             AssistantConversationThread,
             {
@@ -1796,7 +1996,7 @@ function WidgetEmbedShell({
                   Input,
                   {
                     value: state.inputValue,
-                    placeholder: "\u041D\u0430\u043F\u0440\u0438\u043C\u0435\u0440: \u043D\u0430\u0439\u0434\u0438 \u043D\u0443\u0436\u043D\u0443\u044E \u043A\u043D\u043E\u043F\u043A\u0443 \u0438\u043B\u0438 \u0437\u0430\u043F\u043E\u043B\u043D\u0438 \u0444\u043E\u0440\u043C\u0443",
+                    placeholder: "Type a message...",
                     onChange: (event) => onInputChange(event.currentTarget.value),
                     disabled: state.isSending
                   }
@@ -1815,7 +2015,8 @@ function WidgetEmbedShell({
                 )
               ] }) })
             }
-          )
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "blinq-powered", children: "POWERED BY BLINQ" })
         ] }) : null,
         state.minimized ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Button,
@@ -1826,7 +2027,7 @@ function WidgetEmbedShell({
             "aria-label": `\u041E\u0442\u043A\u0440\u044B\u0442\u044C ${state.assistantName}`,
             title: `\u041E\u0442\u043A\u0440\u044B\u0442\u044C ${state.assistantName}`,
             onClick: onOpen,
-            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "blinq-launcher-badge", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LauncherIcon, {}) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LauncherIcon, {})
           }
         ) : null
       ]
@@ -2236,6 +2437,41 @@ var SESSION_STORAGE_PREFIX = "blinq-widget-session";
 var MAX_STORED_HISTORY = 30;
 var MAX_HISTORY_FOR_REQUEST = 12;
 var DEFAULT_GREETING = "Blinq \u043F\u043E\u0434\u043A\u043B\u044E\u0447\u0435\u043D. \u0421\u043F\u0440\u043E\u0441\u0438\u0442\u0435 \u043F\u0440\u043E \u0442\u0435\u043A\u0443\u0449\u0443\u044E \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443, \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0443 \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u044B \u0438\u043B\u0438 \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0448\u0430\u0433.";
+var PLAN_APPROVE_TEXTS = /* @__PURE__ */ new Set([
+  "\u0434\u0430",
+  "\u0430\u0433\u0430",
+  "\u043E\u043A",
+  "okay",
+  "\u043E\u043A\u0435\u0439",
+  "\u0445\u043E\u0440\u043E\u0448\u043E",
+  "\u043B\u0430\u0434\u043D\u043E",
+  "\u0434\u0435\u043B\u0430\u0439",
+  "\u0441\u0434\u0435\u043B\u0430\u0439",
+  "\u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0430\u044E",
+  "yes",
+  "ok",
+  "sure",
+  "go ahead",
+  "approve",
+  "\u0438\u04D9",
+  "\u0438\u044F",
+  "\u0438\u0441\u0442\u0435",
+  "\u0436\u0430\u0440\u0430\u0439\u0434\u044B",
+  "\u043C\u0430\u049B\u04B1\u043B"
+]);
+var PLAN_DECLINE_TEXTS = /* @__PURE__ */ new Set([
+  "\u043D\u0435\u0442",
+  "\u043D\u0435 \u043D\u0430\u0434\u043E",
+  "\u043D\u0435 \u043D\u0443\u0436\u043D\u043E",
+  "\u043E\u0442\u043C\u0435\u043D\u0430",
+  "\u043E\u0442\u043C\u0435\u043D\u0438",
+  "cancel",
+  "no",
+  "stop",
+  "\u0436\u043E\u049B",
+  "\u0442\u043E\u049B\u0442\u0430",
+  "\u043A\u0435\u0440\u0435\u043A \u0435\u043C\u0435\u0441"
+]);
 function isBrowser3() {
   return typeof window !== "undefined" && typeof document !== "undefined";
 }
@@ -2269,9 +2505,9 @@ function getOrCreateFingerprint() {
 }
 function runtimeMessage(mode) {
   if (mode === "read-only-fallback") {
-    return "\u0413\u043E\u0442\u043E\u0432 \u043E\u0431\u044A\u044F\u0441\u043D\u0438\u0442\u044C \u0442\u0435\u043A\u0443\u0449\u0443\u044E \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443 \u0438 \u043F\u043E\u0434\u0441\u043A\u0430\u0437\u0430\u0442\u044C \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0448\u0430\u0433.";
+    return "\u0414\u0435\u0439\u0441\u0442\u0432\u0438\u044F \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435 \u043D\u0435\u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B. \u042F \u043C\u043E\u0433\u0443 \u043E\u0431\u044A\u044F\u0441\u043D\u044F\u0442\u044C \u0438\u043D\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0438 \u043E\u0442\u0432\u0435\u0447\u0430\u0442\u044C \u043F\u043E \u0431\u0430\u0437\u0435 \u0437\u043D\u0430\u043D\u0438\u0439.";
   }
-  return "\u0413\u043E\u0442\u043E\u0432 \u043F\u043E\u043C\u043E\u0447\u044C \u0441 \u043E\u043D\u0431\u043E\u0440\u0434\u0438\u043D\u0433\u043E\u043C \u0438 \u0432\u043E\u043F\u0440\u043E\u0441\u0430\u043C\u0438 \u043F\u043E \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u0435.";
+  return "\u0413\u043E\u0442\u043E\u0432 \u043F\u043E\u043C\u043E\u0433\u0430\u0442\u044C \u0441 \u0438\u043D\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043E\u043C, \u0437\u043D\u0430\u043D\u0438\u044F\u043C\u0438 \u0438 \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u043C\u0438 \u0448\u0430\u0433\u0430\u043C\u0438.";
 }
 function normalizedRouteFromUrl(value) {
   try {
@@ -2348,7 +2584,7 @@ var BlinqWidget = class {
   minimized = false;
   isSending = false;
   inputValue = "";
-  statusText = "\u041F\u0440\u043E\u0432\u0435\u0440\u044F\u0435\u043C \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044F \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u044B.";
+  statusText = "";
   voiceSupported = false;
   voiceListening = false;
   voiceWaveform = [];
@@ -2358,6 +2594,7 @@ var BlinqWidget = class {
   confirmResolve = null;
   confirmItemId = null;
   activeRun = null;
+  activeGuide = null;
   pendingAssistantIndicator = false;
   executedToolCounts = /* @__PURE__ */ new Map();
   lastAutoResumeKey = null;
@@ -2387,12 +2624,34 @@ var BlinqWidget = class {
     },
     onDeclinePlan: () => {
       void this.respondToPlan(false);
+    },
+    onStartGuide: () => {
+      void this.startGuide();
+    },
+    onAdvanceGuide: () => {
+      void this.advanceGuide();
+    },
+    onDismissGuide: () => {
+      void this.dismissGuide();
+    },
+    onCompleteGuide: () => {
+      void this.completeGuide();
+    },
+    onRunGuideStep: () => {
+      void this.runGuideStep();
     }
   };
   constructor(options) {
     this.options = options;
     this.apiBaseUrl = options.apiBaseUrl ?? DEFAULT_API_BASE_URL;
   }
+  currentActionPolicy() {
+    return this.runtimeStatus?.action_policy ?? {
+      actions_enabled: this.widgetConfig?.actions_enabled ?? true,
+      action_mode: this.widgetConfig?.action_mode ?? "execute_with_confirmation",
+      pointer_overlay_enabled: this.widgetConfig?.pointer_overlay_enabled ?? true
+    };
+  }
   async init() {
     await this.startSession();
     if (isBrowser3()) {
@@ -2402,8 +2661,10 @@ var BlinqWidget = class {
       this.render();
       this.setupVoiceInput();
       this.registry = new PageToolRegistry(this.confirmToolExecution.bind(this));
+      this.registry.setActionPolicy(this.currentActionPolicy());
       const nativeRegistered = await this.registry.registerNativeTools();
       this.syncRuntimeStatus(nativeRegistered);
+      this.syncGuideHighlight();
       if (this.shouldAutoResumeActiveRun()) {
         window.setTimeout(() => {
           void this.continueActiveRun();
@@ -2428,18 +2689,21 @@ var BlinqWidget = class {
   currentState() {
     return {
       minimized: this.minimized,
-      assistantName: this.widgetConfig?.ai_persona_name ?? "Blinq \u0410\u0441\u0441\u0438\u0441\u0442\u0435\u043D\u0442",
+      assistantName: this.widgetConfig?.name ?? "Blinq \u0410\u0441\u0441\u0438\u0441\u0442\u0435\u043D\u0442",
+      avatarUrl: this.widgetConfig?.avatar_url ?? null,
       runtimeLabel: "webmcp://embedded",
       statusText: this.statusText,
       showThinkingIndicator: this.pendingAssistantIndicator,
       inputValue: this.inputValue,
-      accentColor: "#111111",
+      accentColor: this.widgetConfig?.theme_color ?? "#111111",
+      themeVariant: "light",
       side: this.widgetConfig?.position === "bottom-left" ? "left" : "right",
       isSending: this.isSending,
       voiceSupported: this.voiceSupported,
       voiceListening: this.voiceListening,
       voiceWaveform: this.voiceWaveform,
       voiceDurationMs: this.voiceDurationMs,
+      guide: this.activeGuide,
       items: this.items
     };
   }
@@ -2482,6 +2746,7 @@ var BlinqWidget = class {
     this.sessionToken = payload.session_token;
     this.widgetConfig = payload.widget_config;
     this.activeRun = payload.active_run ?? null;
+    this.activeGuide = this.normalizeGuidePayload(payload.active_guide ?? payload.guide_offer ?? null);
     this.runtimeStatus = {
       ...payload.runtime,
       message: runtimeMessage(payload.runtime.mode)
@@ -2725,6 +2990,62 @@ var BlinqWidget = class {
       this.upsertPlanItem(this.activeRun);
     }
   }
+  normalizeGuideStep(step) {
+    return {
+      id: step.id,
+      position: step.position,
+      title: step.title,
+      body: step.body,
+      targetSelector: step.target_selector ?? null,
+      targetLabel: step.target_label ?? null,
+      actionKind: step.action_kind ?? null,
+      actionPayload: step.action_payload ?? null,
+      expectedRoute: step.expected_route ?? null,
+      completionMode: step.completion_mode
+    };
+  }
+  normalizeGuidePayload(payload) {
+    if (!payload) {
+      return null;
+    }
+    const guide = payload.guide;
+    return {
+      id: guide.id,
+      state: payload.state,
+      source: guide.source,
+      route: guide.route,
+      summary: guide.summary ?? null,
+      currentStepIndex: payload.state === "started" ? Math.min(payload.current_step_index, Math.max(guide.steps.length - 1, 0)) : payload.state === "completed" ? guide.steps.length : 0,
+      totalSteps: guide.steps.length,
+      steps: guide.steps.map((step) => this.normalizeGuideStep(step))
+    };
+  }
+  setGuideState(payload, options) {
+    const normalized = this.normalizeGuidePayload(payload);
+    if (options?.clearIfFinished !== false && normalized && (normalized.state === "dismissed" || normalized.state === "completed")) {
+      this.activeGuide = null;
+    } else {
+      this.activeGuide = normalized;
+    }
+    this.renderReactApp();
+    this.syncGuideHighlight();
+  }
+  currentGuideStep() {
+    if (!this.activeGuide || this.activeGuide.state !== "started") {
+      return null;
+    }
+    return this.activeGuide.steps[Math.min(this.activeGuide.currentStepIndex, Math.max(this.activeGuide.steps.length - 1, 0))] ?? null;
+  }
+  syncGuideHighlight() {
+    const step = this.currentGuideStep();
+    if (!step?.targetSelector || !this.registry) {
+      return;
+    }
+    this.registry.highlightTargets(
+      [{ selector: step.targetSelector, label: step.targetLabel || step.title }],
+      { interaction: step.actionKind ? "execute" : "explain", durationMs: 2100 }
+    );
+  }
   updateActionState(id, state) {
     this.items = this.items.map(
       (item) => item.type === "action" && item.id === id ? { ...item, state } : item
@@ -2738,8 +3059,24 @@ var BlinqWidget = class {
     const existingPlanItem = this.items.find(
       (item) => item.type === "plan" && item.id === this.planItemId(run.id)
     );
-    if (this.activeRun?.id && this.activeRun.id !== run.id) {
+    const isNewActiveRun = Boolean(this.activeRun?.id && this.activeRun.id !== run.id);
+    if (isNewActiveRun) {
       this.executedToolCounts.clear();
+      this.items = this.items.map((item) => {
+        if (item.type !== "plan" || item.id === this.planItemId(run.id)) {
+          return item;
+        }
+        if (item.status === "completed" || item.status === "failed" || item.status === "abandoned") {
+          return item;
+        }
+        return {
+          ...item,
+          status: "abandoned",
+          approvalState: "declined",
+          progressLabel: item.progressLabel ?? "\u041F\u043B\u0430\u043D \u0437\u0430\u043C\u0435\u043D\u0451\u043D \u043D\u043E\u0432\u044B\u043C \u0437\u0430\u043F\u0440\u043E\u0441\u043E\u043C.",
+          statusReason: item.statusReason ?? "\u041F\u043B\u0430\u043D \u0437\u0430\u043C\u0435\u043D\u0451\u043D \u043D\u043E\u0432\u044B\u043C \u0437\u0430\u043F\u0440\u043E\u0441\u043E\u043C."
+        };
+      });
     }
     this.activeRun = {
       ...run,
@@ -2823,7 +3160,7 @@ var BlinqWidget = class {
     if (!this.runtimeStatus) {
       return;
     }
-    const mode = nativeRegistered ? "native-webmcp-active" : this.registry?.canExecuteWriteTools() ? "blinq-page-tools-active" : "read-only-fallback";
+    const mode = nativeRegistered ? "native-webmcp-active" : this.registry ? "blinq-page-tools-active" : "read-only-fallback";
     this.runtimeStatus = {
       ...this.runtimeStatus,
       mode,
@@ -2837,6 +3174,124 @@ var BlinqWidget = class {
     this.statusText = text;
     this.renderReactApp();
   }
+  async guideRequest(path, body) {
+    if (!this.sessionToken) {
+      throw new Error("\u0421\u0435\u0441\u0441\u0438\u044F \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0435\u0449\u0451 \u043D\u0435 \u0438\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0438\u0440\u043E\u0432\u0430\u043D\u0430");
+    }
+    const response = await fetch(`${this.apiBaseUrl}${path}`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${this.sessionToken}`
+      },
+      body: JSON.stringify(body)
+    });
+    if (!response.ok) {
+      const payload = await response.json().catch(() => ({}));
+      throw new Error(payload.detail ?? "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u043E\u0431\u043D\u043E\u0432\u0438\u0442\u044C \u0441\u043E\u0441\u0442\u043E\u044F\u043D\u0438\u0435 guide");
+    }
+    return await response.json();
+  }
+  async startGuide() {
+    if (!this.sessionId || !this.activeGuide) {
+      return;
+    }
+    const payload = await this.guideRequest("/pub/guide/start", {
+      session_id: this.sessionId,
+      guide_id: this.activeGuide.source === "published" ? this.activeGuide.id : null
+    });
+    this.setGuideState(payload, { clearIfFinished: false });
+    this.setStatus("Guide \u0437\u0430\u043F\u0443\u0449\u0435\u043D.");
+  }
+  async advanceGuide() {
+    if (!this.sessionId) {
+      return;
+    }
+    const payload = await this.guideRequest("/pub/guide/advance", {
+      session_id: this.sessionId
+    });
+    this.setGuideState(payload);
+    this.setStatus(payload.state === "completed" ? "Guide \u0437\u0430\u0432\u0435\u0440\u0448\u0451\u043D." : "\u041F\u0435\u0440\u0435\u0445\u043E\u0434\u0438\u043C \u043A \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0435\u043C\u0443 \u0448\u0430\u0433\u0443.");
+  }
+  async dismissGuide() {
+    if (!this.sessionId) {
+      return;
+    }
+    const payload = await this.guideRequest("/pub/guide/dismiss", {
+      session_id: this.sessionId
+    });
+    this.setGuideState(payload);
+    this.setStatus("Guide \u0441\u043A\u0440\u044B\u0442.");
+  }
+  async completeGuide() {
+    if (!this.sessionId) {
+      return;
+    }
+    const payload = await this.guideRequest("/pub/guide/complete", {
+      session_id: this.sessionId
+    });
+    this.setGuideState(payload);
+    this.setStatus("Guide \u0437\u0430\u0432\u0435\u0440\u0448\u0451\u043D.");
+  }
+  async runGuideStep() {
+    const step = this.currentGuideStep();
+    if (!step || !this.registry) {
+      return;
+    }
+    if (step.actionKind && step.actionPayload && this.currentActionPolicy().actions_enabled && this.currentActionPolicy().action_mode === "execute_with_confirmation") {
+      const outcome = await this.registry.executeTool({
+        tool_name: step.actionKind,
+        display_name: step.title,
+        target_summary: step.targetLabel || step.body,
+        arguments: step.actionPayload
+      });
+      if (outcome.status === "success") {
+        this.setStatus("\u0428\u0430\u0433 \u0432\u044B\u043F\u043E\u043B\u043D\u0435\u043D \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435.");
+        const deferredNavigationHref = outcome.result && typeof outcome.result.href === "string" && outcome.result.deferred_navigation ? outcome.result.href : null;
+        await this.advanceGuide();
+        if (deferredNavigationHref) {
+          window.location.assign(deferredNavigationHref);
+        }
+      } else if (outcome.status === "cancelled") {
+        this.setStatus("\u0412\u044B\u043F\u043E\u043B\u043D\u0435\u043D\u0438\u0435 \u0448\u0430\u0433\u0430 \u043E\u0442\u043C\u0435\u043D\u0435\u043D\u043E.");
+      } else {
+        await this.healGuideStep();
+      }
+      return;
+    }
+    if (step.targetSelector) {
+      const highlighted = this.registry.highlightTargets(
+        [{ selector: step.targetSelector, label: step.targetLabel || step.title }],
+        { interaction: "explain", durationMs: 2200 }
+      );
+      if (highlighted) {
+        this.setStatus("\u041F\u043E\u043A\u0430\u0437\u0430\u043B, \u043A\u0443\u0434\u0430 \u043D\u0430\u0436\u0430\u0442\u044C \u043D\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0435.");
+      } else {
+        await this.healGuideStep();
+      }
+    }
+  }
+  async healGuideStep() {
+    if (!this.sessionId || !this.activeGuide || !this.registry) {
+      return;
+    }
+    this.setStatus("\u041A\u0430\u0436\u0435\u0442\u0441\u044F \u044D\u043B\u0435\u043C\u0435\u043D\u0442 \u043F\u0435\u0440\u0435\u0435\u0445\u0430\u043B. \u0418\u0449\u0443 \u043D\u043E\u0432\u044B\u0435 \u0441\u043F\u043E\u0441\u043E\u0431\u044B \u0441 \u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0418\u0418...");
+    const pageContext = this.registry.collectPageContext();
+    try {
+      const payload = await this.guideRequest("/pub/guide/heal", {
+        session_id: this.sessionId,
+        step_index: this.activeGuide.currentStepIndex,
+        page_context: pageContext
+      });
+      this.setGuideState(payload, { clearIfFinished: false });
+      this.setStatus("\u0421\u0446\u0435\u043D\u0430\u0440\u0438\u0439 \u043F\u0435\u0440\u0435\u0441\u0442\u0440\u043E\u0435\u043D. \u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0430\u044E...");
+      window.setTimeout(() => {
+        void this.runGuideStep();
+      }, 1500);
+    } catch (e) {
+      this.setStatus("\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u043F\u0435\u0440\u0435\u0441\u0442\u0440\u043E\u0438\u0442\u044C \u0448\u0430\u0433.");
+    }
+  }
   appendMessage(text, role, options) {
     const id = createConversationId("message");
     this.items = [
@@ -2897,6 +3352,19 @@ var BlinqWidget = class {
   currentRoute() {
     return normalizedRouteFromUrl(window.location.href);
   }
+  normalizedUserPlanDecision(message) {
+    const normalized = message.trim().toLowerCase();
+    if (!normalized || !this.activeRun?.requires_approval) {
+      return null;
+    }
+    if (PLAN_APPROVE_TEXTS.has(normalized)) {
+      return true;
+    }
+    if (PLAN_DECLINE_TEXTS.has(normalized)) {
+      return false;
+    }
+    return null;
+  }
   shouldAutoResumeActiveRun() {
     if (!this.activeRun || this.activeRun.status !== "awaiting_navigation") {
       return false;
@@ -2995,7 +3463,13 @@ var BlinqWidget = class {
       }
       if (event === "highlight") {
         const highlight = JSON.parse(data);
-        this.registry?.highlightTargets(highlight.targets ?? []);
+        this.registry?.highlightTargets(highlight.targets ?? [], { interaction: "explain" });
+      }
+      if (event === "guide") {
+        this.hideThinkingIndicator();
+        this.setGuideState(JSON.parse(data), {
+          clearIfFinished: false
+        });
       }
       if (event === "delta" && payload.text) {
         const normalizedChunk = normalizeAssistantStreamChunk(finalText, payload.text);
@@ -3077,6 +3551,18 @@ var BlinqWidget = class {
     let responseMessageId = null;
     try {
       this.appendMessage(message, "user");
+      const directPlanDecision = this.normalizedUserPlanDecision(message);
+      if (directPlanDecision !== null) {
+        const finalText2 = await this.respondToPlan(directPlanDecision, {
+          appendAssistantMessage: false,
+          manageSendingState: false
+        });
+        if (finalText2.trim()) {
+          this.finalizeAssistantMessage(finalText2, { persist: false });
+          this.rememberMessage({ role: "assistant", text: finalText2 });
+        }
+        return finalText2;
+      }
       const finalText = await this.streamChatStep(
         "/pub/chat",
         {
@@ -3137,16 +3623,19 @@ var BlinqWidget = class {
       this.renderReactApp();
     }
   }
-  async respondToPlan(approved) {
+  async respondToPlan(approved, options) {
     if (!this.sessionId || !this.sessionToken || !this.activeRun) {
-      return;
+      return "";
     }
-    if (this.isSending) {
-      return;
+    const manageSendingState = options?.manageSendingState ?? true;
+    if (manageSendingState && this.isSending) {
+      return "";
+    }
+    if (manageSendingState) {
+      this.isSending = true;
+      this.showThinkingIndicator();
+      this.renderReactApp();
     }
-    this.isSending = true;
-    this.showThinkingIndicator();
-    this.renderReactApp();
     try {
       const finalText = await this.streamChatStep(
         "/pub/plan/approve",
@@ -3158,14 +3647,17 @@ var BlinqWidget = class {
         },
         null
       );
-      if (finalText.trim()) {
+      if (options?.appendAssistantMessage !== false && finalText.trim()) {
         this.finalizeAssistantMessage(finalText, { persist: false });
         this.rememberMessage({ role: "assistant", text: finalText });
       }
+      return finalText;
     } finally {
-      this.hideThinkingIndicator();
-      this.isSending = false;
-      this.renderReactApp();
+      if (manageSendingState) {
+        this.hideThinkingIndicator();
+        this.isSending = false;
+        this.renderReactApp();
+      }
     }
   }
   async endSession() {
@@ -3219,27 +3711,41 @@ var EMBED_WIDGET_STYLES = `
     display: flex;
     flex-direction: column;
     gap: 12px;
-    width: 420px;
+    width: 432px;
     max-width: calc(100vw - 24px);
-    font-family:
-      "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
-      "Segoe UI", sans-serif;
     pointer-events: none;
+    font-family:
+      "SF Pro Display",
+      "SF Pro Text",
+      "Inter",
+      ui-sans-serif,
+      system-ui,
+      -apple-system,
+      BlinkMacSystemFont,
+      "Segoe UI",
+      sans-serif;
     --blinq-accent: #111111;
-    --blinq-background: #ffffff;
-    --blinq-panel: rgba(255, 255, 255, 0.98);
-    --blinq-panel-soft: #fafafa;
-    --blinq-surface: #ffffff;
-    --blinq-surface-soft: #f5f5f5;
-    --blinq-surface-muted: #ededed;
-    --blinq-border: rgba(17, 17, 17, 0.08);
-    --blinq-border-strong: rgba(17, 17, 17, 0.18);
-    --blinq-text: #111111;
-    --blinq-text-soft: #262626;
-    --blinq-text-muted: #737373;
-    --blinq-user-bubble: #111111;
-    --blinq-user-text: #ffffff;
-    --blinq-shadow: 0 24px 60px rgba(17, 17, 17, 0.12);
+    --blinq-text: rgba(18, 18, 20, 0.96);
+    --blinq-text-soft: rgba(32, 34, 38, 0.82);
+    --blinq-text-muted: rgba(56, 60, 66, 0.58);
+    --blinq-glass-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(240, 243, 248, 0.52));
+    --blinq-glass-fill-strong: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(245, 247, 250, 0.62));
+    --blinq-glass-fill-dense: linear-gradient(180deg, rgba(249, 250, 252, 0.92), rgba(231, 235, 241, 0.66));
+    --blinq-glass-stroke: rgba(255, 255, 255, 0.68);
+    --blinq-glass-stroke-soft: rgba(255, 255, 255, 0.5);
+    --blinq-glass-edge: rgba(100, 109, 123, 0.14);
+    --blinq-shadow:
+      0 28px 80px rgba(155, 164, 180, 0.22),
+      0 10px 30px rgba(174, 182, 193, 0.18);
+    --blinq-shadow-soft:
+      0 14px 40px rgba(170, 177, 189, 0.18),
+      0 4px 14px rgba(202, 208, 216, 0.18);
+    --blinq-inner-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.92);
+    --blinq-blur: blur(28px) saturate(170%);
+    --blinq-radius-panel: 32px;
+    --blinq-radius-pill: 999px;
+    --blinq-radius-bubble: 28px;
+    --blinq-radius-card: 30px;
   }
 
   .blinq-shell[data-side="left"] {
@@ -3257,397 +3763,170 @@ var EMBED_WIDGET_STYLES = `
     pointer-events: auto;
   }
 
-  .blinq-launcher {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    gap: 12px;
-    min-height: 58px;
-    padding: 0 18px;
-    border: 1px solid var(--blinq-border);
-    border-radius: 20px;
-    background: #ffffff;
-    color: var(--blinq-text);
-    box-shadow: 0 18px 40px rgba(17, 17, 17, 0.12);
-    backdrop-filter: blur(18px);
-    -webkit-backdrop-filter: blur(18px);
-    transition:
-      transform 180ms ease,
-      box-shadow 180ms ease,
-      border-color 180ms ease;
+  .blinq-shell {
+    width: 520px;
   }
 
-  .blinq-launcher:hover {
-    transform: translateY(-2px);
-    border-color: rgba(17, 17, 17, 0.16);
-    box-shadow: 0 22px 46px rgba(17, 17, 17, 0.16);
-  }
-
-  .blinq-launcher-badge {
-    display: grid;
-    place-items: center;
-    width: 34px;
-    height: 34px;
-    border-radius: 12px;
-    background: #111111;
-    color: #ffffff;
-    transition:
-      transform 180ms ease,
-      box-shadow 180ms ease;
+  .blinq-panel {
+    position: relative;
+    width: 100%;
+    max-width: 432px;
+    overflow: hidden;
+    border-radius: var(--blinq-radius-panel);
+    border: 1px solid var(--blinq-glass-stroke);
+    background: var(--blinq-glass-fill);
+    box-shadow: var(--blinq-shadow);
+    backdrop-filter: var(--blinq-blur);
+    -webkit-backdrop-filter: var(--blinq-blur);
   }
 
-  .blinq-launcher:hover .blinq-launcher-badge {
-    transform: scale(1.06);
-    box-shadow: 0 10px 24px rgba(17, 17, 17, 0.22);
+  .blinq-panel::before,
+  .blinq-launcher::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    border-radius: inherit;
+    box-shadow: var(--blinq-inner-highlight);
   }
 
-  .blinq-launcher-icon-only {
-    width: 58px;
-    min-width: 58px;
-    padding: 0;
-    border-radius: 18px;
+  .blinq-launcher::after {
+    content: "";
+    position: absolute;
+    inset: 1px;
+    pointer-events: none;
+    border-radius: inherit;
+    background:
+      radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.82), transparent 32%),
+      linear-gradient(135deg, rgba(255, 255, 255, 0.46), transparent 55%);
+    opacity: 0.88;
+    transition:
+      opacity 180ms ease;
   }
 
-  .blinq-launcher-agent {
-    overflow: visible;
+  .blinq-panel::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    border-radius: inherit;
+    background:
+      radial-gradient(circle at top left, rgba(255, 255, 255, 0.72), transparent 34%),
+      radial-gradient(circle at bottom center, rgba(255, 255, 255, 0.26), transparent 38%);
+    opacity: 0.95;
   }
 
-  .blinq-agent-orbit {
-    stroke: rgba(255, 255, 255, 0.42);
-    stroke-width: 1.3;
-    stroke-dasharray: 2.6 2.6;
-    transform-origin: center;
-    transition: opacity 180ms ease;
+  .blinq-header,
+  .blinq-thread,
+  .blinq-composer {
+    position: relative;
+    z-index: 1;
   }
 
-  .blinq-agent-spark,
-  .blinq-agent-head,
-  .blinq-agent-antenna,
-  .blinq-agent-antenna-dot,
-  .blinq-agent-neck {
-    transform-origin: center;
+  .blinq-header {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+    padding: 18px 18px 10px;
   }
 
-  .blinq-launcher:hover .blinq-agent-orbit {
-    animation: blinq-agent-spin 2.2s linear infinite;
+  .blinq-header-row {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 12px;
   }
 
-  .blinq-launcher:hover .blinq-agent-spark {
-    animation: blinq-agent-spark 1.1s ease-in-out infinite;
-  }
-
-  .blinq-launcher:hover .blinq-agent-head,
-  .blinq-launcher:hover .blinq-agent-neck,
-  .blinq-launcher:hover .blinq-agent-antenna,
-  .blinq-launcher:hover .blinq-agent-antenna-dot {
-    animation: blinq-agent-bob 1.35s ease-in-out infinite;
-  }
-
-  .blinq-launcher-copy {
+  .blinq-header-copy {
     display: flex;
     flex-direction: column;
-    align-items: flex-start;
-    line-height: 1.1;
-  }
-
-  .blinq-launcher-label {
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    color: var(--blinq-text-muted);
-  }
-
-  .blinq-launcher-title {
-    margin-top: 3px;
-    font-size: 14px;
-    font-weight: 600;
-    color: var(--blinq-text);
-  }
-
-  .blinq-panel {
-    width: 100%;
-    max-width: 420px;
-    border: 1px solid var(--blinq-border);
-    border-radius: 28px;
-    overflow: hidden;
-    background: #ffffff;
-    box-shadow: var(--blinq-shadow);
-    backdrop-filter: blur(24px);
-    -webkit-backdrop-filter: blur(24px);
-  }
-
-  .blinq-header {
-    padding: 16px;
-    border-bottom: 1px solid var(--blinq-border);
-    background: #ffffff;
-  }
-
-  .blinq-status-line {
-    margin-top: 10px;
-    font-size: 12px;
-    line-height: 1.45;
-    color: var(--blinq-text-muted);
-  }
-
-  .blinq-header-row {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 12px;
-  }
-
-  .blinq-header-copy {
+    gap: 8px;
     min-width: 0;
     flex: 1;
   }
 
-  .blinq-header-badges {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 8px;
-  }
-
-  .blinq-heading-row {
-    margin-top: 14px;
-    display: flex;
-    align-items: flex-start;
-    justify-content: space-between;
-    gap: 12px;
-  }
-
   .blinq-heading {
-    font-size: 16px;
-    font-weight: 700;
-    letter-spacing: -0.02em;
+    font-size: 17px;
+    line-height: 1.15;
+    font-weight: 600;
+    letter-spacing: -0.03em;
     color: var(--blinq-text);
   }
 
-  .blinq-subheading {
-    margin-top: 6px;
-    max-width: 320px;
-    font-size: 13px;
-    line-height: 1.45;
-    color: var(--blinq-text-muted);
-  }
-
-  .blinq-statusbar {
-    margin-top: 14px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 10px;
-    flex-wrap: wrap;
-  }
-
-  .blinq-status {
+  .blinq-status-line {
     display: inline-flex;
     align-items: center;
-    min-height: 34px;
+    gap: 8px;
+    max-width: fit-content;
+    min-height: 32px;
     padding: 0 12px;
-    border-radius: 999px;
-    border: 1px solid var(--blinq-border);
-    background: #f8f8f8;
+    border-radius: var(--blinq-radius-pill);
+    border: 1px solid var(--blinq-glass-stroke-soft);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(242, 244, 248, 0.46));
     color: var(--blinq-text-soft);
     font-size: 12px;
-    line-height: 1.45;
+    line-height: 1.35;
+    box-shadow: var(--blinq-shadow-soft);
+    backdrop-filter: blur(22px) saturate(170%);
+    -webkit-backdrop-filter: blur(22px) saturate(170%);
   }
 
-  .blinq-runtime-chip {
-    display: inline-flex;
-    align-items: center;
-    min-height: 34px;
-    padding: 0 12px;
+  .blinq-status-line::before {
+    content: "";
+    width: 7px;
+    height: 7px;
     border-radius: 999px;
-    background: #111111;
-    border: 1px solid #111111;
-    color: #ffffff;
-    font-size: 12px;
-    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
-  }
-
-  .blinq-workspace {
-    display: grid;
-    grid-template-columns: 112px minmax(0, 1fr);
-    min-height: 430px;
-  }
-
-  .blinq-sidebar {
-    display: flex;
-    flex-direction: column;
-    gap: 14px;
-    padding: 16px;
-    border-right: 1px solid var(--blinq-border);
-    background: #fafafa;
-  }
-
-  .blinq-sidebar-group {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-  }
-
-  .blinq-tab-trigger {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-    width: 100%;
-    min-height: 56px;
-    padding: 10px;
-    border: 1px solid transparent;
-    border-radius: 18px;
-    background: transparent;
-    color: var(--blinq-text-soft);
-    cursor: pointer;
-    transition:
-      background 120ms ease,
-      border-color 120ms ease,
-      color 120ms ease,
-      transform 120ms ease;
-  }
-
-  .blinq-tab-trigger:hover {
-    background: rgba(255,255,255,0.9);
-    border-color: var(--blinq-border);
-  }
-
-  .blinq-tab-trigger-active {
-    background: #ffffff;
-    border-color: rgba(17, 17, 17, 0.16);
-    box-shadow: 0 10px 24px rgba(17, 17, 17, 0.08);
-    color: var(--blinq-text);
-  }
-
-  .blinq-tab-icon {
-    display: grid;
-    place-items: center;
-    width: 32px;
-    height: 32px;
-    border-radius: 12px;
-    background: rgba(15, 23, 42, 0.04);
-    color: currentColor;
-    flex: 0 0 auto;
-  }
-
-  .blinq-tab-copy {
-    display: flex;
-    flex-direction: column;
-    min-width: 0;
-    align-items: flex-start;
-    text-align: left;
-  }
-
-  .blinq-tab-label {
-    font-size: 13px;
-    font-weight: 600;
-  }
-
-  .blinq-tab-caption {
-    margin-top: 2px;
-    font-size: 11px;
-    color: var(--blinq-text-muted);
+    background: rgba(17, 17, 17, 0.74);
+    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.34);
+    flex: none;
   }
 
-  .blinq-tab-count {
-    margin-left: auto;
-    min-width: 22px;
-    height: 22px;
-    padding: 0 6px;
+  .blinq-launcher {
+    position: relative;
     display: inline-flex;
     align-items: center;
     justify-content: center;
+    width: 76px;
+    min-width: 76px;
+    height: 76px;
+    padding: 0;
     border-radius: 999px;
-    background: rgba(15, 23, 42, 0.06);
-    color: var(--blinq-text-soft);
-    font-size: 11px;
-    font-weight: 700;
-  }
-
-  .blinq-separator {
-    height: 1px;
-    background: var(--blinq-border);
-  }
-
-  .blinq-sidebar-card {
-    gap: 12px;
-    border-radius: 18px;
-    background: rgba(255,255,255,0.94);
-    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
-  }
-
-  .blinq-sidebar-card-header {
-    padding: 14px 14px 0;
-  }
-
-  .blinq-sidebar-card-content {
-    padding: 0 14px 14px;
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-  }
-
-  .blinq-stat-line {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 8px;
-    font-size: 12px;
-    color: var(--blinq-text-muted);
-  }
-
-  .blinq-stat-line strong {
+    border: 1px solid var(--blinq-glass-stroke);
+    background: var(--blinq-glass-fill-strong);
+    box-shadow: var(--blinq-shadow-soft);
+    backdrop-filter: blur(26px) saturate(175%);
+    -webkit-backdrop-filter: blur(26px) saturate(175%);
     color: var(--blinq-text);
-    font-size: 12px;
-  }
-
-  .blinq-main {
-    display: flex;
-    flex-direction: column;
-    min-width: 0;
-    background: transparent;
+    isolation: isolate;
   }
 
-  .blinq-main-toolbar {
-    padding: 16px 18px 12px;
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
+  .blinq-launcher:hover {
+    border-color: var(--blinq-glass-stroke);
+    box-shadow: var(--blinq-shadow-soft);
   }
 
-  .blinq-toolbar-label {
-    font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    color: var(--blinq-text-muted);
+  .blinq-launcher-icon-only {
+    border-radius: 999px;
   }
 
-  .blinq-prompt-row {
-    display: flex;
-    gap: 8px;
-    flex-wrap: wrap;
+  .blinq-launcher-icon {
+    position: relative;
+    z-index: 1;
+    width: 30px;
+    height: 30px;
+    color: rgba(17, 17, 17, 0.96);
+    opacity: 1;
+    filter:
+      drop-shadow(0 1px 0 rgba(255, 255, 255, 0.66))
+      drop-shadow(0 2px 6px rgba(17, 17, 17, 0.08));
   }
 
-  .blinq-prompt-chip {
-    padding: 8px 12px;
-    border-radius: 999px;
-    border: 1px solid var(--blinq-border);
-    background: rgba(255,255,255,0.95);
-    color: var(--blinq-text-soft);
-    font-size: 12px;
-    font-weight: 600;
-    cursor: pointer;
-    transition:
-      background 120ms ease,
-      border-color 120ms ease,
-      color 120ms ease,
-      transform 120ms ease;
+  .blinq-thread {
+    min-height: 0;
   }
 
-  .blinq-prompt-chip:hover {
-    border-color: rgba(17, 17, 17, 0.16);
-    color: #111111;
-    background: #f7f7f7;
+  .blinq-thread-viewport {
+    width: 100%;
   }
 
   .blinq-scroll {
@@ -3655,65 +3934,69 @@ var EMBED_WIDGET_STYLES = `
     flex-direction: column;
     gap: 12px;
     min-height: 0;
-    height: 100%;
-    max-height: 420px;
-    padding: 16px;
+    max-height: 432px;
+    padding: 6px 18px 14px;
     overflow-y: auto;
   }
 
-  .blinq-thread {
-    min-height: 0;
-  }
-
-  .blinq-thread-viewport {
-    width: 100%;
-  }
-
-  .blinq-scroll-actions,
-  .blinq-scroll-context {
-    padding-top: 18px;
-  }
-
   .blinq-scroll::-webkit-scrollbar {
     width: 8px;
   }
 
   .blinq-scroll::-webkit-scrollbar-thumb {
-    background: rgba(148, 163, 184, 0.25);
+    background: rgba(144, 151, 162, 0.22);
     border-radius: 999px;
   }
 
   .blinq-message {
+    position: relative;
     max-width: 88%;
-    border-radius: 20px;
-    padding: 13px 14px;
+    padding: 14px 16px;
+    border-radius: var(--blinq-radius-bubble);
+    border: 1px solid var(--blinq-glass-stroke-soft);
+    background: var(--blinq-glass-fill-strong);
+    color: var(--blinq-text);
     font-size: 14px;
     line-height: 1.55;
     white-space: pre-wrap;
-    border: 1px solid var(--blinq-border);
-    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05);
+    box-shadow: var(--blinq-shadow-soft);
+    backdrop-filter: blur(24px) saturate(170%);
+    -webkit-backdrop-filter: blur(24px) saturate(170%);
+  }
+
+  .blinq-message::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    pointer-events: none;
+    box-shadow: var(--blinq-inner-highlight);
   }
 
   .blinq-message[data-role="assistant"] {
     align-self: flex-start;
-    background: rgba(255,255,255,0.98);
-    color: var(--blinq-text);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(241, 244, 249, 0.58));
+  }
+
+  .blinq-message[data-role="user"] {
+    align-self: flex-end;
+    background: linear-gradient(180deg, rgba(249, 250, 252, 0.94), rgba(227, 232, 238, 0.66));
+    border-color: rgba(255, 255, 255, 0.74);
   }
 
   .blinq-message[data-kind="artifact"] {
-    max-width: 100%;
     width: 100%;
+    max-width: 100%;
     padding: 0;
     border: 0;
     background: transparent;
     box-shadow: none;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
   }
 
-  .blinq-message[data-role="user"] {
-    align-self: flex-end;
-    background: var(--blinq-user-bubble);
-    border-color: rgba(17, 17, 17, 0.22);
-    color: var(--blinq-user-text);
+  .blinq-message[data-kind="artifact"]::before {
+    display: none;
   }
 
   .blinq-message-copy {
@@ -3721,28 +4004,21 @@ var EMBED_WIDGET_STYLES = `
   }
 
   .blinq-message-copy-reveal {
-    animation: blinq-blur-in 220ms cubic-bezier(0.16, 1, 0.3, 1);
-    will-change: opacity, transform, filter;
+    animation: blinq-copy-reveal 240ms cubic-bezier(0.16, 1, 0.3, 1);
+    will-change: opacity, transform;
   }
 
   .blinq-thinking-card {
-    align-self: flex-start;
-    background: rgba(255,255,255,0.98);
-    color: var(--blinq-text);
+    max-width: fit-content;
+    padding-right: 18px;
   }
 
   .blinq-thinking {
     display: inline-flex;
     align-items: center;
     gap: 10px;
-    min-height: 20px;
+    color: var(--blinq-text-soft);
     font-size: 13px;
-    color: var(--blinq-text-muted);
-    opacity: 1;
-    transform: translateY(0);
-    transition:
-      opacity 180ms ease,
-      transform 180ms ease;
   }
 
   .blinq-thinking-dots {
@@ -3755,45 +4031,49 @@ var EMBED_WIDGET_STYLES = `
     width: 6px;
     height: 6px;
     border-radius: 999px;
-    background: #111111;
-    animation: blinq-thinking-pulse 1.1s ease-in-out infinite;
+    background: rgba(17, 17, 17, 0.74);
+    animation: blinq-thinking-pulse 1.2s ease-in-out infinite;
   }
 
   .blinq-thinking-dots > span:nth-child(2) {
-    animation-delay: 120ms;
+    animation-delay: 100ms;
   }
 
   .blinq-thinking-dots > span:nth-child(3) {
-    animation-delay: 240ms;
+    animation-delay: 200ms;
   }
 
   .blinq-card {
     display: flex;
     flex-direction: column;
-    gap: 14px;
-    border: 1px solid var(--blinq-border);
-    border-radius: 20px;
-    background: var(--blinq-surface);
+    gap: 12px;
+    border-radius: var(--blinq-radius-card);
+    border: 1px solid var(--blinq-glass-stroke-soft);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(240, 243, 248, 0.52));
     color: var(--blinq-text);
-    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.06);
+    box-shadow: var(--blinq-shadow-soft);
+    backdrop-filter: blur(26px) saturate(170%);
+    -webkit-backdrop-filter: blur(26px) saturate(170%);
   }
 
   .blinq-card-header {
     display: flex;
     flex-direction: column;
-    gap: 7px;
+    gap: 8px;
     padding: 16px 16px 0;
   }
 
   .blinq-card-title {
     font-size: 15px;
-    font-weight: 700;
+    line-height: 1.2;
+    font-weight: 600;
+    letter-spacing: -0.02em;
     color: var(--blinq-text);
   }
 
   .blinq-card-description {
     font-size: 13px;
-    line-height: 1.5;
+    line-height: 1.45;
     color: var(--blinq-text-muted);
   }
 
@@ -3801,37 +4081,84 @@ var EMBED_WIDGET_STYLES = `
     padding: 0 16px 16px;
   }
 
-  .blinq-action-card {
+  .blinq-action-card,
+  .blinq-plan-card,
+  .blinq-guide-card {
     align-self: stretch;
-    gap: 0;
   }
 
-  .blinq-plan-card {
-    border-color: var(--blinq-border-strong);
+  .blinq-guide-content {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
   }
 
-  .blinq-plan-step {
+  .blinq-guide-step-shell {
     display: flex;
-    align-items: flex-start;
-    gap: 10px;
-    padding: 10px 0;
-    border-top: 1px solid rgba(17, 17, 17, 0.06);
+    flex-direction: column;
+    gap: 8px;
+    padding: 14px;
+    border-radius: 22px;
+    border: 1px solid rgba(255, 255, 255, 0.64);
+    background:
+      radial-gradient(circle at top left, rgba(255, 255, 255, 0.8), transparent 42%),
+      linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(242, 245, 249, 0.56));
+    box-shadow:
+      inset 0 1px 0 rgba(255, 255, 255, 0.94),
+      0 10px 22px rgba(183, 191, 201, 0.13);
+  }
+
+  .blinq-guide-step-meta {
+    font-size: 11px;
+    font-weight: 600;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    color: var(--blinq-text-soft);
   }
 
-  .blinq-plan-step:first-child {
-    border-top: 0;
-    padding-top: 0;
-  }
+  .blinq-guide-step-title {
+    font-size: 14px;
+    line-height: 1.35;
+    font-weight: 600;
+    color: var(--blinq-text);
+  }
+
+  .blinq-guide-step-copy {
+    font-size: 13px;
+    line-height: 1.5;
+    color: var(--blinq-text-muted);
+  }
+
+  .blinq-plan-step {
+    display: flex;
+    align-items: flex-start;
+    gap: 12px;
+    padding: 12px 13px;
+    margin-top: 10px;
+    border-radius: 24px;
+    border: 1px solid rgba(255, 255, 255, 0.62);
+    background:
+      radial-gradient(circle at top left, rgba(255, 255, 255, 0.72), transparent 38%),
+      linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(238, 242, 247, 0.54));
+    box-shadow:
+      inset 0 1px 0 rgba(255, 255, 255, 0.94),
+      0 8px 20px rgba(189, 196, 206, 0.12);
+  }
+
+  .blinq-plan-step:first-child {
+    margin-top: 0;
+  }
 
   .blinq-plan-step-index {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    width: 22px;
-    height: 22px;
+    width: 26px;
+    height: 26px;
     border-radius: 999px;
-    background: #111111;
-    color: #ffffff;
+    border: 1px solid rgba(255, 255, 255, 0.7);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(240, 243, 247, 0.62));
+    color: rgba(17, 17, 17, 0.82);
     font-size: 11px;
     font-weight: 700;
     flex: none;
@@ -3841,9 +4168,62 @@ var EMBED_WIDGET_STYLES = `
     min-width: 0;
     display: flex;
     flex-direction: column;
-    gap: 3px;
-    font-size: 13px;
+    gap: 6px;
     color: var(--blinq-text);
+    font-size: 13px;
+    flex: 1;
+  }
+
+  .blinq-plan-header {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 12px;
+  }
+
+  .blinq-plan-content {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .blinq-plan-steps {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+  }
+
+  .blinq-plan-step-title-row {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 10px;
+  }
+
+  .blinq-plan-step-title {
+    min-width: 0;
+    font-size: 13px;
+    line-height: 1.4;
+    font-weight: 600;
+    letter-spacing: -0.01em;
+  }
+
+  .blinq-plan-step-status-pill {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 24px;
+    padding: 0 10px;
+    border-radius: 999px;
+    border: 1px solid rgba(255, 255, 255, 0.58);
+    background: rgba(255, 255, 255, 0.58);
+    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
+    color: var(--blinq-text-soft);
+    font-size: 11px;
+    font-weight: 600;
+    line-height: 1;
+    letter-spacing: 0.01em;
+    white-space: nowrap;
   }
 
   .blinq-plan-step-meta {
@@ -3851,17 +4231,36 @@ var EMBED_WIDGET_STYLES = `
     color: var(--blinq-text-muted);
   }
 
+  .blinq-plan-step[data-current="true"] {
+    background:
+      radial-gradient(circle at top left, rgba(255, 255, 255, 0.82), transparent 40%),
+      linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(243, 246, 250, 0.64));
+    border-color: rgba(255, 255, 255, 0.74);
+    box-shadow:
+      inset 0 1px 0 rgba(255, 255, 255, 0.96),
+      0 12px 26px rgba(183, 191, 201, 0.15);
+  }
+
   .blinq-plan-step[data-current="true"] .blinq-plan-step-index {
-    box-shadow: 0 0 0 4px rgba(17, 17, 17, 0.08);
+    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.48);
+  }
+
+  .blinq-plan-step[data-current="true"] .blinq-plan-step-status-pill {
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(240, 243, 247, 0.66));
+    color: var(--blinq-text);
   }
 
   .blinq-plan-step[data-status="completed"] .blinq-plan-step-index {
-    background: #111111;
+    background: rgba(227, 232, 237, 0.88);
   }
 
-  .blinq-plan-step[data-status="failed"] .blinq-plan-step-index,
-  .blinq-plan-step[data-status="cancelled"] .blinq-plan-step-index {
-    background: #525252;
+  .blinq-plan-step[data-status="completed"] .blinq-plan-step-status-pill {
+    background: rgba(244, 246, 249, 0.78);
+  }
+
+  .blinq-plan-step[data-status="failed"],
+  .blinq-plan-step[data-status="cancelled"] {
+    opacity: 0.72;
   }
 
   .blinq-action-meta-row {
@@ -3877,11 +4276,18 @@ var EMBED_WIDGET_STYLES = `
   }
 
   .blinq-action-details > summary {
-    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    min-height: 34px;
+    padding: 0 12px;
+    border-radius: 999px;
+    border: 1px solid rgba(255, 255, 255, 0.56);
+    background: rgba(255, 255, 255, 0.46);
+    color: var(--blinq-text-soft);
     font-size: 12px;
     font-weight: 600;
-    color: #111111;
     list-style: none;
+    cursor: pointer;
   }
 
   .blinq-action-details > summary::-webkit-details-marker {
@@ -3890,29 +4296,26 @@ var EMBED_WIDGET_STYLES = `
 
   .blinq-code {
     margin-top: 10px;
-    padding: 10px 12px;
-    border-radius: 14px;
-    background: var(--blinq-surface-soft);
-    border: 1px solid var(--blinq-border);
+    padding: 12px 14px;
+    border-radius: 20px;
+    border: 1px solid rgba(255, 255, 255, 0.56);
+    background: rgba(255, 255, 255, 0.52);
+    color: var(--blinq-text-soft);
     font-size: 12px;
-    line-height: 1.45;
+    line-height: 1.5;
     white-space: pre-wrap;
-    color: var(--blinq-text-soft);
     font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
   }
 
-  .blinq-code-compact {
-    margin-top: 12px;
-  }
-
   .blinq-action-state {
     margin-top: 12px;
     font-size: 12px;
+    line-height: 1.4;
     color: var(--blinq-text-muted);
   }
 
   .blinq-action-state[data-state="approved"] {
-    color: #111111;
+    color: var(--blinq-text-soft);
   }
 
   .blinq-action-state[data-state="declined"] {
@@ -3929,97 +4332,147 @@ var EMBED_WIDGET_STYLES = `
     flex: 1;
   }
 
-  .blinq-context-grid {
-    display: grid;
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    gap: 12px;
-  }
-
-  .blinq-context-card {
-    min-height: 150px;
-  }
-
-  .blinq-context-card-wide {
-    grid-column: 1 / -1;
-  }
-
-  .blinq-context-copy {
-    font-size: 13px;
-    line-height: 1.5;
-    color: var(--blinq-text-soft);
-  }
-
-  .blinq-empty-card {
-    min-height: 180px;
-    justify-content: center;
-  }
-
   .blinq-badge-pill {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    min-height: 28px;
-    padding: 0 10px;
+    min-height: 30px;
+    padding: 0 12px;
     border-radius: 999px;
+    border: 1px solid rgba(255, 255, 255, 0.54);
+    background: rgba(255, 255, 255, 0.46);
     font-size: 11px;
-    font-weight: 700;
-    letter-spacing: 0.06em;
-    text-transform: uppercase;
+    font-weight: 600;
+    letter-spacing: 0.02em;
+    color: var(--blinq-text-soft);
+    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
   }
 
   .blinq-badge-pill-default {
-    background: rgba(15, 23, 42, 0.05);
-    color: var(--blinq-text-soft);
+    background: rgba(255, 255, 255, 0.5);
   }
 
   .blinq-badge-pill-outline {
-    border: 1px solid var(--blinq-border);
+    background: rgba(247, 248, 250, 0.34);
     color: var(--blinq-text-muted);
-    background: rgba(255,255,255,0.84);
   }
 
   .blinq-badge-pill-soft {
-    background: #f5f5f5;
-    color: #111111;
+    background: rgba(255, 255, 255, 0.68);
+    color: var(--blinq-text-soft);
   }
 
   .blinq-badge-pill-accent {
-    background: #111111;
-    color: #ffffff;
+    background: rgba(243, 245, 249, 0.84);
+    color: var(--blinq-text);
   }
 
   .blinq-composer {
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-    padding: 0 16px 16px;
-    border-top: 1px solid var(--blinq-border);
-    background: #ffffff;
+    padding: 8px 18px 18px;
   }
 
-  .blinq-composer-copy {
+  .blinq-composer-controls {
     display: flex;
-    flex-direction: column;
-    gap: 4px;
   }
 
-  .blinq-composer-title {
-    font-size: 12px;
-    font-weight: 700;
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    color: var(--blinq-text-muted);
+  .blinq-input-shell {
+    position: relative;
+    width: 100%;
   }
 
-  .blinq-composer-hint {
+  .blinq-input,
+  .blinq-recording-input {
+    width: 100%;
+    min-width: 0;
+    height: 58px;
+    padding: 0 54px 0 54px;
+    border-radius: 999px;
+    border: 1px solid var(--blinq-glass-stroke);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(239, 242, 247, 0.54));
+    color: var(--blinq-text);
+    box-shadow:
+      var(--blinq-inner-highlight),
+      0 10px 26px rgba(183, 189, 198, 0.16);
     font-size: 13px;
-    line-height: 1.45;
+    outline: none;
+    backdrop-filter: blur(22px) saturate(170%);
+    -webkit-backdrop-filter: blur(22px) saturate(170%);
+  }
+
+  .blinq-input::placeholder {
     color: var(--blinq-text-muted);
   }
 
-  .blinq-composer-controls {
+  .blinq-recording-input {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+  }
+
+  .blinq-recording-time {
+    flex: none;
+    min-width: 42px;
+    font-size: 12px;
+    font-weight: 600;
+    letter-spacing: 0.04em;
+    color: var(--blinq-text-soft);
+    font-variant-numeric: tabular-nums;
+  }
+
+  .blinq-recording-wave-shell {
+    position: relative;
     display: flex;
-    padding-top: 14px;
+    align-items: center;
+    flex: 1 1 auto;
+    min-width: 0;
+    height: 30px;
+    padding: 0 10px;
+    border-radius: 999px;
+    border: 1px solid rgba(255, 255, 255, 0.54);
+    background:
+      linear-gradient(180deg, rgba(255, 255, 255, 0.54), rgba(242, 245, 248, 0.34));
+    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
+    overflow: hidden;
+  }
+
+  .blinq-recording-wave-shell::before {
+    content: "";
+    position: absolute;
+    left: 10px;
+    right: 10px;
+    top: 50%;
+    height: 1px;
+    border-radius: 999px;
+    background: linear-gradient(90deg, transparent, rgba(17, 17, 17, 0.12), transparent);
+    transform: translateY(-50%);
+    pointer-events: none;
+  }
+
+  .blinq-recording-waveform {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    flex: 1;
+    min-width: 0;
+    height: 100%;
+    overflow: hidden;
+  }
+
+  .blinq-recording-waveform-bar {
+    width: 4px;
+    min-width: 4px;
+    height: 62%;
+    border-radius: 999px;
+    background: linear-gradient(180deg, rgba(17, 17, 17, 0.14), rgba(17, 17, 17, 0.36));
+    transform-origin: center;
+    transition:
+      transform 120ms ease,
+      opacity 160ms ease;
+    opacity: 0.92;
+    box-shadow:
+      0 0 0 1px rgba(255, 255, 255, 0.26),
+      0 2px 8px rgba(17, 17, 17, 0.08);
   }
 
   .blinq-button {
@@ -4027,64 +4480,71 @@ var EMBED_WIDGET_STYLES = `
     align-items: center;
     justify-content: center;
     gap: 8px;
-    border-radius: 14px;
     border: 1px solid transparent;
+    border-radius: 999px;
+    color: var(--blinq-text);
     font-size: 14px;
     font-weight: 600;
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(236, 239, 244, 0.5));
+    box-shadow: var(--blinq-shadow-soft);
+    backdrop-filter: blur(20px) saturate(170%);
+    -webkit-backdrop-filter: blur(20px) saturate(170%);
     transition:
-      background 120ms ease,
-      border-color 120ms ease,
-      color 120ms ease,
-      opacity 120ms ease,
-      transform 120ms ease;
+      transform 160ms ease,
+      box-shadow 180ms ease,
+      border-color 180ms ease,
+      background 180ms ease,
+      opacity 120ms ease;
     cursor: pointer;
     outline: none;
   }
 
-  .blinq-button:disabled {
-    opacity: 0.55;
-    cursor: not-allowed;
+  .blinq-button:hover:not(:disabled) {
+    transform: translateY(-1px);
+    border-color: rgba(255, 255, 255, 0.82);
+    box-shadow:
+      0 14px 28px rgba(175, 181, 191, 0.22),
+      0 4px 10px rgba(189, 195, 204, 0.16);
   }
 
-  .blinq-button:focus-visible,
-  .blinq-input:focus-visible,
-  .blinq-tab-trigger:focus-visible,
-  .blinq-prompt-chip:focus-visible {
-    box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.12);
-    outline: none;
+  .blinq-input-mic:hover:not(:disabled),
+  .blinq-input-send:hover:not(:disabled) {
+    transform: translateY(-50%);
+    border-color: rgba(255, 255, 255, 0.82);
+    box-shadow:
+      0 14px 28px rgba(175, 181, 191, 0.16),
+      0 4px 10px rgba(189, 195, 204, 0.12);
   }
 
-  .blinq-button-default {
-    background: #111111;
-    color: white;
-    box-shadow: 0 12px 24px rgba(17, 17, 17, 0.16);
+  .blinq-button:disabled {
+    opacity: 0.52;
+    cursor: not-allowed;
   }
 
-  .blinq-button-default:hover:not(:disabled) {
-    filter: brightness(1.04);
+  .blinq-button:focus-visible,
+  .blinq-input:focus-visible {
+    box-shadow:
+      0 0 0 3px rgba(255, 255, 255, 0.68),
+      0 0 0 6px rgba(17, 17, 17, 0.08);
   }
 
-  .blinq-button-outline {
-    border-color: var(--blinq-border-strong);
-    background: #ffffff;
+  .blinq-button-default {
+    border-color: rgba(255, 255, 255, 0.74);
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(237, 241, 247, 0.66));
     color: var(--blinq-text);
   }
 
-  .blinq-button-outline:hover:not(:disabled),
-  .blinq-button-ghost:hover:not(:disabled) {
-    background: var(--blinq-surface-soft);
-  }
-
+  .blinq-button-outline,
   .blinq-button-ghost {
-    border-color: var(--blinq-border);
-    background: rgba(255,255,255,0.76);
+    border-color: rgba(255, 255, 255, 0.58);
+    background: rgba(255, 255, 255, 0.42);
     color: var(--blinq-text-soft);
   }
 
   .blinq-button-destructive {
-    background: #111111;
-    border-color: #111111;
-    color: #ffffff;
+    border-color: rgba(255, 255, 255, 0.58);
+    background: linear-gradient(180deg, rgba(248, 249, 251, 0.7), rgba(230, 233, 239, 0.54));
+    color: var(--blinq-text);
   }
 
   .blinq-button-md {
@@ -4093,118 +4553,274 @@ var EMBED_WIDGET_STYLES = `
   }
 
   .blinq-button-sm {
-    height: 36px;
-    padding: 0 12px;
+    height: 38px;
+    padding: 0 13px;
     font-size: 13px;
   }
 
   .blinq-button-icon {
-    width: 44px;
-    height: 44px;
+    width: 48px;
+    height: 48px;
     padding: 0;
   }
 
   .blinq-button-icon-sm {
-    width: 36px;
-    height: 36px;
+    width: 38px;
+    height: 38px;
     padding: 0;
-    border-radius: 12px;
   }
 
-  .blinq-input {
-    width: 100%;
-    min-width: 0;
-    height: 52px;
-    border-radius: 18px;
-    border: 1px solid var(--blinq-border-strong);
-    padding: 0 48px 0 44px;
+  .blinq-input-mic,
+  .blinq-input-send {
+    position: absolute;
+    top: 50%;
+    z-index: 2;
+    width: 42px;
+    height: 42px;
+    min-width: 42px;
+    transform: translateY(-50%);
+  }
+
+  .blinq-input-mic {
+    left: 8px;
+  }
+
+  .blinq-input-send {
+    right: 8px;
+  }
+
+  .blinq-panel {
+    display: flex;
+    flex-direction: column;
+    height: min(720px, calc(100vh - 64px));
+    max-width: 520px;
+    border: 1px solid rgba(226, 232, 240, 0.96);
+    border-radius: 30px;
     background: #ffffff;
-    color: var(--blinq-text);
-    outline: none;
-    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    box-shadow:
+      0 28px 80px rgba(15, 23, 42, 0.14),
+      0 10px 28px rgba(15, 23, 42, 0.08);
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
   }
 
-  .blinq-input-shell {
+  .blinq-panel::before,
+  .blinq-panel::after,
+  .blinq-message::before,
+  .blinq-status-line::before {
+    display: none;
+  }
+
+  .blinq-header {
+    flex: none;
+    gap: 0;
+    padding: 22px 24px 18px;
+    border-bottom: 1px solid rgba(226, 232, 240, 0.86);
+    background: #ffffff;
+  }
+
+  .blinq-header-row {
+    align-items: center;
+    gap: 14px;
+  }
+
+  .blinq-header-copy {
+    gap: 5px;
+  }
+
+  .blinq-heading {
+    font-size: 22px;
+    line-height: 1.05;
+    font-weight: 700;
+    letter-spacing: -0.04em;
+    color: #111827;
+  }
+
+  .blinq-status-line {
+    display: block;
+    max-width: 100%;
+    min-height: 0;
+    padding: 0;
+    border: 0;
+    background: transparent;
+    box-shadow: none;
+    color: #6b7280;
+    font-size: 13px;
+    line-height: 1.35;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+  }
+
+  .blinq-avatar {
     position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 64px;
+    min-width: 64px;
+    height: 64px;
+    overflow: visible;
+    border: 1px solid rgba(226, 232, 240, 0.95);
+    border-radius: 999px;
+    background:
+      radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.86)),
+      #ffffff;
+    box-shadow:
+      0 14px 26px rgba(15, 23, 42, 0.08),
+      inset 0 1px 0 rgba(255, 255, 255, 0.9);
+    color: #111827;
+    flex: none;
+  }
+
+  .blinq-avatar-image {
     width: 100%;
+    height: 100%;
+    border-radius: inherit;
+    object-fit: cover;
   }
 
-  .blinq-recording-input {
+  .blinq-avatar-icon {
+    color: #111827;
+  }
+
+  .blinq-avatar-status {
+    position: absolute;
+    right: 5px;
+    bottom: 6px;
+    width: 11px;
+    height: 11px;
+    border: 2px solid #ffffff;
+    border-radius: 999px;
+    background: #21d262;
+    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.04);
+  }
+
+  .blinq-avatar-label {
+    display: none;
+  }
+
+  .blinq-thread {
     display: flex;
-    align-items: center;
+    flex: 1 1 auto;
+    min-height: 0;
+    background: #ffffff;
+  }
+
+  .blinq-thread-viewport {
+    flex: 1 1 auto;
+    height: 100%;
+  }
+
+  .blinq-scroll {
+    flex: 1 1 auto;
     gap: 12px;
-    width: 100%;
-    min-width: 0;
-    height: 52px;
-    padding: 0 48px 0 44px;
+    max-height: none;
+    min-height: 0;
+    padding: 30px 24px 20px;
+    background: #ffffff;
+  }
+
+  .blinq-message {
+    max-width: 82%;
+    padding: 10px 15px;
+    border: 1px solid rgba(226, 232, 240, 0.96);
     border-radius: 18px;
-    border: 1px solid var(--blinq-border-strong);
     background: #ffffff;
-    color: var(--blinq-text);
-    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
+    box-shadow: none;
+    color: #111827;
+    font-size: 15px;
+    line-height: 1.48;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
   }
 
-  .blinq-recording-time {
-    flex: 0 0 auto;
-    min-width: 42px;
-    font-size: 12px;
-    font-weight: 700;
-    letter-spacing: 0.04em;
-    color: var(--blinq-text-soft);
-    font-variant-numeric: tabular-nums;
+  .blinq-message[data-role="assistant"] {
+    background: #ffffff;
   }
 
-  .blinq-recording-waveform {
-    display: flex;
-    align-items: flex-end;
-    gap: 3px;
-    flex: 1 1 auto;
-    min-width: 0;
-    height: 24px;
-    overflow: hidden;
+  .blinq-message[data-role="user"] {
+    border-color: rgba(209, 213, 219, 0.96);
+    background: #f8fafc;
   }
 
-  .blinq-recording-waveform-bar {
-    width: 3px;
-    min-width: 3px;
-    height: 100%;
+  .blinq-card,
+  .blinq-guide-step-shell,
+  .blinq-plan-step {
+    border-color: rgba(226, 232, 240, 0.92);
+    background: #ffffff;
+    box-shadow: none;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+  }
+
+  .blinq-composer {
+    flex: none;
+    padding: 18px 24px 8px;
+    border-top: 1px solid rgba(226, 232, 240, 0.86);
+    background: #ffffff;
+  }
+
+  .blinq-input,
+  .blinq-recording-input {
+    height: 56px;
+    padding: 0 60px 0 54px;
+    border: 1px solid rgba(209, 213, 219, 0.92);
     border-radius: 999px;
-    background: rgba(17, 17, 17, 0.22);
-    transform-origin: center bottom;
-    transition:
-      transform 110ms ease,
-      background 110ms ease;
+    background: #ffffff;
+    box-shadow: none;
+    color: #111827;
+    font-size: 15px;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+  }
+
+  .blinq-input::placeholder {
+    color: #9ca3af;
   }
 
   .blinq-input-mic {
-    position: absolute;
-    left: 8px;
-    top: 50%;
-    transform: translateY(-50%);
-    z-index: 2;
+    left: 7px;
+    width: 42px;
+    min-width: 42px;
+    height: 42px;
+    border: 0;
+    background: transparent;
+    box-shadow: none;
+    color: #6b7280;
   }
 
   .blinq-input-send {
-    position: absolute;
-    right: 8px;
-    top: 50%;
+    right: 7px;
+    width: 42px;
+    min-width: 42px;
+    height: 42px;
+    border: 0;
+    background: #6b6f76;
+    box-shadow: none;
+    color: #ffffff;
+  }
+
+  .blinq-input-send:hover:not(:disabled) {
     transform: translateY(-50%);
-    z-index: 2;
-    width: 36px;
-    height: 36px;
-    min-width: 36px;
-    border-radius: 12px;
+    background: #4b5563;
+    box-shadow: none;
   }
 
-  .blinq-text-animate {
-    display: block;
+  .blinq-button-ghost {
+    border-color: transparent;
+    background: transparent;
+    box-shadow: none;
   }
 
-  .blinq-text-animate-blur-in .blinq-text-segment {
-    display: inline-block;
-    opacity: 0;
-    filter: blur(8px);
-    animation: blinq-blur-in 420ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
+  .blinq-powered {
+    flex: none;
+    padding: 0 24px 18px;
+    color: #c0c4ca;
+    font-size: 10px;
+    font-weight: 800;
+    letter-spacing: 0.16em;
+    line-height: 1;
+    text-align: center;
   }
 
   @keyframes blinq-thinking-pulse {
@@ -4215,65 +4831,59 @@ var EMBED_WIDGET_STYLES = `
 
     50% {
       opacity: 1;
-      transform: translateY(-2px);
+      transform: translateY(-1.5px);
     }
   }
 
-  @keyframes blinq-agent-spin {
-    from {
-      transform: rotate(0deg);
+  @keyframes blinq-copy-reveal {
+    0% {
+      opacity: 0;
+      transform: translateY(3px);
     }
 
-    to {
-      transform: rotate(360deg);
+    100% {
+      opacity: 1;
+      transform: translateY(0);
     }
   }
 
-  @keyframes blinq-agent-bob {
-    0%, 100% {
-      transform: translateY(0);
+  @keyframes blinq-orbit-drift {
+    from {
+      transform: rotate(0deg);
     }
 
-    50% {
-      transform: translateY(-0.8px);
+    to {
+      transform: rotate(360deg);
     }
   }
 
-  @keyframes blinq-agent-spark {
+  @keyframes blinq-orbit-pulse {
     0%, 100% {
       transform: scale(1);
-      opacity: 0.72;
+      opacity: 0.9;
     }
 
     50% {
-      transform: scale(1.25);
+      transform: scale(1.16);
       opacity: 1;
     }
   }
 
-  @keyframes blinq-blur-in {
-    0% {
-      opacity: 0;
-      filter: blur(8px);
-      transform: translateY(4px);
+  @keyframes blinq-core-breathe {
+    0%, 100% {
+      transform: scale(1);
     }
 
-    100% {
-      opacity: 1;
-      filter: blur(0);
-      transform: translateY(0);
+    50% {
+      transform: scale(1.04);
     }
   }
 
-  .blinq-input::placeholder {
-    color: var(--blinq-text-muted);
-  }
-
   @media (max-width: 720px) {
     .blinq-shell {
-      bottom: 12px;
-      left: 12px;
       right: 12px;
+      left: 12px;
+      bottom: 12px;
       width: auto;
       max-width: none;
       align-items: stretch;
@@ -4281,43 +4891,212 @@ var EMBED_WIDGET_STYLES = `
 
     .blinq-shell[data-side="left"],
     .blinq-shell[data-side="right"] {
-      left: 12px;
       right: 12px;
+      left: 12px;
       align-items: stretch;
     }
 
     .blinq-panel,
     .blinq-launcher {
-      max-width: none;
       width: 100%;
+      max-width: none;
     }
 
-    .blinq-workspace {
-      grid-template-columns: 1fr;
+    .blinq-launcher {
+      width: 76px;
+      min-width: 76px;
+      height: 76px;
+      align-self: flex-end;
     }
 
-    .blinq-sidebar {
-      border-right: none;
-      border-bottom: 1px solid var(--blinq-border);
+    .blinq-message {
+      max-width: 92%;
     }
 
-    .blinq-sidebar-group {
-      flex-direction: row;
-      overflow-x: auto;
+    .blinq-actions {
+      flex-direction: column;
     }
 
-    .blinq-tab-trigger {
-      min-width: 116px;
+    .blinq-input,
+    .blinq-recording-input {
+      height: 56px;
     }
 
-    .blinq-context-grid {
-      grid-template-columns: 1fr;
+    .blinq-panel {
+      height: min(700px, calc(100vh - 24px));
     }
   }
 `;
 
 // src/browser.ts
 var EMBED_TAG_NAME = "blinq-widget";
+var TRAINER_PARAM = "blinqTrainer";
+function isTrainerMode() {
+  if (typeof window === "undefined") {
+    return false;
+  }
+  return new URLSearchParams(window.location.search).get(TRAINER_PARAM) === "1";
+}
+function trainerParentOrigin() {
+  if (typeof window === "undefined") {
+    return "*";
+  }
+  if (!document.referrer) {
+    return window.location.origin;
+  }
+  try {
+    return new URL(document.referrer).origin;
+  } catch {
+    return window.location.origin;
+  }
+}
+function isLikelyAuthRoute(pathname) {
+  const normalized = pathname.toLowerCase();
+  return normalized.includes("/login") || normalized.includes("/signin") || normalized.includes("/sign-in") || normalized.includes("/signup") || normalized.includes("/sign-up") || normalized.includes("/auth");
+}
+function postTrainerEvent(eventType, payload) {
+  if (typeof window === "undefined" || window.parent === window) {
+    return;
+  }
+  window.parent.postMessage(
+    {
+      source: "blinq-trainer",
+      kind: "event",
+      event_type: eventType,
+      payload
+    },
+    trainerParentOrigin()
+  );
+}
+function defineGenericTrainerBridge() {
+  if (typeof window === "undefined" || window.parent === window || !isTrainerMode() || window.__blinqTrainerBridgeInstalled) {
+    return;
+  }
+  window.__blinqTrainerBridgeInstalled = true;
+  let cancelled = false;
+  const registry = new PageToolRegistry(async () => false);
+  registry.setActionPolicy({
+    actions_enabled: true,
+    action_mode: "execute_with_confirmation",
+    pointer_overlay_enabled: true
+  });
+  let nativeRegistered = false;
+  const parentOrigin = trainerParentOrigin();
+  const sendReady = async () => {
+    nativeRegistered = await registry.registerNativeTools().catch(() => false);
+    postTrainerEvent("runner_ready", {
+      url: window.location.href,
+      secure_context: window.isSecureContext,
+      native_webmcp_supported: detectNativeWebMcpSupport(),
+      native_webmcp_registered: nativeRegistered,
+      runtime_mode: nativeRegistered ? "native-webmcp-active" : "read-only-fallback"
+    });
+  };
+  const handleCommand = (event) => {
+    if (event.origin !== parentOrigin) {
+      return;
+    }
+    const data = event.data;
+    if (data?.source !== "blinq-suggestions" || data?.type !== "command" || !data.name) {
+      return;
+    }
+    if (data.name === "collect_context") {
+      postTrainerEvent("page_context", {
+        url: window.location.href,
+        authenticated: !isLikelyAuthRoute(window.location.pathname),
+        secure_context: window.isSecureContext,
+        native_webmcp_supported: detectNativeWebMcpSupport(),
+        native_webmcp_registered: nativeRegistered,
+        page_context: collectNormalizedPageContext()
+      });
+      return;
+    }
+    if (data.name === "execute_tool") {
+      const toolName = typeof data.payload?.tool_name === "string" ? data.payload.tool_name : "";
+      const displayName = typeof data.payload?.display_name === "string" ? data.payload.display_name : void 0;
+      const targetSummary = typeof data.payload?.target_summary === "string" ? data.payload.target_summary : void 0;
+      const requiresConfirmation = Boolean(data.payload?.requires_confirmation);
+      const argumentsPayload = data.payload?.arguments && typeof data.payload.arguments === "object" && !Array.isArray(data.payload.arguments) ? data.payload.arguments : {};
+      if (!toolName) {
+        postTrainerEvent("tool_result", {
+          status: "error",
+          error: "\u041D\u0435 \u043F\u0435\u0440\u0435\u0434\u0430\u043D tool_name \u0434\u043B\u044F \u0442\u0440\u0435\u043D\u0438\u0440\u043E\u0432\u043A\u0438.",
+          current_url: window.location.href
+        });
+        return;
+      }
+      void (async () => {
+        const outcome = await registry.executeTool({
+          tool_name: toolName,
+          display_name: displayName,
+          target_summary: targetSummary,
+          requires_confirmation: requiresConfirmation,
+          arguments: argumentsPayload
+        });
+        const result = outcome.status === "success" && outcome.result && typeof outcome.result === "object" ? outcome.result : null;
+        postTrainerEvent("tool_result", {
+          status: outcome.status,
+          result,
+          error: outcome.error,
+          current_url: window.location.href,
+          page_context: result && typeof result === "object" && result.deferred_navigation ? null : collectNormalizedPageContext()
+        });
+        if (outcome.status === "success" && result && typeof result === "object" && result.deferred_navigation && typeof result.href === "string" && result.href.trim()) {
+          window.setTimeout(() => {
+            window.location.href = result.href;
+          }, 40);
+        }
+      })();
+      return;
+    }
+    if (data.name !== "preview_targets") {
+      return;
+    }
+    const rawTargets = Array.isArray(data.payload?.targets) ? data.payload.targets : [];
+    const targets = [];
+    for (const target of rawTargets) {
+      if (!target || typeof target !== "object") {
+        continue;
+      }
+      const selector = typeof target.selector === "string" ? target.selector.trim() : "";
+      const label = typeof target.label === "string" ? target.label.trim() : void 0;
+      if (!selector) {
+        continue;
+      }
+      targets.push({ selector, label: label || void 0 });
+    }
+    void (async () => {
+      for (const target of targets) {
+        if (cancelled) {
+          return;
+        }
+        registry.highlightTargets([target], {
+          interaction: "explain",
+          durationMs: 1500
+        });
+        await new Promise((resolve) => window.setTimeout(resolve, 1120));
+      }
+      if (cancelled) {
+        return;
+      }
+      postTrainerEvent("preview_complete", {
+        url: window.location.href
+      });
+    })();
+  };
+  sendReady();
+  window.setTimeout(() => void sendReady(), 180);
+  window.setTimeout(() => void sendReady(), 560);
+  window.addEventListener("message", handleCommand);
+  window.addEventListener(
+    "beforeunload",
+    () => {
+      cancelled = true;
+      registry.destroy();
+    },
+    { once: true }
+  );
+}
 function shadowRootStyles() {
   return EMBED_WIDGET_STYLES;
 }
@@ -4329,6 +5108,10 @@ var BlinqWidgetElement = class extends HTMLElement {
     if (this.widget || this.widgetPromise) {
       return;
     }
+    if (isTrainerMode()) {
+      this.style.display = "none";
+      return;
+    }
     const publicToken = this.getAttribute("public-token")?.trim();
     if (!publicToken) {
       console.error("Blinq widget: missing required public-token attribute.");
@@ -4376,6 +5159,7 @@ function defineBlinqWidgetElement() {
 }
 if (typeof window !== "undefined") {
   defineBlinqWidgetElement();
+  defineGenericTrainerBridge();
   window.BlinqWidget = {
     init,
     initFromConfig