ttp-agent-sdk 2.45.14 → 2.46.1

package/dist/agent-widget.dev.js

@@ -11468,11 +11468,57 @@ var TextChatSDK = /*#__PURE__*/function (_EventEmitter) {
   }
 
   /**
-   * Send a raw JSON message immediately on the open WebSocket. Used by the
-   * client-tool registry — bypasses the LLM-turn queue used by sendMessage().
+   * In-call user settings on the text channel — only responseLength applies
+   * ("detailed"|"normal"|"brief"|"very_brief"; folded into the system prompt
+   * from the next LLM turn). Mirrors VoiceSDK.setCallSettings().
+   * @param {{responseLength?: string}} settings
    */
   _inherits(TextChatSDK, _EventEmitter);
   return _createClass(TextChatSDK, [{
+    key: "setCallSettings",
+    value: function setCallSettings() {
+      var settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      this._callSettings = _objectSpread(_objectSpread({}, this._callSettings || {}), settings);
+      if (!this.connected || !this.ws || !this._callSettings.responseLength) {
+        return false;
+      }
+      this.sendRaw({
+        t: 'call_settings',
+        responseLength: this._callSettings.responseLength
+      });
+      return true;
+    }
+
+    /** Flush the persisted response-length preference right after hello_ack. */
+  }, {
+    key: "_syncCallSettingsAfterHello",
+    value: function _syncCallSettingsAfterHello() {
+      try {
+        var s = this._callSettings;
+        if (!s && typeof this.config.callSettingsProvider === 'function') {
+          s = this.config.callSettingsProvider();
+        }
+        if (!s) return;
+        this._callSettings = _objectSpread({}, s);
+        var length = s.responseLength || 'normal';
+        if (length === 'normal') return;
+        this.sendRaw({
+          t: 'call_settings',
+          responseLength: length
+        });
+        console.log('⚙️ [TextChatSDK] Synced persisted call settings:', {
+          responseLength: length
+        });
+      } catch (e) {
+        console.warn('⚙️ [TextChatSDK] Failed to sync call settings (ignored):', e);
+      }
+    }
+
+    /**
+     * Send a raw JSON message immediately on the open WebSocket. Used by the
+     * client-tool registry — bypasses the LLM-turn queue used by sendMessage().
+     */
+  }, {
     key: "sendRaw",
     value: function sendRaw(message) {
       if (!this.connected || !this.ws) {
@@ -11626,6 +11672,9 @@ var TextChatSDK = /*#__PURE__*/function (_EventEmitter) {
                 hash: data.disclaimersHash
               });
             }
+            // Silently re-apply the user's persisted response-length preference
+            // (voice speed is meaningless on the text channel).
+            _this2._syncCallSettingsAfterHello();
             // Tools are loaded, connection is ready — drain any queued messages
             _this2.drainQueue();
             return;
@@ -11944,7 +11993,7 @@ var TextChatSDK = /*#__PURE__*/function (_EventEmitter) {
 
       // SDK build time for debugging
       if (true) {
-        helloMessage.lastBuildTime = "2026-06-29T06:35:24.857Z";
+        helloMessage.lastBuildTime = "2026-07-13T08:30:44.984Z";
       }
       try {
         this.ws.send(JSON.stringify(helloMessage));
@@ -13531,6 +13580,8 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  *   strip.updateTimer(text)
  *   strip.setMuted(bool)  – legacy sync (prefer syncFromVoice)
  *   strip.setHeld(bool)   – legacy pause visual (maps to paused)
+ *   strip.updateRecipes(recipes) – refresh saved-recipes badge + popover
+ *   strip.pulseRecipeBadge() – celebrate animation after recipe modal closes
  *   strip.destroy()
  */
 
@@ -13562,7 +13613,13 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
     this.onToggleSpeaker = opts.onToggleSpeaker || function () {};
     this.onSendText = opts.onSendText || function () {};
     this.onAbout = typeof opts.onAbout === 'function' ? opts.onAbout : null;
+    this.onSettings = typeof opts.onSettings === 'function' ? opts.onSettings : null;
+    this.onRecipeSelect = typeof opts.onRecipeSelect === 'function' ? opts.onRecipeSelect : null;
     this._kbdOpen = false;
+    this._recipePopoverOpen = false;
+    this._recipes = [];
+    this._recipeUnsub = null;
+    this._pulseTimer = null;
     this._el = null;
     this._build();
   }
@@ -13650,7 +13707,7 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
     key: "_footerHtml",
     value: function _footerHtml() {
       var brand = this.footer ? "<span>Powered by <a href=\"".concat(this.footer.brandUrl, "\" target=\"_blank\" rel=\"noopener noreferrer\"><b>").concat(this.footer.brandName, "</b></a></span>") : '';
-      return "\n        <div id=\"ttp-ecom-footer\" class=\"ttp-ecom-footer\">\n          ".concat(brand, "\n          <button type=\"button\" class=\"ttp-ecom-info-btn\" id=\"ttp-ecom-btn-info\" title=\"About\" aria-label=\"About\">\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <circle cx=\"12\" cy=\"12\" r=\"9\"/>\n              <line x1=\"12\" y1=\"11\" x2=\"12\" y2=\"16\"/>\n              <circle cx=\"12\" cy=\"7.7\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>\n            </svg>\n          </button>\n        </div>");
+      return "\n        <div id=\"ttp-ecom-footer\" class=\"ttp-ecom-footer\">\n          ".concat(brand, "\n          <div class=\"ttp-ecom-recipe-wrap\" id=\"ttp-ecom-recipe-wrap\" hidden>\n            <button type=\"button\" class=\"ttp-ecom-recipe-btn\" id=\"ttp-ecom-btn-recipe\"\n              title=\"Saved recipes\" aria-label=\"Saved recipes\" aria-expanded=\"false\" aria-haspopup=\"true\">\n              <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.65\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                <path d=\"M5.5 3V8\"/>\n                <path d=\"M7.5 3V8\"/>\n                <path d=\"M9.5 3V8\"/>\n                <path d=\"M7.5 8V21\"/>\n                <path d=\"M16.5 3V21\"/>\n                <path d=\"M16.5 3C19 3 20.5 5.2 20.5 7.5V10\"/>\n              </svg>\n              <span class=\"ttp-ecom-recipe-count\" id=\"ttp-ecom-recipe-count\">0</span>\n            </button>\n            <div class=\"ttp-ecom-recipe-popover\" id=\"ttp-ecom-recipe-popover\" role=\"menu\" hidden></div>\n          </div>\n          <button type=\"button\" class=\"ttp-ecom-info-btn\" id=\"ttp-ecom-btn-settings\" title=\"Call settings\" aria-label=\"Call settings\">\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <circle cx=\"12\" cy=\"12\" r=\"3\"/>\n              <path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33h.01a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51h.01a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82v.01a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\"/>\n            </svg>\n          </button>\n          <button type=\"button\" class=\"ttp-ecom-info-btn\" id=\"ttp-ecom-btn-info\" title=\"About\" aria-label=\"About\">\n            <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <circle cx=\"12\" cy=\"12\" r=\"9\"/>\n              <line x1=\"12\" y1=\"11\" x2=\"12\" y2=\"16\"/>\n              <circle cx=\"12\" cy=\"7.7\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>\n            </svg>\n          </button>\n        </div>");
     }
   }, {
     key: "_wireEvents",
@@ -13685,6 +13742,13 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
           if (_this.onAbout) _this.onAbout();
         });
       }
+      var settingsBtn = $('ttp-ecom-btn-settings');
+      if (settingsBtn) {
+        settingsBtn.addEventListener('click', function () {
+          if (_this.onSettings) _this.onSettings();
+        });
+      }
+      this._wireRecipeBadge();
       $('ttp-ecom-btn-end').addEventListener('click', function () {
         return _this.onHangup();
       });
@@ -13701,10 +13765,141 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
         if (e.key === 'Enter') sendFn();
       });
     }
+
+    /**
+     * Subscribe to a recipe store; hydrates badge on mount.
+     * @param {{ subscribe: Function, getAll: Function }} store
+     */
+  }, {
+    key: "bindRecipeStore",
+    value: function bindRecipeStore(store) {
+      var _this2 = this;
+      if (this._recipeUnsub) {
+        this._recipeUnsub();
+        this._recipeUnsub = null;
+      }
+      if (!store) return;
+      this.updateRecipes(store.getAll());
+      this._recipeUnsub = store.subscribe(function (recipes) {
+        return _this2.updateRecipes(recipes);
+      });
+    }
+
+    /**
+     * @param {Array<{ id: string, title: string }>} recipes
+     */
+  }, {
+    key: "updateRecipes",
+    value: function updateRecipes(recipes) {
+      this._recipes = Array.isArray(recipes) ? recipes : [];
+      if (!this._el) return;
+      var wrap = this._el.querySelector('#ttp-ecom-recipe-wrap');
+      var countEl = this._el.querySelector('#ttp-ecom-recipe-count');
+      var btn = this._el.querySelector('#ttp-ecom-btn-recipe');
+      if (!wrap || !countEl || !btn) return;
+      var n = this._recipes.length;
+      countEl.textContent = String(n);
+      wrap.hidden = n === 0;
+      if (this._recipePopoverOpen) this._renderRecipePopover();
+    }
+
+    /** Play a short celebrate animation to draw attention after saving a recipe. */
+  }, {
+    key: "pulseRecipeBadge",
+    value: function pulseRecipeBadge() {
+      if (!this._el || this._recipes.length === 0) return;
+      var btn = this._el.querySelector('#ttp-ecom-btn-recipe');
+      var countEl = this._el.querySelector('#ttp-ecom-recipe-count');
+      if (!btn) return;
+      if (this._pulseTimer) {
+        clearTimeout(this._pulseTimer);
+        this._pulseTimer = null;
+      }
+      btn.classList.remove('ttp-ecom-recipe-btn--celebrate');
+      countEl === null || countEl === void 0 || countEl.classList.remove('ttp-ecom-recipe-count--pop');
+      // Force reflow so re-adding the class retriggers the animation.
+      void btn.offsetWidth;
+      btn.classList.add('ttp-ecom-recipe-btn--celebrate');
+      countEl === null || countEl === void 0 || countEl.classList.add('ttp-ecom-recipe-count--pop');
+      var _cleanup = function cleanup() {
+        btn.classList.remove('ttp-ecom-recipe-btn--celebrate');
+        countEl === null || countEl === void 0 || countEl.classList.remove('ttp-ecom-recipe-count--pop');
+        btn.removeEventListener('animationend', _cleanup);
+      };
+      btn.addEventListener('animationend', _cleanup);
+      this._pulseTimer = setTimeout(_cleanup, 1600);
+    }
+  }, {
+    key: "_wireRecipeBadge",
+    value: function _wireRecipeBadge() {
+      var _this$_el,
+        _this$_el2,
+        _this3 = this;
+      var btn = (_this$_el = this._el) === null || _this$_el === void 0 ? void 0 : _this$_el.querySelector('#ttp-ecom-btn-recipe');
+      var popover = (_this$_el2 = this._el) === null || _this$_el2 === void 0 ? void 0 : _this$_el2.querySelector('#ttp-ecom-recipe-popover');
+      if (!btn || !popover) return;
+      btn.addEventListener('click', function (e) {
+        e.stopPropagation();
+        _this3._recipePopoverOpen = !_this3._recipePopoverOpen;
+        btn.setAttribute('aria-expanded', _this3._recipePopoverOpen ? 'true' : 'false');
+        if (_this3._recipePopoverOpen) {
+          _this3._renderRecipePopover();
+          popover.hidden = false;
+        } else {
+          popover.hidden = true;
+        }
+      });
+      this._recipeOutsideClick = function (e) {
+        if (!_this3._recipePopoverOpen) return;
+        if (btn.contains(e.target) || popover.contains(e.target)) return;
+        _this3._recipePopoverOpen = false;
+        btn.setAttribute('aria-expanded', 'false');
+        popover.hidden = true;
+      };
+      document.addEventListener('click', this._recipeOutsideClick);
+    }
+  }, {
+    key: "_renderRecipePopover",
+    value: function _renderRecipePopover() {
+      var _this$_el3,
+        _this4 = this;
+      var popover = (_this$_el3 = this._el) === null || _this$_el3 === void 0 ? void 0 : _this$_el3.querySelector('#ttp-ecom-recipe-popover');
+      if (!popover) return;
+      var items = this._recipes.slice(0, 3);
+      var rows = items.map(function (r) {
+        return "\n      <button type=\"button\" class=\"ttp-ecom-recipe-row\" data-recipe-id=\"".concat(_this4._escapeAttr(r.id), "\" role=\"menuitem\">\n        <span class=\"ttp-ecom-recipe-row-title\">").concat(_this4._escapeHtml(r.title), "</span>\n      </button>");
+      }).join('');
+      var more = this._recipes.length > 3 ? "<div class=\"ttp-ecom-recipe-more\">".concat(this._recipes.length - 3, " more saved</div>") : '';
+      popover.innerHTML = "\n      <span class=\"ttp-ecom-recipe-popover-label\">Saved recipes</span>\n      ".concat(rows, "\n      ").concat(more);
+      popover.querySelectorAll('.ttp-ecom-recipe-row').forEach(function (row) {
+        row.addEventListener('click', function (e) {
+          var _this4$_el;
+          e.stopPropagation();
+          var id = row.getAttribute('data-recipe-id');
+          var recipe = _this4._recipes.find(function (r) {
+            return r.id === id;
+          });
+          if (recipe && _this4.onRecipeSelect) _this4.onRecipeSelect(recipe);
+          _this4._recipePopoverOpen = false;
+          popover.hidden = true;
+          (_this4$_el = _this4._el) === null || _this4$_el === void 0 || (_this4$_el = _this4$_el.querySelector('#ttp-ecom-btn-recipe')) === null || _this4$_el === void 0 || _this4$_el.setAttribute('aria-expanded', 'false');
+        });
+      });
+    }
+  }, {
+    key: "_escapeHtml",
+    value: function _escapeHtml(str) {
+      return String(str !== null && str !== void 0 ? str : '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+    }
+  }, {
+    key: "_escapeAttr",
+    value: function _escapeAttr(str) {
+      return this._escapeHtml(str).replace(/'/g, '&#39;');
+    }
   }, {
     key: "show",
     value: function show() {
-      var _this2 = this;
+      var _this5 = this;
       var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       if (!this._el) return;
       if (opts.reset !== false) this._reset();
@@ -13712,7 +13907,7 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
       this.syncFromVoice();
       // Now that the strip has real dimensions, clamp any restored drag position.
       if (this._dragEnabled) requestAnimationFrame(function () {
-        return _this2.reclampDrag();
+        return _this5.reclampDrag();
       });
     }
   }, {
@@ -13768,8 +13963,8 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
   }, {
     key: "_syncMiniWave",
     value: function _syncMiniWave(frozen) {
-      var _this$_el;
-      (_this$_el = this._el) === null || _this$_el === void 0 || _this$_el.querySelectorAll('.ttp-ecom-mini-wave .ttp-ecom-wb').forEach(function (b) {
+      var _this$_el4;
+      (_this$_el4 = this._el) === null || _this$_el4 === void 0 || _this$_el4.querySelectorAll('.ttp-ecom-mini-wave .ttp-ecom-wb').forEach(function (b) {
         b.classList.toggle('paused', frozen);
       });
     }
@@ -13859,7 +14054,7 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
   }, {
     key: "enableDrag",
     value: function enableDrag() {
-      var _this3 = this;
+      var _this6 = this;
       var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       if (!this._el || this._dragEnabled) return;
       var wrapper = this._el; // fixed, centered via translateX(-50%)
@@ -13888,8 +14083,8 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
           dy = e.clientY - startY;
         if (!moved && Math.hypot(dx, dy) < THRESHOLD) return;
         moved = true;
-        _this3._dragOffset = _this3._clampDragOffset(baseX + dx, baseY + dy, baseRect);
-        _this3._applyDragOffset();
+        _this6._dragOffset = _this6._clampDragOffset(baseX + dx, baseY + dy, baseRect);
+        _this6._applyDragOffset();
       };
       var _onUp = function onUp(e) {
         window.removeEventListener('pointermove', onMove);
@@ -13899,9 +14094,9 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
           handle.releasePointerCapture(e.pointerId);
         } catch (err) {/* not captured */}
         dragging = false;
-        if (moved && _this3._dragPersist && _this3._dragKey) {
+        if (moved && _this6._dragPersist && _this6._dragKey) {
           try {
-            window.localStorage.setItem(_this3._dragKey, JSON.stringify(_this3._dragOffset));
+            window.localStorage.setItem(_this6._dragKey, JSON.stringify(_this6._dragOffset));
           } catch (err) {/* unavailable */}
         }
       };
@@ -13913,9 +14108,9 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
         moved = false;
         startX = e.clientX;
         startY = e.clientY;
-        baseX = _this3._dragOffset.x;
-        baseY = _this3._dragOffset.y;
-        baseRect = _this3._dragBaseRect();
+        baseX = _this6._dragOffset.x;
+        baseY = _this6._dragOffset.y;
+        baseRect = _this6._dragBaseRect();
         handle.style.setProperty('cursor', 'grabbing');
         try {
           handle.setPointerCapture(e.pointerId);
@@ -14019,6 +14214,18 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
   }, {
     key: "destroy",
     value: function destroy() {
+      if (this._recipeUnsub) {
+        this._recipeUnsub();
+        this._recipeUnsub = null;
+      }
+      if (this._recipeOutsideClick) {
+        document.removeEventListener('click', this._recipeOutsideClick);
+        this._recipeOutsideClick = null;
+      }
+      if (this._pulseTimer) {
+        clearTimeout(this._pulseTimer);
+        this._pulseTimer = null;
+      }
       if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
       this._el = null;
       var style = document.getElementById('ttp-ecom-strip-styles');
@@ -14027,12 +14234,12 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
   }, {
     key: "_reset",
     value: function _reset() {
-      var _this4 = this,
+      var _this7 = this,
         _$,
         _$2;
       this._kbdOpen = false;
       var $ = function $(id) {
-        return _this4._el.querySelector('#' + id);
+        return _this7._el.querySelector('#' + id);
       };
       var tx = $('ttp-ecom-transcript');
       if (tx) {
@@ -14075,7 +14282,7 @@ var EcommerceVoiceStrip = /*#__PURE__*/function () {
     }
   }]);
 }();
-EcommerceVoiceStrip._CSS = "\n#ttp-ecom-strip-wrapper {\n  position: fixed;\n  left: 50%;\n  bottom: 0;\n  transform: translateX(-50%);\n  width: min(720px, calc(100vw - 40px));\n  max-width: calc(100vw - 40px);\n  z-index: 2147483647;\n  box-sizing: border-box;\n  padding: 0 14px max(14px, env(safe-area-inset-bottom, 0px));\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  font-feature-settings: \"kern\" 1, \"liga\" 1;\n  pointer-events: none;\n}\n#ttp-ecom-strip-wrapper * { box-sizing: border-box; }\n\n/* Layered glass dock: rim light, soft lift, optional backdrop tint */\n#ttp-ecom-strip {\n  pointer-events: auto;\n  position: relative;\n  isolation: isolate;\n  margin: 0;\n  border-radius: 26px;\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  background: var(--ecom-strip-bg, linear-gradient(145deg, #5b21b6 0%, #3730a3 42%, #1e1b4b 100%));\n  background-clip: padding-box;\n  color: var(--ecom-fg, #ffffff);\n  box-shadow:\n    0 0 0 1px rgba(0, 0, 0, 0.18) inset,\n    0 1px 0 rgba(255, 255, 255, 0.14) inset,\n    0 -20px 40px -8px rgba(0, 0, 0, 0.22) inset,\n    0 12px 32px rgba(0, 0, 0, 0.22),\n    0 28px 56px -16px rgba(0, 0, 0, 0.45),\n    0 0 80px -20px rgba(99, 102, 241, 0.35);\n  overflow: visible;\n}\n\n#ttp-ecom-strip::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  pointer-events: none;\n  z-index: 0;\n  background: linear-gradient(\n    165deg,\n    rgba(255, 255, 255, 0.08) 0%,\n    rgba(255, 255, 255, 0) 42%,\n    rgba(0, 0, 0, 0.12) 100%\n  );\n}\n\n/* LIVE chip \u2014 glass capsule (backdrop blur), straddles top edge */\n#ttp-ecom-live-edge {\n  position: absolute;\n  left: 50%;\n  top: 0;\n  transform: translate(-50%, -50%);\n  z-index: 4;\n  max-width: calc(100% - 52px);\n  pointer-events: none;\n  padding: 3px 14px 4px;\n  border-radius: 999px;\n  background: rgba(8, 6, 24, 0.78);\n  border: 1px solid rgba(255, 255, 255, 0.28);\n  box-shadow:\n    0 0 0 1px rgba(0, 0, 0, 0.35),\n    0 4px 16px rgba(0, 0, 0, 0.35),\n    inset 0 1px 0 rgba(255, 255, 255, 0.12);\n}\n@supports (backdrop-filter: blur(1px)) {\n  #ttp-ecom-live-edge {\n    backdrop-filter: blur(14px) saturate(180%);\n    -webkit-backdrop-filter: blur(14px) saturate(180%);\n  }\n}\n\n#ttp-ecom-main-row {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 18px 16px 12px;\n  min-height: 48px;\n}\n\n#ttp-ecom-footer {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 0 16px 10px;\n  margin-top: -4px;\n  border-top: 1px solid rgba(255, 255, 255, 0.06);\n  padding-top: 6px;\n}\n.ttp-ecom-info-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 2px;\n  margin: 0;\n  background: none;\n  border: none;\n  cursor: pointer;\n  line-height: 0;\n  border-radius: 50%;\n  color: rgba(255, 255, 255, 0.35);\n  transition: color 0.2s, background 0.2s;\n}\n.ttp-ecom-info-btn:hover {\n  color: rgba(255, 255, 255, 0.7);\n  background: rgba(255, 255, 255, 0.08);\n}\n.ttp-ecom-info-btn svg { display: block; }\n#ttp-ecom-footer span {\n  font-size: 10px;\n  color: rgba(255, 255, 255, 0.35);\n  white-space: nowrap;\n}\n#ttp-ecom-footer a {\n  color: rgba(167, 139, 250, 0.95);\n  text-decoration: none;\n  font-weight: 600;\n}\n#ttp-ecom-footer a:hover { opacity: 0.85; }\n#ttp-ecom-footer a b { font-weight: 700; }\n\n#ttp-ecom-left-controls,\n#ttp-ecom-right-cluster {\n  display: flex;\n  align-items: center;\n  gap: 7px;\n  flex-shrink: 0;\n}\n\n/* Inset \u201Cmeter bridge\u201D for transcript \u2014 keeps one-line layout, adds depth */\n#ttp-ecom-center {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: center;\n  text-align: start;\n  padding: 7px 12px 7px 14px;\n  border-radius: 16px;\n  background: rgba(0, 0, 0, 0.16);\n  border: 1px solid rgba(255, 255, 255, 0.08);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.07),\n    inset 0 -1px 0 rgba(0, 0, 0, 0.12);\n}\n\n#ttp-ecom-live-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  min-width: 0;\n}\n\n#ttp-ecom-live-label {\n  font-size: 9px;\n  font-weight: 800;\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n  color: var(--ecom-accent, #4ade80);\n  opacity: 0.98;\n  white-space: nowrap;\n}\n\n#ttp-ecom-dot {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: var(--ecom-accent, #4ade80);\n  flex-shrink: 0;\n  box-shadow: 0 0 14px rgba(74, 222, 128, 0.45);\n  animation: ttp-ecom-blink 1.35s ease-in-out infinite;\n}\n#ttp-ecom-dot.paused {\n  animation: none;\n  opacity: 0.45;\n  background: rgba(255,255,255,0.35);\n  box-shadow: none;\n}\n@keyframes ttp-ecom-blink {\n  0%, 100% { opacity: 1; transform: scale(1); }\n  50% { opacity: 0.25; transform: scale(0.92); }\n}\n\n#ttp-ecom-transcript {\n  font-size: 12px;\n  line-height: 1.42;\n  letter-spacing: 0.015em;\n  color: rgba(255, 255, 255, 0.94);\n  width: 100%;\n  max-width: 100%;\n  overflow: hidden;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n}\n\n#ttp-ecom-transcript.ttp-ecom-transcript--user {\n  color: rgba(255, 244, 214, 0.98);\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  text-shadow: 0 0 28px rgba(251, 191, 36, 0.22);\n}\n\n/* Squircle glass controls */\n#ttp-ecom-strip .ttp-ecom-ctrl {\n  width: 36px;\n  height: 36px;\n  border-radius: 12px;\n  border: 1px solid rgba(255, 255, 255, 0.16);\n  background: linear-gradient(165deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.05) 100%);\n  color: rgba(255, 255, 255, 0.92);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  position: relative;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.18),\n    0 2px 8px rgba(0, 0, 0, 0.15);\n  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.14s ease;\n  outline: none;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl:hover {\n  background: linear-gradient(165deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.08) 100%);\n  border-color: rgba(255, 255, 255, 0.32);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.22),\n    0 4px 14px rgba(0, 0, 0, 0.2);\n}\n#ttp-ecom-strip .ttp-ecom-ctrl:active { transform: scale(0.94); }\n#ttp-ecom-strip .ttp-ecom-ctrl:focus-visible {\n  outline: 2px solid rgba(165, 180, 252, 0.95);\n  outline-offset: 2px;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-active {\n  background: linear-gradient(165deg, rgba(129, 140, 248, 0.45) 0%, rgba(99, 102, 241, 0.28) 100%) !important;\n  border-color: rgba(196, 181, 253, 0.65) !important;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.2),\n    0 0 0 1px rgba(99, 102, 241, 0.35),\n    0 6px 18px rgba(79, 70, 229, 0.35) !important;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-warn {\n  background: linear-gradient(165deg, rgba(252, 165, 165, 0.22) 0%, rgba(239, 68, 68, 0.2) 100%) !important;\n  border-color: rgba(252, 165, 165, 0.55) !important;\n}\n\n#ttp-ecom-strip .ttp-ecom-ctrl-end {\n  width: 40px;\n  height: 40px;\n  border-radius: 14px;\n  background: linear-gradient(165deg, #fb7185 0%, var(--ecom-end, #ef4444) 52%, #991b1b 100%) !important;\n  border: none !important;\n  color: #fff !important;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.25),\n    0 0 0 2px rgba(0, 0, 0, 0.12),\n    0 6px 22px rgba(239, 68, 68, 0.48);\n  transform: rotate(135deg);\n  transition: filter 0.18s ease, transform 0.14s ease, box-shadow 0.2s ease;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-end:hover {\n  filter: brightness(1.06);\n  transform: rotate(135deg) scale(1.05);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.28),\n    0 0 0 2px rgba(0, 0, 0, 0.12),\n    0 10px 28px rgba(239, 68, 68, 0.52);\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-end:active {\n  transform: rotate(135deg) scale(0.94);\n}\n\n/* Mini waveform */\n#ttp-ecom-strip .ttp-ecom-mini-wave {\n  display: flex;\n  align-items: center;\n  gap: 3px;\n  height: 24px;\n  padding: 0 4px;\n  opacity: 0.9;\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb {\n  width: 3px;\n  border-radius: 3px;\n  background: linear-gradient(180deg, #ddd6fe 0%, var(--ecom-accent, #a78bfa) 100%);\n  animation: ttp-ecom-wa 0.78s ease-in-out infinite;\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(1) { height: 6px; animation-delay: 0s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(2) { height: 11px; animation-delay: 0.1s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(3) { height: 16px; animation-delay: 0.2s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(4) { height: 9px; animation-delay: 0.15s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(5) { height: 12px; animation-delay: 0.05s; }\n@keyframes ttp-ecom-wa {\n  0%, 100% { transform: scaleY(0.38); opacity: 0.5; }\n  50% { transform: scaleY(1); opacity: 1; }\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb.paused {\n  animation-play-state: paused;\n  transform: scaleY(0.32);\n  opacity: 0.28;\n}\n\n/* Input row */\n#ttp-ecom-input-row {\n  display: none;\n  position: relative;\n  z-index: 1;\n  align-items: center;\n  gap: 10px;\n  padding: 0 14px 12px;\n  margin-top: -2px;\n  border-top: 1px solid rgba(255, 255, 255, 0.1);\n}\n#ttp-ecom-input-row.open {\n  display: flex;\n}\n#ttp-ecom-input {\n  flex: 1;\n  height: 40px;\n  border-radius: 12px;\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  background: rgba(0, 0, 0, 0.22);\n  color: #fff;\n  font-size: 14px;\n  padding: 0 14px;\n  outline: none;\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);\n  transition: border-color 0.18s ease, box-shadow 0.18s ease;\n}\n#ttp-ecom-input::placeholder { color: rgba(255, 255, 255, 0.42); }\n#ttp-ecom-input:focus {\n  border-color: rgba(165, 180, 252, 0.65);\n  box-shadow:\n    inset 0 1px 2px rgba(0, 0, 0, 0.2),\n    0 0 0 3px rgba(99, 102, 241, 0.25);\n}\n\n#ttp-ecom-strip .ttp-ecom-send {\n  width: 36px;\n  height: 36px;\n  border-radius: 12px;\n  border: none;\n  background: linear-gradient(165deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.1) 100%);\n  color: #fff;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);\n  transition: background 0.18s ease, transform 0.12s ease;\n}\n#ttp-ecom-strip .ttp-ecom-send:hover {\n  background: linear-gradient(165deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.14) 100%);\n}\n#ttp-ecom-strip .ttp-ecom-send:active { transform: scale(0.94); }\n\n@media (max-width: 520px) {\n  #ttp-ecom-strip .ttp-ecom-mini-wave { display: none; }\n  #ttp-ecom-main-row { gap: 7px; padding: 16px 12px 10px; }\n  #ttp-ecom-strip .ttp-ecom-ctrl { width: 36px; height: 36px; }\n  #ttp-ecom-strip .ttp-ecom-ctrl-end { width: 40px; height: 40px; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  #ttp-ecom-dot { animation: none; opacity: 0.9; }\n  #ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb { animation: none; opacity: 0.65; }\n}\n";
+EcommerceVoiceStrip._CSS = "\n#ttp-ecom-strip-wrapper {\n  position: fixed;\n  left: 50%;\n  bottom: 0;\n  transform: translateX(-50%);\n  width: min(720px, calc(100vw - 40px));\n  max-width: calc(100vw - 40px);\n  z-index: 2147483647;\n  box-sizing: border-box;\n  padding: 0 14px max(14px, env(safe-area-inset-bottom, 0px));\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  font-feature-settings: \"kern\" 1, \"liga\" 1;\n  pointer-events: none;\n}\n#ttp-ecom-strip-wrapper * { box-sizing: border-box; }\n\n/* Layered glass dock: rim light, soft lift, optional backdrop tint */\n#ttp-ecom-strip {\n  pointer-events: auto;\n  position: relative;\n  isolation: isolate;\n  margin: 0;\n  border-radius: 26px;\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  background: var(--ecom-strip-bg, linear-gradient(145deg, #5b21b6 0%, #3730a3 42%, #1e1b4b 100%));\n  background-clip: padding-box;\n  color: var(--ecom-fg, #ffffff);\n  box-shadow:\n    0 0 0 1px rgba(0, 0, 0, 0.18) inset,\n    0 1px 0 rgba(255, 255, 255, 0.14) inset,\n    0 -20px 40px -8px rgba(0, 0, 0, 0.22) inset,\n    0 12px 32px rgba(0, 0, 0, 0.22),\n    0 28px 56px -16px rgba(0, 0, 0, 0.45),\n    0 0 80px -20px rgba(99, 102, 241, 0.35);\n  overflow: visible;\n}\n\n#ttp-ecom-strip::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  pointer-events: none;\n  z-index: 0;\n  background: linear-gradient(\n    165deg,\n    rgba(255, 255, 255, 0.08) 0%,\n    rgba(255, 255, 255, 0) 42%,\n    rgba(0, 0, 0, 0.12) 100%\n  );\n}\n\n/* LIVE chip \u2014 glass capsule (backdrop blur), straddles top edge */\n#ttp-ecom-live-edge {\n  position: absolute;\n  left: 50%;\n  top: 0;\n  transform: translate(-50%, -50%);\n  z-index: 4;\n  max-width: calc(100% - 52px);\n  pointer-events: none;\n  padding: 3px 14px 4px;\n  border-radius: 999px;\n  background: rgba(8, 6, 24, 0.78);\n  border: 1px solid rgba(255, 255, 255, 0.28);\n  box-shadow:\n    0 0 0 1px rgba(0, 0, 0, 0.35),\n    0 4px 16px rgba(0, 0, 0, 0.35),\n    inset 0 1px 0 rgba(255, 255, 255, 0.12);\n}\n@supports (backdrop-filter: blur(1px)) {\n  #ttp-ecom-live-edge {\n    backdrop-filter: blur(14px) saturate(180%);\n    -webkit-backdrop-filter: blur(14px) saturate(180%);\n  }\n}\n\n#ttp-ecom-main-row {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 18px 16px 12px;\n  min-height: 48px;\n}\n\n#ttp-ecom-footer {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 0 16px 10px;\n  margin-top: -4px;\n  border-top: 1px solid rgba(255, 255, 255, 0.06);\n  padding-top: 6px;\n}\n.ttp-ecom-info-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 2px;\n  margin: 0;\n  background: none;\n  border: none;\n  cursor: pointer;\n  line-height: 0;\n  border-radius: 50%;\n  color: rgba(255, 255, 255, 0.35);\n  transition: color 0.2s, background 0.2s;\n}\n.ttp-ecom-info-btn:hover {\n  color: rgba(255, 255, 255, 0.7);\n  background: rgba(255, 255, 255, 0.08);\n}\n.ttp-ecom-info-btn svg { display: block; }\n#ttp-ecom-footer span {\n  font-size: 10px;\n  color: rgba(255, 255, 255, 0.35);\n  white-space: nowrap;\n}\n#ttp-ecom-footer a {\n  color: rgba(167, 139, 250, 0.95);\n  text-decoration: none;\n  font-weight: 600;\n}\n#ttp-ecom-footer a:hover { opacity: 0.85; }\n#ttp-ecom-footer a b { font-weight: 700; }\n\n.ttp-ecom-recipe-wrap {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n}\n.ttp-ecom-recipe-btn {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 3px 7px 3px 5px;\n  margin: 0;\n  background: rgba(255, 255, 255, 0.06);\n  border: 1px solid rgba(167, 139, 250, 0.42);\n  border-radius: 999px;\n  cursor: pointer;\n  line-height: 1;\n  color: rgba(255, 255, 255, 0.92);\n  transition: color 0.2s, background 0.2s, border-color 0.2s, box-shadow 0.2s;\n}\n.ttp-ecom-recipe-btn:hover {\n  color: #fff;\n  background: rgba(255, 255, 255, 0.1);\n  border-color: rgba(196, 181, 253, 0.65);\n}\n.ttp-ecom-recipe-btn svg { display: block; flex-shrink: 0; }\n.ttp-ecom-recipe-count {\n  font-size: 10px;\n  font-weight: 800;\n  min-width: 12px;\n  text-align: center;\n  letter-spacing: 0.02em;\n}\n.ttp-ecom-recipe-btn--celebrate {\n  animation: ttp-ecom-recipe-celebrate 1.35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;\n}\n.ttp-ecom-recipe-btn--celebrate::after {\n  content: \"\";\n  position: absolute;\n  inset: -3px;\n  border-radius: 999px;\n  border: 2px solid rgba(74, 222, 128, 0.75);\n  animation: ttp-ecom-recipe-ring 1.35s ease-out forwards;\n  pointer-events: none;\n}\n.ttp-ecom-recipe-count--pop {\n  animation: ttp-ecom-recipe-count-pop 1.35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;\n}\n@keyframes ttp-ecom-recipe-celebrate {\n  0% {\n    transform: scale(1);\n    color: rgba(167, 139, 250, 0.92);\n    background: rgba(255, 255, 255, 0.06);\n    box-shadow: none;\n  }\n  18% {\n    transform: scale(1.22);\n    color: #86efac;\n    background: rgba(74, 222, 128, 0.24);\n    border-color: rgba(74, 222, 128, 0.55);\n    box-shadow: 0 0 22px rgba(74, 222, 128, 0.5), 0 0 40px rgba(74, 222, 128, 0.2);\n  }\n  36% {\n    transform: scale(1.06);\n    color: #bbf7d0;\n    box-shadow: 0 0 14px rgba(74, 222, 128, 0.35);\n  }\n  54% {\n    transform: scale(1.16);\n    color: #4ade80;\n    background: rgba(74, 222, 128, 0.3);\n    box-shadow: 0 0 28px rgba(74, 222, 128, 0.55);\n  }\n  72% {\n    transform: scale(1.08);\n    color: #86efac;\n  }\n  100% {\n    transform: scale(1);\n    color: rgba(167, 139, 250, 0.95);\n    background: rgba(74, 222, 128, 0.1);\n    border-color: rgba(74, 222, 128, 0.28);\n    box-shadow: 0 0 12px rgba(74, 222, 128, 0.15);\n  }\n}\n@keyframes ttp-ecom-recipe-ring {\n  0% { transform: scale(0.9); opacity: 0.85; }\n  100% { transform: scale(2.1); opacity: 0; }\n}\n@keyframes ttp-ecom-recipe-count-pop {\n  0%, 100% { transform: scale(1); }\n  20% { transform: scale(1.45); color: #fff; }\n  45% { transform: scale(1.15); }\n  60% { transform: scale(1.35); color: #dcfce7; }\n}\n.ttp-ecom-recipe-popover {\n  position: absolute;\n  bottom: calc(100% + 8px);\n  left: 50%;\n  transform: translateX(-50%);\n  min-width: 180px;\n  max-width: 240px;\n  padding: 8px 0 6px;\n  border-radius: 14px;\n  background: rgba(12, 10, 28, 0.94);\n  border: 1px solid rgba(255, 255, 255, 0.14);\n  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(0, 0, 0, 0.2);\n  z-index: 6;\n  pointer-events: auto;\n}\n@supports (backdrop-filter: blur(1px)) {\n  .ttp-ecom-recipe-popover {\n    backdrop-filter: blur(16px) saturate(160%);\n    -webkit-backdrop-filter: blur(16px) saturate(160%);\n  }\n}\n.ttp-ecom-recipe-popover-label {\n  display: block;\n  padding: 2px 12px 6px;\n  font-size: 9px;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: rgba(255, 255, 255, 0.4);\n}\n.ttp-ecom-recipe-row {\n  display: block;\n  width: 100%;\n  padding: 8px 12px;\n  margin: 0;\n  border: none;\n  background: transparent;\n  color: rgba(255, 255, 255, 0.92);\n  font: 500 12px/1.35 ui-sans-serif, system-ui, sans-serif;\n  text-align: start;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.ttp-ecom-recipe-row:hover {\n  background: rgba(255, 255, 255, 0.08);\n}\n.ttp-ecom-recipe-row-title {\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.ttp-ecom-recipe-more {\n  padding: 4px 12px 2px;\n  font-size: 10px;\n  color: rgba(167, 139, 250, 0.85);\n  text-align: center;\n}\n\n#ttp-ecom-left-controls,\n#ttp-ecom-right-cluster {\n  display: flex;\n  align-items: center;\n  gap: 7px;\n  flex-shrink: 0;\n}\n\n/* Inset \u201Cmeter bridge\u201D for transcript \u2014 keeps one-line layout, adds depth */\n#ttp-ecom-center {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: center;\n  text-align: start;\n  padding: 7px 12px 7px 14px;\n  border-radius: 16px;\n  background: rgba(0, 0, 0, 0.16);\n  border: 1px solid rgba(255, 255, 255, 0.08);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.07),\n    inset 0 -1px 0 rgba(0, 0, 0, 0.12);\n}\n\n#ttp-ecom-live-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  min-width: 0;\n}\n\n#ttp-ecom-live-label {\n  font-size: 9px;\n  font-weight: 800;\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n  color: var(--ecom-accent, #4ade80);\n  opacity: 0.98;\n  white-space: nowrap;\n}\n\n#ttp-ecom-dot {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: var(--ecom-accent, #4ade80);\n  flex-shrink: 0;\n  box-shadow: 0 0 14px rgba(74, 222, 128, 0.45);\n  animation: ttp-ecom-blink 1.35s ease-in-out infinite;\n}\n#ttp-ecom-dot.paused {\n  animation: none;\n  opacity: 0.45;\n  background: rgba(255,255,255,0.35);\n  box-shadow: none;\n}\n@keyframes ttp-ecom-blink {\n  0%, 100% { opacity: 1; transform: scale(1); }\n  50% { opacity: 0.25; transform: scale(0.92); }\n}\n\n#ttp-ecom-transcript {\n  font-size: 12px;\n  line-height: 1.42;\n  letter-spacing: 0.015em;\n  color: rgba(255, 255, 255, 0.94);\n  width: 100%;\n  max-width: 100%;\n  overflow: hidden;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n}\n\n#ttp-ecom-transcript.ttp-ecom-transcript--user {\n  color: rgba(255, 244, 214, 0.98);\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  text-shadow: 0 0 28px rgba(251, 191, 36, 0.22);\n}\n\n/* Squircle glass controls */\n#ttp-ecom-strip .ttp-ecom-ctrl {\n  width: 36px;\n  height: 36px;\n  border-radius: 12px;\n  border: 1px solid rgba(255, 255, 255, 0.16);\n  background: linear-gradient(165deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.05) 100%);\n  color: rgba(255, 255, 255, 0.92);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  position: relative;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.18),\n    0 2px 8px rgba(0, 0, 0, 0.15);\n  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.14s ease;\n  outline: none;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl:hover {\n  background: linear-gradient(165deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.08) 100%);\n  border-color: rgba(255, 255, 255, 0.32);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.22),\n    0 4px 14px rgba(0, 0, 0, 0.2);\n}\n#ttp-ecom-strip .ttp-ecom-ctrl:active { transform: scale(0.94); }\n#ttp-ecom-strip .ttp-ecom-ctrl:focus-visible {\n  outline: 2px solid rgba(165, 180, 252, 0.95);\n  outline-offset: 2px;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-active {\n  background: linear-gradient(165deg, rgba(129, 140, 248, 0.45) 0%, rgba(99, 102, 241, 0.28) 100%) !important;\n  border-color: rgba(196, 181, 253, 0.65) !important;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.2),\n    0 0 0 1px rgba(99, 102, 241, 0.35),\n    0 6px 18px rgba(79, 70, 229, 0.35) !important;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-warn {\n  background: linear-gradient(165deg, rgba(252, 165, 165, 0.22) 0%, rgba(239, 68, 68, 0.2) 100%) !important;\n  border-color: rgba(252, 165, 165, 0.55) !important;\n}\n\n#ttp-ecom-strip .ttp-ecom-ctrl-end {\n  width: 40px;\n  height: 40px;\n  border-radius: 14px;\n  background: linear-gradient(165deg, #fb7185 0%, var(--ecom-end, #ef4444) 52%, #991b1b 100%) !important;\n  border: none !important;\n  color: #fff !important;\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.25),\n    0 0 0 2px rgba(0, 0, 0, 0.12),\n    0 6px 22px rgba(239, 68, 68, 0.48);\n  transform: rotate(135deg);\n  transition: filter 0.18s ease, transform 0.14s ease, box-shadow 0.2s ease;\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-end:hover {\n  filter: brightness(1.06);\n  transform: rotate(135deg) scale(1.05);\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, 0.28),\n    0 0 0 2px rgba(0, 0, 0, 0.12),\n    0 10px 28px rgba(239, 68, 68, 0.52);\n}\n#ttp-ecom-strip .ttp-ecom-ctrl-end:active {\n  transform: rotate(135deg) scale(0.94);\n}\n\n/* Mini waveform */\n#ttp-ecom-strip .ttp-ecom-mini-wave {\n  display: flex;\n  align-items: center;\n  gap: 3px;\n  height: 24px;\n  padding: 0 4px;\n  opacity: 0.9;\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb {\n  width: 3px;\n  border-radius: 3px;\n  background: linear-gradient(180deg, #ddd6fe 0%, var(--ecom-accent, #a78bfa) 100%);\n  animation: ttp-ecom-wa 0.78s ease-in-out infinite;\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(1) { height: 6px; animation-delay: 0s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(2) { height: 11px; animation-delay: 0.1s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(3) { height: 16px; animation-delay: 0.2s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(4) { height: 9px; animation-delay: 0.15s; }\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb:nth-child(5) { height: 12px; animation-delay: 0.05s; }\n@keyframes ttp-ecom-wa {\n  0%, 100% { transform: scaleY(0.38); opacity: 0.5; }\n  50% { transform: scaleY(1); opacity: 1; }\n}\n#ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb.paused {\n  animation-play-state: paused;\n  transform: scaleY(0.32);\n  opacity: 0.28;\n}\n\n/* Input row */\n#ttp-ecom-input-row {\n  display: none;\n  position: relative;\n  z-index: 1;\n  align-items: center;\n  gap: 10px;\n  padding: 0 14px 12px;\n  margin-top: -2px;\n  border-top: 1px solid rgba(255, 255, 255, 0.1);\n}\n#ttp-ecom-input-row.open {\n  display: flex;\n}\n#ttp-ecom-input {\n  flex: 1;\n  height: 40px;\n  border-radius: 12px;\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  background: rgba(0, 0, 0, 0.22);\n  color: #fff;\n  font-size: 14px;\n  padding: 0 14px;\n  outline: none;\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);\n  transition: border-color 0.18s ease, box-shadow 0.18s ease;\n}\n#ttp-ecom-input::placeholder { color: rgba(255, 255, 255, 0.42); }\n#ttp-ecom-input:focus {\n  border-color: rgba(165, 180, 252, 0.65);\n  box-shadow:\n    inset 0 1px 2px rgba(0, 0, 0, 0.2),\n    0 0 0 3px rgba(99, 102, 241, 0.25);\n}\n\n#ttp-ecom-strip .ttp-ecom-send {\n  width: 36px;\n  height: 36px;\n  border-radius: 12px;\n  border: none;\n  background: linear-gradient(165deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.1) 100%);\n  color: #fff;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);\n  transition: background 0.18s ease, transform 0.12s ease;\n}\n#ttp-ecom-strip .ttp-ecom-send:hover {\n  background: linear-gradient(165deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.14) 100%);\n}\n#ttp-ecom-strip .ttp-ecom-send:active { transform: scale(0.94); }\n\n@media (max-width: 520px) {\n  #ttp-ecom-strip .ttp-ecom-mini-wave { display: none; }\n  #ttp-ecom-main-row { gap: 7px; padding: 16px 12px 10px; }\n  #ttp-ecom-strip .ttp-ecom-ctrl { width: 36px; height: 36px; }\n  #ttp-ecom-strip .ttp-ecom-ctrl-end { width: 40px; height: 40px; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  #ttp-ecom-dot { animation: none; opacity: 0.9; }\n  #ttp-ecom-strip .ttp-ecom-mini-wave .ttp-ecom-wb { animation: none; opacity: 0.65; }\n  .ttp-ecom-recipe-btn--celebrate,\n  .ttp-ecom-recipe-count--pop {\n    animation: none !important;\n  }\n  .ttp-ecom-recipe-btn--celebrate::after { display: none; }\n}\n";
 
 /***/ }),
 
@@ -16015,6 +16222,529 @@ var ProductPicker = /*#__PURE__*/function () {
 
 /***/ }),
 
+/***/ "./src/ecommerce/RecipeHandler.js":
+/*!****************************************!*\
+  !*** ./src/ecommerce/RecipeHandler.js ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   buildRecipeHtml: () => (/* binding */ buildRecipeHtml),
+/* harmony export */   createRecipeHandler: () => (/* binding */ createRecipeHandler)
+/* harmony export */ });
+/* harmony import */ var _partnerLogo_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./partnerLogo.js */ "./src/ecommerce/partnerLogo.js");
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+/**
+ * Recipe Handler — centered modal + self-contained HTML download.
+ *
+ * Backend wire: { t: 'show_recipe', recipe: { title, ingredients[], steps[], servings?, notes? } }
+ * Triggered sync-to-speech when the agent calls send_recipe.
+ */
+
+
+var STYLES_ID = 'ttp-recipe-handler-styles';
+function escapeHtml(str) {
+  return String(str !== null && str !== void 0 ? str : '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+}
+function slugify(title) {
+  var slug = String(title !== null && title !== void 0 ? title : 'recipe').trim().toLowerCase().replace(/[^a-z0-9]+/gi, '-').replace(/^-+|-+$/g, '');
+  return slug || 'recipe';
+}
+function normalizeRecipe(input) {
+  var _recipe$title;
+  if (!input || _typeof(input) !== 'object') return null;
+  var recipe = input.recipe && _typeof(input.recipe) === 'object' ? input.recipe : input;
+  var title = String((_recipe$title = recipe.title) !== null && _recipe$title !== void 0 ? _recipe$title : '').trim();
+  var ingredients = Array.isArray(recipe.ingredients) ? recipe.ingredients.map(function (x) {
+    return String(x).trim();
+  }).filter(Boolean) : [];
+  var steps = Array.isArray(recipe.steps) ? recipe.steps.map(function (x) {
+    return String(x).trim();
+  }).filter(Boolean) : [];
+  if (!title || ingredients.length === 0 && steps.length === 0) {
+    console.warn('[RecipeHandler] Invalid recipe payload — need title plus ingredients or steps', input);
+    return null;
+  }
+  return {
+    title: title,
+    ingredients: ingredients,
+    steps: steps,
+    servings: recipe.servings ? String(recipe.servings).trim() : '',
+    notes: recipe.notes ? String(recipe.notes).trim() : ''
+  };
+}
+
+/** Shared download-page CSS (self-contained, no external assets). */
+var RECIPE_PAGE_CSS = "\n  :root {\n    --bg: #f6f3ee;\n    --paper: #fffcf8;\n    --ink: #1c1917;\n    --muted: #78716c;\n    --accent: #2f6b52;\n    --accent-soft: #e8f2ec;\n    --accent-deep: #1e4d3a;\n    --warm: #c4713a;\n    --warm-soft: #fdf3eb;\n    --line: rgba(28, 25, 23, 0.08);\n    --shadow: 0 24px 60px rgba(28, 25, 23, 0.12);\n    --radius: 20px;\n  }\n  * { box-sizing: border-box; }\n  body {\n    margin: 0;\n    min-height: 100vh;\n    font-family: \"Segoe UI\", system-ui, -apple-system, sans-serif;\n    color: var(--ink);\n    background:\n      radial-gradient(circle at top right, rgba(47, 107, 82, 0.08), transparent 28rem),\n      radial-gradient(circle at bottom left, rgba(196, 113, 58, 0.08), transparent 24rem),\n      var(--bg);\n    line-height: 1.55;\n    padding: 32px 16px 48px;\n  }\n  .sheet {\n    max-width: 760px;\n    margin: 0 auto;\n    background: var(--paper);\n    border-radius: calc(var(--radius) + 4px);\n    box-shadow: var(--shadow);\n    overflow: hidden;\n    border: 1px solid rgba(255, 255, 255, 0.7);\n  }\n  .hero {\n    position: relative;\n    padding: 36px 32px 28px;\n    background:\n      linear-gradient(135deg, var(--accent-deep) 0%, var(--accent) 55%, #3d8b67 100%);\n    color: #fff;\n    overflow: hidden;\n  }\n  .hero::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background:\n      radial-gradient(circle at 85% 15%, rgba(255,255,255,0.16), transparent 42%),\n      radial-gradient(circle at 10% 100%, rgba(255,255,255,0.08), transparent 35%);\n    pointer-events: none;\n  }\n  .hero-inner { position: relative; z-index: 1; }\n  .hero-head {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    gap: 16px;\n    margin-bottom: 12px;\n  }\n  .hero-head .eyebrow { margin-bottom: 0; }\n  .partner-logo-wrap {\n    flex-shrink: 0;\n    background: rgba(255, 255, 255, 0.95);\n    border-radius: 12px;\n    padding: 8px 12px;\n    max-width: 140px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .partner-logo {\n    height: 28px;\n    width: auto;\n    max-width: 120px;\n    object-fit: contain;\n    display: block;\n  }\n  .eyebrow {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 11px;\n    font-weight: 700;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    opacity: 0.88;\n    margin-bottom: 12px;\n  }\n  .eyebrow-dot {\n    width: 7px;\n    height: 7px;\n    border-radius: 50%;\n    background: #ffd166;\n    box-shadow: 0 0 0 4px rgba(255, 209, 102, 0.22);\n  }\n  h1 {\n    margin: 0;\n    font-family: \"Iowan Old Style\", \"Palatino Linotype\", \"Book Antiqua\", Georgia, serif;\n    font-size: clamp(2rem, 5vw, 2.75rem);\n    line-height: 1.08;\n    font-weight: 600;\n    letter-spacing: -0.02em;\n  }\n  .servings {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    margin-top: 16px;\n    padding: 8px 14px;\n    border-radius: 999px;\n    background: rgba(255, 255, 255, 0.14);\n    border: 1px solid rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    font-size: 14px;\n    font-weight: 500;\n  }\n  .content { padding: 28px 28px 32px; }\n  .grid {\n    display: grid;\n    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);\n    gap: 24px;\n  }\n  .section { min-width: 0; }\n  .section-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    margin: 0 0 14px;\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: var(--accent-deep);\n  }\n  .section-title::after {\n    content: \"\";\n    flex: 1;\n    height: 1px;\n    background: linear-gradient(to right, var(--line), transparent);\n  }\n  .ingredients-box {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    background: var(--accent-soft);\n    border: 1px solid rgba(47, 107, 82, 0.12);\n    border-radius: 16px;\n    overflow: hidden;\n  }\n  .ingredients-box li {\n    display: flex;\n    align-items: flex-start;\n    gap: 12px;\n    padding: 12px 16px;\n    border-bottom: 1px solid rgba(47, 107, 82, 0.08);\n    font-size: 15px;\n  }\n  .ingredients-box li:last-child { border-bottom: 0; }\n  .ingredients-box li::before {\n    content: \"\";\n    flex-shrink: 0;\n    width: 8px;\n    height: 8px;\n    margin-top: 0.45em;\n    border-radius: 50%;\n    background: var(--accent);\n    box-shadow: 0 0 0 3px rgba(47, 107, 82, 0.14);\n  }\n  .steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }\n  .step {\n    display: grid;\n    grid-template-columns: 36px minmax(0, 1fr);\n    gap: 14px;\n    padding: 14px 16px;\n    background: #fff;\n    border: 1px solid var(--line);\n    border-radius: 16px;\n    box-shadow: 0 8px 24px rgba(28, 25, 23, 0.04);\n  }\n  .step-num {\n    width: 36px;\n    height: 36px;\n    border-radius: 12px;\n    display: grid;\n    place-items: center;\n    background: linear-gradient(180deg, var(--warm-soft), #fff);\n    border: 1px solid rgba(196, 113, 58, 0.18);\n    color: var(--warm);\n    font-size: 14px;\n    font-weight: 800;\n  }\n  .step-text { font-size: 15px; color: #292524; padding-top: 6px; }\n  .notes {\n    margin-top: 24px;\n    padding: 16px 18px 16px 20px;\n    border-radius: 16px;\n    background: var(--warm-soft);\n    border: 1px solid rgba(196, 113, 58, 0.16);\n    color: #57534e;\n    font-size: 14px;\n  }\n  .notes strong {\n    display: block;\n    margin-bottom: 6px;\n    color: #9a3412;\n    font-size: 12px;\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n  }\n  .footer {\n    margin-top: 28px;\n    padding-top: 18px;\n    border-top: 1px solid var(--line);\n    text-align: center;\n    font-size: 12px;\n    color: var(--muted);\n    letter-spacing: 0.04em;\n  }\n  @media (max-width: 720px) {\n    .hero { padding: 28px 22px 22px; }\n    .content { padding: 22px 18px 26px; }\n    .grid { grid-template-columns: 1fr; gap: 22px; }\n  }\n  @media print {\n    body { background: #fff; padding: 0; }\n    .sheet { box-shadow: none; border: none; max-width: none; }\n  }\n";
+function buildIngredientsHtml(ingredients) {
+  if (!ingredients.length) return '';
+  var items = ingredients.map(function (item) {
+    return "<li>".concat(escapeHtml(item), "</li>");
+  }).join('');
+  return "\n    <section class=\"section\">\n      <h2 class=\"section-title\">Ingredients</h2>\n      <ul class=\"ingredients-box\">".concat(items, "</ul>\n    </section>");
+}
+function buildStepsHtml(steps) {
+  if (!steps.length) return '';
+  var items = steps.map(function (step, i) {
+    return "\n    <li class=\"step\">\n      <div class=\"step-num\">".concat(i + 1, "</div>\n      <div class=\"step-text\">").concat(escapeHtml(step), "</div>\n    </li>");
+  }).join('');
+  return "\n    <section class=\"section\">\n      <h2 class=\"section-title\">Method</h2>\n      <ol class=\"steps\">".concat(items, "</ol>\n    </section>");
+}
+function buildNotesHtml(notes) {
+  if (!notes) return '';
+  return "<div class=\"notes\"><strong>Chef's tip</strong>".concat(escapeHtml(notes), "</div>");
+}
+function buildPartnerLogoHtml(logoUrl) {
+  if (!logoUrl) return '';
+  return "<div class=\"partner-logo-wrap\"><img class=\"partner-logo\" src=\"".concat(escapeHtml(logoUrl), "\" alt=\"\"></div>");
+}
+function buildHeroHeadHtml(logoUrl) {
+  var logo = buildPartnerLogoHtml(logoUrl);
+  var eyebrow = '<div class="eyebrow"><span class="eyebrow-dot"></span> Recipe card</div>';
+  if (!logo) return eyebrow;
+  return "<div class=\"hero-head\">".concat(eyebrow).concat(logo, "</div>");
+}
+function buildRecipeHtml(recipe) {
+  var logoUrl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  var servings = recipe.servings ? "<div class=\"servings\"><span aria-hidden=\"true\">\uD83C\uDF7D</span> ".concat(escapeHtml(recipe.servings), "</div>") : '';
+  return "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n  <title>".concat(escapeHtml(recipe.title), "</title>\n  <style>").concat(RECIPE_PAGE_CSS, "</style>\n</head>\n<body>\n  <article class=\"sheet\">\n    <header class=\"hero\">\n      <div class=\"hero-inner\">\n        ").concat(buildHeroHeadHtml(logoUrl), "\n        <h1>").concat(escapeHtml(recipe.title), "</h1>\n        ").concat(servings, "\n      </div>\n    </header>\n    <div class=\"content\">\n      <div class=\"grid\">\n        ").concat(buildIngredientsHtml(recipe.ingredients), "\n        ").concat(buildStepsHtml(recipe.steps), "\n      </div>\n      ").concat(buildNotesHtml(recipe.notes), "\n      <p class=\"footer\">Saved from TalkToPC \xB7 Your voice shopping assistant</p>\n    </div>\n  </article>\n</body>\n</html>");
+}
+function downloadRecipeHtml(recipe) {
+  var logoUrl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  try {
+    var html = buildRecipeHtml(recipe, logoUrl);
+    var blob = new Blob([html], {
+      type: 'text/html;charset=utf-8'
+    });
+    var url = URL.createObjectURL(blob);
+    var a = document.createElement('a');
+    a.href = url;
+    a.download = "".concat(slugify(recipe.title), ".html");
+    a.rel = 'noopener';
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    setTimeout(function () {
+      return URL.revokeObjectURL(url);
+    }, 1000);
+    console.log('[RecipeHandler] Downloaded recipe HTML:', a.download);
+  } catch (e) {
+    console.warn('[RecipeHandler] HTML download failed:', e);
+  }
+}
+function injectStyles() {
+  if (document.getElementById(STYLES_ID)) return;
+  var s = document.createElement('style');
+  s.id = STYLES_ID;
+  s.textContent = "\n.ttp-rh-backdrop {\n  position: fixed;\n  inset: 0;\n  z-index: 2147483640;\n  background: rgba(15, 23, 20, 0);\n  backdrop-filter: blur(0px);\n  -webkit-backdrop-filter: blur(0px);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 16px;\n  box-sizing: border-box;\n  transition: background 0.32s ease, backdrop-filter 0.32s ease;\n  pointer-events: none;\n}\n.ttp-rh-backdrop.ttp-rh-visible {\n  background: rgba(15, 23, 20, 0.52);\n  backdrop-filter: blur(10px);\n  -webkit-backdrop-filter: blur(10px);\n  pointer-events: all;\n}\n.ttp-rh-card {\n  position: relative;\n  width: min(94vw, 680px);\n  max-height: calc(100vh - 32px);\n  background: #fffcf8;\n  border-radius: 24px;\n  box-shadow: 0 28px 80px rgba(15, 23, 20, 0.22), 0 8px 24px rgba(15, 23, 20, 0.08);\n  display: flex;\n  flex-direction: column;\n  opacity: 0;\n  transform: scale(0.94) translateY(12px);\n  transition: opacity 0.32s cubic-bezier(0.23, 1, 0.32, 1),\n              transform 0.32s cubic-bezier(0.23, 1, 0.32, 1);\n  overflow: hidden;\n  border: 1px solid rgba(255, 255, 255, 0.65);\n}\n.ttp-rh-backdrop.ttp-rh-visible .ttp-rh-card {\n  opacity: 1;\n  transform: scale(1) translateY(0);\n}\n.ttp-rh-hero {\n  position: relative;\n  padding: 28px 56px 22px 24px;\n  background: linear-gradient(135deg, #1e4d3a 0%, #2f6b52 55%, #3d8b67 100%);\n  color: #fff;\n  flex-shrink: 0;\n}\n.ttp-rh-hero::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  background:\n    radial-gradient(circle at 85% 15%, rgba(255,255,255,0.16), transparent 42%),\n    radial-gradient(circle at 10% 100%, rgba(255,255,255,0.08), transparent 35%);\n  pointer-events: none;\n}\n.ttp-rh-hero-inner { position: relative; z-index: 1; }\n.ttp-rh-hero-head {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 12px;\n  margin-bottom: 10px;\n  padding-right: 36px;\n}\n.ttp-rh-hero-head .ttp-rh-eyebrow { margin-bottom: 0; }\n.ttp-rh-partner-logo-wrap {\n  flex-shrink: 0;\n  background: rgba(255, 255, 255, 0.95);\n  border-radius: 10px;\n  padding: 6px 10px;\n  max-width: 120px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.ttp-rh-partner-logo {\n  height: 26px;\n  width: auto;\n  max-width: 100px;\n  object-fit: contain;\n  display: block;\n}\n.ttp-rh-eyebrow {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font: 700 11px/1 \"Segoe UI\", system-ui, sans-serif;\n  letter-spacing: 0.14em;\n  text-transform: uppercase;\n  opacity: 0.88;\n  margin-bottom: 10px;\n}\n.ttp-rh-eyebrow-dot {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: #ffd166;\n  box-shadow: 0 0 0 4px rgba(255, 209, 102, 0.22);\n}\n.ttp-rh-title {\n  font-family: \"Iowan Old Style\", \"Palatino Linotype\", \"Book Antiqua\", Georgia, serif;\n  font-size: clamp(1.45rem, 4vw, 1.95rem);\n  font-weight: 600;\n  line-height: 1.1;\n  letter-spacing: -0.02em;\n}\n.ttp-rh-servings {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  margin-top: 14px;\n  padding: 7px 13px;\n  border-radius: 999px;\n  background: rgba(255, 255, 255, 0.14);\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  font: 500 13px/1.2 \"Segoe UI\", system-ui, sans-serif;\n}\n.ttp-rh-hero-actions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n  margin-top: 18px;\n}\n.ttp-rh-hero-actions .ttp-rh-btn {\n  flex: 0 1 auto;\n  padding: 10px 16px;\n  border: none;\n  border-radius: 12px;\n  font: 600 13px/1 \"Segoe UI\", system-ui, sans-serif;\n  cursor: pointer;\n  transition: transform 0.12s ease, background 0.15s ease, box-shadow 0.15s ease;\n}\n.ttp-rh-hero-actions .ttp-rh-btn:active { transform: scale(0.98); }\n.ttp-rh-hero-actions .ttp-rh-btn-secondary {\n  background: rgba(255, 255, 255, 0.14);\n  color: #fff;\n  border: 1px solid rgba(255, 255, 255, 0.28);\n}\n.ttp-rh-hero-actions .ttp-rh-btn-secondary:hover { background: rgba(255, 255, 255, 0.22); }\n.ttp-rh-hero-actions .ttp-rh-btn-primary {\n  background: #fff;\n  color: #1e4d3a;\n  box-shadow: 0 8px 20px rgba(15, 23, 20, 0.18);\n}\n.ttp-rh-hero-actions .ttp-rh-btn-primary:hover { background: #f4faf7; }\n.ttp-rh-close {\n  position: absolute;\n  top: 16px;\n  right: 16px;\n  z-index: 2;\n  width: 36px;\n  height: 36px;\n  padding: 0;\n  border: 1px solid rgba(255, 255, 255, 0.22);\n  border-radius: 50%;\n  background: rgba(255, 255, 255, 0.12);\n  color: #fff;\n  cursor: pointer;\n  font-size: 22px;\n  line-height: 1;\n  backdrop-filter: blur(8px);\n}\n.ttp-rh-close:hover { background: rgba(255, 255, 255, 0.2); }\n.ttp-rh-body {\n  padding: 20px 22px 8px;\n  overflow-y: auto;\n  flex: 1;\n  background: linear-gradient(180deg, #fffcf8 0%, #f8f5f0 100%);\n}\n.ttp-rh-grid {\n  display: grid;\n  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);\n  gap: 18px;\n}\n.ttp-rh-section { min-width: 0; margin-bottom: 0; }\n.ttp-rh-section-title {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  margin: 0 0 12px;\n  font: 800 11px/1 \"Segoe UI\", system-ui, sans-serif;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: #1e4d3a;\n}\n.ttp-rh-section-title::after {\n  content: \"\";\n  flex: 1;\n  height: 1px;\n  background: linear-gradient(to right, rgba(28,25,23,0.08), transparent);\n}\n.ttp-rh-ingredients {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  background: #e8f2ec;\n  border: 1px solid rgba(47, 107, 82, 0.12);\n  border-radius: 14px;\n  overflow: hidden;\n}\n.ttp-rh-ingredients li {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 10px 14px;\n  border-bottom: 1px solid rgba(47, 107, 82, 0.08);\n  font: 14px/1.45 \"Segoe UI\", system-ui, sans-serif;\n  color: #292524;\n}\n.ttp-rh-ingredients li:last-child { border-bottom: 0; }\n.ttp-rh-ingredients li::before {\n  content: \"\";\n  flex-shrink: 0;\n  width: 7px;\n  height: 7px;\n  margin-top: 0.45em;\n  border-radius: 50%;\n  background: #2f6b52;\n  box-shadow: 0 0 0 3px rgba(47, 107, 82, 0.14);\n}\n.ttp-rh-steps {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: grid;\n  gap: 10px;\n}\n.ttp-rh-step {\n  display: grid;\n  grid-template-columns: 32px minmax(0, 1fr);\n  gap: 12px;\n  padding: 12px 14px;\n  background: #fff;\n  border: 1px solid rgba(28, 25, 23, 0.08);\n  border-radius: 14px;\n  box-shadow: 0 6px 18px rgba(28, 25, 23, 0.04);\n}\n.ttp-rh-step-num {\n  width: 32px;\n  height: 32px;\n  border-radius: 10px;\n  display: grid;\n  place-items: center;\n  background: linear-gradient(180deg, #fdf3eb, #fff);\n  border: 1px solid rgba(196, 113, 58, 0.18);\n  color: #c4713a;\n  font: 800 13px/1 \"Segoe UI\", system-ui, sans-serif;\n}\n.ttp-rh-step-text {\n  font: 14px/1.45 \"Segoe UI\", system-ui, sans-serif;\n  color: #292524;\n  padding-top: 5px;\n}\n.ttp-rh-notes-wrap { margin-top: 16px; }\n.ttp-rh-notes {\n  padding: 14px 16px;\n  border-radius: 14px;\n  background: #fdf3eb;\n  border: 1px solid rgba(196, 113, 58, 0.16);\n  font: 13px/1.5 \"Segoe UI\", system-ui, sans-serif;\n  color: #57534e;\n}\n.ttp-rh-notes-label {\n  display: block;\n  margin-bottom: 6px;\n  font: 800 11px/1 \"Segoe UI\", system-ui, sans-serif;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  color: #9a3412;\n}\n@media (max-width: 640px) {\n  .ttp-rh-backdrop { padding: 10px; }\n  .ttp-rh-card { width: calc(100vw - 20px); border-radius: 20px; }\n  .ttp-rh-grid { grid-template-columns: 1fr; }\n  .ttp-rh-hero { padding: 24px 52px 22px 20px; }\n  .ttp-rh-hero-actions { margin-top: 14px; }\n  .ttp-rh-hero-actions .ttp-rh-btn { flex: 1 1 calc(50% - 5px); min-width: 120px; }\n}\n";
+  document.head.appendChild(s);
+}
+function _appendSectionTitle(parent, label) {
+  var title = document.createElement('h3');
+  title.className = 'ttp-rh-section-title';
+  title.textContent = label;
+  parent.appendChild(title);
+}
+function createRecipeHandler(widget) {
+  var backdrop = null;
+  var _dismissed = false;
+  var _savedHostZIndex = null;
+  var _printFrame = null;
+  var _lastLogoUrl = null;
+  var _openedAsReshow = false;
+  function _minimizeWidget() {
+    try {
+      var _widget$shadowRoot;
+      var host = widget === null || widget === void 0 || (_widget$shadowRoot = widget.shadowRoot) === null || _widget$shadowRoot === void 0 ? void 0 : _widget$shadowRoot.host;
+      if (host) {
+        _savedHostZIndex = host.style.zIndex || null;
+        host.style.zIndex = String(2147483641);
+      }
+    } catch (e) {/* best-effort */}
+  }
+  function _restoreWidget() {
+    try {
+      var _widget$shadowRoot2;
+      var host = widget === null || widget === void 0 || (_widget$shadowRoot2 = widget.shadowRoot) === null || _widget$shadowRoot2 === void 0 ? void 0 : _widget$shadowRoot2.host;
+      if (host) {
+        host.style.zIndex = _savedHostZIndex || '';
+        _savedHostZIndex = null;
+      }
+    } catch (e) {/* best-effort */}
+  }
+  function _teardownFrame() {
+    var _printFrame2;
+    if ((_printFrame2 = _printFrame) !== null && _printFrame2 !== void 0 && _printFrame2.parentNode) {
+      _printFrame.parentNode.removeChild(_printFrame);
+    }
+    _printFrame = null;
+  }
+  function _appendHeroHead(heroInner, logoUrl) {
+    var eyebrow = document.createElement('div');
+    eyebrow.className = 'ttp-rh-eyebrow';
+    eyebrow.innerHTML = '<span class="ttp-rh-eyebrow-dot"></span> Recipe card';
+    if (!logoUrl) {
+      heroInner.appendChild(eyebrow);
+      return;
+    }
+    var head = document.createElement('div');
+    head.className = 'ttp-rh-hero-head';
+    head.appendChild(eyebrow);
+    var logoWrap = document.createElement('div');
+    logoWrap.className = 'ttp-rh-partner-logo-wrap';
+    var logoImg = document.createElement('img');
+    logoImg.className = 'ttp-rh-partner-logo';
+    logoImg.src = logoUrl;
+    logoImg.alt = '';
+    logoWrap.appendChild(logoImg);
+    head.appendChild(logoWrap);
+    heroInner.appendChild(head);
+  }
+  function _buildCard(recipe) {
+    var logoUrl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+    var card = document.createElement('div');
+    card.className = 'ttp-rh-card';
+    card.addEventListener('click', function (e) {
+      return e.stopPropagation();
+    });
+    var closeBtn = document.createElement('button');
+    closeBtn.className = 'ttp-rh-close';
+    closeBtn.setAttribute('aria-label', 'Close recipe');
+    closeBtn.textContent = "\xD7";
+    closeBtn.addEventListener('click', dismissRecipe);
+    var hero = document.createElement('header');
+    hero.className = 'ttp-rh-hero';
+    var heroInner = document.createElement('div');
+    heroInner.className = 'ttp-rh-hero-inner';
+    _appendHeroHead(heroInner, logoUrl);
+    var titleEl = document.createElement('div');
+    titleEl.className = 'ttp-rh-title';
+    titleEl.textContent = recipe.title;
+    heroInner.appendChild(titleEl);
+    if (recipe.servings) {
+      var servEl = document.createElement('div');
+      servEl.className = 'ttp-rh-servings';
+      servEl.innerHTML = "<span aria-hidden=\"true\">\uD83C\uDF7D</span> ".concat(recipe.servings);
+      heroInner.appendChild(servEl);
+    }
+    var actions = document.createElement('div');
+    actions.className = 'ttp-rh-hero-actions';
+    var saveBtn = document.createElement('button');
+    saveBtn.className = 'ttp-rh-btn ttp-rh-btn-secondary';
+    saveBtn.textContent = 'Save again';
+    saveBtn.addEventListener('click', function () {
+      return downloadRecipeHtml(recipe, logoUrl);
+    });
+    var printBtn = document.createElement('button');
+    printBtn.className = 'ttp-rh-btn ttp-rh-btn-primary';
+    printBtn.textContent = 'Print recipe';
+    printBtn.addEventListener('click', function () {
+      return printRecipe(recipe, logoUrl);
+    });
+    actions.appendChild(saveBtn);
+    actions.appendChild(printBtn);
+    heroInner.appendChild(actions);
+    hero.appendChild(heroInner);
+    hero.appendChild(closeBtn);
+    card.appendChild(hero);
+    var body = document.createElement('div');
+    body.className = 'ttp-rh-body';
+    var grid = document.createElement('div');
+    grid.className = 'ttp-rh-grid';
+    if (recipe.ingredients.length) {
+      var sec = document.createElement('section');
+      sec.className = 'ttp-rh-section';
+      _appendSectionTitle(sec, 'Ingredients');
+      var ul = document.createElement('ul');
+      ul.className = 'ttp-rh-ingredients';
+      recipe.ingredients.forEach(function (item) {
+        var li = document.createElement('li');
+        li.textContent = item;
+        ul.appendChild(li);
+      });
+      sec.appendChild(ul);
+      grid.appendChild(sec);
+    }
+    if (recipe.steps.length) {
+      var _sec = document.createElement('section');
+      _sec.className = 'ttp-rh-section';
+      _appendSectionTitle(_sec, 'Method');
+      var ol = document.createElement('ol');
+      ol.className = 'ttp-rh-steps';
+      recipe.steps.forEach(function (step, index) {
+        var li = document.createElement('li');
+        li.className = 'ttp-rh-step';
+        var num = document.createElement('div');
+        num.className = 'ttp-rh-step-num';
+        num.textContent = String(index + 1);
+        var text = document.createElement('div');
+        text.className = 'ttp-rh-step-text';
+        text.textContent = step;
+        li.appendChild(num);
+        li.appendChild(text);
+        ol.appendChild(li);
+      });
+      _sec.appendChild(ol);
+      grid.appendChild(_sec);
+    }
+    body.appendChild(grid);
+    if (recipe.notes) {
+      var notesWrap = document.createElement('div');
+      notesWrap.className = 'ttp-rh-notes-wrap';
+      var notes = document.createElement('div');
+      notes.className = 'ttp-rh-notes';
+      var label = document.createElement('span');
+      label.className = 'ttp-rh-notes-label';
+      label.textContent = "Chef's tip";
+      notes.appendChild(label);
+      notes.appendChild(document.createTextNode(recipe.notes));
+      notesWrap.appendChild(notes);
+      body.appendChild(notesWrap);
+    }
+    card.appendChild(body);
+    return card;
+  }
+  function printRecipe(recipe) {
+    var _frame$contentWindow, _frame$contentWindow2, _frame$contentWindow3;
+    var logoUrl = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+    _teardownFrame();
+    var frame = document.createElement('iframe');
+    frame.style.cssText = 'position:fixed;right:0;bottom:0;width:0;height:0;border:0;';
+    document.body.appendChild(frame);
+    _printFrame = frame;
+    var doc = frame.contentDocument || ((_frame$contentWindow = frame.contentWindow) === null || _frame$contentWindow === void 0 ? void 0 : _frame$contentWindow.document);
+    if (!doc) return;
+    doc.open();
+    doc.write(buildRecipeHtml(recipe, logoUrl !== null && logoUrl !== void 0 ? logoUrl : _lastLogoUrl));
+    doc.close();
+    (_frame$contentWindow2 = frame.contentWindow) === null || _frame$contentWindow2 === void 0 || _frame$contentWindow2.focus();
+    (_frame$contentWindow3 = frame.contentWindow) === null || _frame$contentWindow3 === void 0 || _frame$contentWindow3.print();
+  }
+  function handleShowRecipe(_x) {
+    return _handleShowRecipe.apply(this, arguments);
+  }
+  function _handleShowRecipe() {
+    _handleShowRecipe = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(msg) {
+      var recipe, partnerId, _t;
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
+          case 0:
+            recipe = normalizeRecipe(msg);
+            if (recipe) {
+              _context.n = 1;
+              break;
+            }
+            return _context.a(2);
+          case 1:
+            console.log('[RecipeHandler] show_recipe:', recipe.title);
+            if (backdrop) _teardownImmediate();
+            _dismissed = false;
+            _openedAsReshow = !!(msg !== null && msg !== void 0 && msg.reshow);
+            injectStyles();
+            partnerId = (0,_partnerLogo_js__WEBPACK_IMPORTED_MODULE_0__.resolvePartnerId)(widget, msg);
+            if (!partnerId) {
+              _context.n = 3;
+              break;
+            }
+            _context.n = 2;
+            return (0,_partnerLogo_js__WEBPACK_IMPORTED_MODULE_0__.resolvePartnerLogoUrl)(partnerId);
+          case 2:
+            _t = _context.v;
+            _context.n = 4;
+            break;
+          case 3:
+            _t = null;
+          case 4:
+            _lastLogoUrl = _t;
+            if (!_openedAsReshow) downloadRecipeHtml(recipe, _lastLogoUrl);
+            backdrop = document.createElement('div');
+            backdrop.className = 'ttp-rh-backdrop';
+            backdrop.addEventListener('click', dismissRecipe);
+            backdrop.appendChild(_buildCard(recipe, _lastLogoUrl));
+            document.body.appendChild(backdrop);
+            requestAnimationFrame(function () {
+              requestAnimationFrame(function () {
+                var _backdrop;
+                return (_backdrop = backdrop) === null || _backdrop === void 0 ? void 0 : _backdrop.classList.add('ttp-rh-visible');
+              });
+            });
+            backdrop._escHandler = function (e) {
+              if (e.key === 'Escape') dismissRecipe();
+            };
+            document.addEventListener('keydown', backdrop._escHandler);
+            _minimizeWidget();
+            if (!_openedAsReshow) _saveRecipe(recipe);
+          case 5:
+            return _context.a(2);
+        }
+      }, _callee);
+    }));
+    return _handleShowRecipe.apply(this, arguments);
+  }
+  function _saveRecipe(recipe) {
+    try {
+      var store = typeof (widget === null || widget === void 0 ? void 0 : widget.getRecipeStore) === 'function' ? widget.getRecipeStore() : null;
+      if (store) store.add(recipe);
+    } catch (e) {
+      console.warn('[RecipeHandler] Could not save recipe:', e);
+    }
+  }
+  function _pulseStripBadge() {
+    try {
+      var _widget$_ecommerceVoi, _widget$_ecommerceVoi2;
+      widget === null || widget === void 0 || (_widget$_ecommerceVoi = widget._ecommerceVoiceStrip) === null || _widget$_ecommerceVoi === void 0 || (_widget$_ecommerceVoi2 = _widget$_ecommerceVoi.pulseRecipeBadge) === null || _widget$_ecommerceVoi2 === void 0 || _widget$_ecommerceVoi2.call(_widget$_ecommerceVoi);
+    } catch (e) {/* best-effort */}
+  }
+  function dismissRecipe() {
+    var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var _opts$animate = opts.animate,
+      animate = _opts$animate === void 0 ? true : _opts$animate;
+    if (_dismissed || !backdrop) return;
+    _dismissed = true;
+    backdrop.classList.remove('ttp-rh-visible');
+    var el = backdrop;
+    setTimeout(function () {
+      if (el.parentNode) el.parentNode.removeChild(el);
+      if (el._escHandler) document.removeEventListener('keydown', el._escHandler);
+    }, 320);
+    backdrop = null;
+    _restoreWidget();
+    if (animate && !_openedAsReshow) {
+      // Slight delay so the modal fade finishes before the strip badge celebrates.
+      setTimeout(function () {
+        return _pulseStripBadge();
+      }, 180);
+    }
+    _openedAsReshow = false;
+  }
+  function _teardownImmediate() {
+    if (backdrop) {
+      if (backdrop._escHandler) document.removeEventListener('keydown', backdrop._escHandler);
+      if (backdrop.parentNode) backdrop.parentNode.removeChild(backdrop);
+      backdrop = null;
+    }
+    _restoreWidget();
+  }
+  return {
+    handleShowRecipe: handleShowRecipe,
+    dismissRecipe: dismissRecipe,
+    buildRecipeHtml: buildRecipeHtml,
+    downloadRecipeHtml: downloadRecipeHtml
+  };
+}
+
+/***/ }),
+
+/***/ "./src/ecommerce/RecipeStore.js":
+/*!**************************************!*\
+  !*** ./src/ecommerce/RecipeStore.js ***!
+  \**************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   createRecipeStore: () => (/* binding */ createRecipeStore),
+/* harmony export */   recipeStorageKey: () => (/* binding */ recipeStorageKey)
+/* harmony export */ });
+/**
+ * Persist saved recipes in localStorage (scoped by storage key).
+ * In-memory list is the source of truth; subscribers get notified on change.
+ */
+
+var MAX_RECIPES = 50;
+function slugify(title) {
+  var slug = String(title !== null && title !== void 0 ? title : 'recipe').trim().toLowerCase().replace(/[^a-z0-9]+/gi, '-').replace(/^-+|-+$/g, '');
+  return slug || 'recipe';
+}
+
+/**
+ * @param {string} storageKey – e.g. origin + partner id
+ */
+function createRecipeStore(storageKey) {
+  var recipes = [];
+  var listeners = new Set();
+  function _notify() {
+    var snapshot = recipes.slice();
+    listeners.forEach(function (fn) {
+      try {
+        fn(snapshot);
+      } catch (e) {/* subscriber */}
+    });
+  }
+  function _load() {
+    try {
+      var raw = window.localStorage.getItem(storageKey);
+      if (!raw) return;
+      var parsed = JSON.parse(raw);
+      if (Array.isArray(parsed)) recipes = parsed;
+    } catch (e) {
+      console.warn('[RecipeStore] Could not load recipes:', e);
+    }
+  }
+  function _persist() {
+    try {
+      window.localStorage.setItem(storageKey, JSON.stringify(recipes));
+    } catch (e) {
+      console.warn('[RecipeStore] Could not persist recipes:', e);
+    }
+  }
+  function getAll() {
+    return recipes.slice();
+  }
+  function add(recipe) {
+    if (!recipe || !recipe.title) return null;
+    var entry = {
+      id: "".concat(slugify(recipe.title), "-").concat(Date.now()),
+      title: recipe.title,
+      ingredients: Array.isArray(recipe.ingredients) ? recipe.ingredients.slice() : [],
+      steps: Array.isArray(recipe.steps) ? recipe.steps.slice() : [],
+      servings: recipe.servings || '',
+      notes: recipe.notes || '',
+      savedAt: Date.now()
+    };
+    recipes.unshift(entry);
+    if (recipes.length > MAX_RECIPES) recipes.length = MAX_RECIPES;
+    _persist();
+    _notify();
+    return entry;
+  }
+  function subscribe(fn) {
+    listeners.add(fn);
+    return function () {
+      return listeners.delete(fn);
+    };
+  }
+  _load();
+  return {
+    getAll: getAll,
+    add: add,
+    subscribe: subscribe,
+    count: function count() {
+      return recipes.length;
+    }
+  };
+}
+
+/**
+ * Build a scoped storage key for the current page + partner.
+ * @param {string} [partnerId]
+ */
+function recipeStorageKey() {
+  var partnerId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'default';
+  var origin = typeof window !== 'undefined' ? window.location.origin : '';
+  var path = typeof window !== 'undefined' ? window.location.pathname : '';
+  return "".concat(origin).concat(path, "_ttp_recipes_").concat(partnerId);
+}
+
+/***/ }),
+
 /***/ "./src/ecommerce/TTPEcommerceWidget.js":
 /*!*********************************************!*\
   !*** ./src/ecommerce/TTPEcommerceWidget.js ***!
@@ -16644,18 +17374,165 @@ var VariationDesktopPicker = /*#__PURE__*/function () {
   \******************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   generateEcommerceCSS: () => (/* binding */ generateEcommerceCSS)
-/* harmony export */ });
-/**
- * ecommerceStyles - CSS for e-commerce components.
- * Returns a CSS string to be merged into the shadow root <style> tag.
- * Follows the same pattern as Styles.generateCSS().
- */
-function generateEcommerceCSS() {
-  return "\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ECOMMERCE AREA\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n\n/*\n * When products are visible, expand the panel dynamically.\n * Actual height is set via inline style by EcommerceManager._expandPanelToFit().\n * When the class is removed, the panel returns to its CSS-defined default.\n */\n#text-chat-panel.ttp-panel-expanded {\n  transition: height 0.25s ease;\n}\n\n/*\n * Layout overrides ONLY when ecommerce/hotels overlay is active.\n * Scoped under .ttp-products-visible / .ttp-rooms-visible so the\n * normal voice CSS takes effect when products/rooms are hidden.\n *\n * voiceActiveState is a flex column: [voice-controls] [ecommerce] [conversation].\n * Ecommerce area fills the middle and scrolls; conversation panel stays at bottom.\n */\n#voiceActiveState.ttp-products-visible,\n#voiceActiveState.ttp-rooms-visible {\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  overflow: hidden !important;\n}\n\n.ttp-products-visible > .desktop-voice-section,\n.ttp-rooms-visible > .desktop-voice-section {\n  flex-shrink: 1 !important;\n}\n\n/* Conversation + input always stick to bottom; ecommerce area above grows to fill. */\n.ttp-products-visible > .desktop-conversation-panel,\n.ttp-rooms-visible > .desktop-conversation-panel {\n  flex: 0 0 auto !important;\n  margin-top: auto !important;\n  display: flex !important;\n  flex-direction: column !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .live-transcript-collapsed,\n.ttp-rooms-visible .desktop-conversation-panel .live-transcript-collapsed {\n  flex: 0 0 auto !important;\n  min-height: 40px !important;\n  overflow: hidden !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .voice-text-input-area,\n.ttp-rooms-visible .desktop-conversation-panel .voice-text-input-area {\n  margin-top: auto !important;\n  padding: 3px 16px !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .voice-input-hint,\n.ttp-rooms-visible .desktop-conversation-panel .voice-input-hint {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .desktop-voice-section {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .compact-voice-section {\n  display: flex !important;\n}\n\n#voiceActiveState.ttp-products-visible .desktop-conversation-panel {\n  flex: 0 0 auto !important;\n}\n\n#voiceActiveState.ttp-products-visible .conversation-history {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .live-transcript-collapsed {\n  flex: 0 0 auto !important;\n}\n\n.voice-text-input-area {\n  flex-shrink: 0 !important;\n}\n\n.ttp-products-visible .conversation-history,\n.ttp-rooms-visible .conversation-history {\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  overflow-y: auto !important;\n}\n\n.ttp-ecommerce-area {\n  display: flex !important;\n  flex-direction: column !important;\n  width: 100%;\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  position: relative !important;\n  overflow-x: hidden !important;\n  overflow-y: hidden !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT PICKER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-picker {\n  background: rgba(255,255,255,0.04);\n  border-radius: 14px;\n  border: 1px solid rgba(255,255,255,0.08);\n  box-shadow: none;\n  margin: 8px 10px;\n  overflow-x: hidden !important;\n  overflow-y: auto !important;\n  animation: ttpSlideUp 0.25s ease;\n  display: flex !important;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0 !important;\n}\n\n@keyframes ttpSlideUp {\n  from { opacity: 0; transform: translateY(8px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n.ttp-picker-header {\n  display: flex !important;\n  justify-content: space-between;\n  align-items: center;\n  padding: 10px 14px;\n  border-bottom: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-picker-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.5);\n}\n\n.ttp-picker-close {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: rgba(255,255,255,0.4);\n  font-size: 14px;\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n.ttp-picker-close:hover {\n  background: rgba(255,255,255,0.08);\n  color: rgba(255,255,255,0.7);\n}\n\n/* Horizontal card layout */\n.ttp-products-horizontal {\n  display: flex !important;\n  align-items: flex-start;\n  flex-shrink: 0;\n  gap: 10px;\n  padding: 12px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: thin;\n}\n.ttp-products-horizontal::-webkit-scrollbar { height: 4px; }\n.ttp-products-horizontal::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 2px; }\n.ttp-products-horizontal::-webkit-scrollbar-track { background: transparent; }\n\n/* Vertical list layout */\n.ttp-products-vertical {\n  padding: 8px 12px;\n  overflow-y: auto !important;\n  display: flex !important;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  min-height: 0 !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT CARD (horizontal)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-card {\n  width: 170px !important;\n  flex-shrink: 0 !important;\n  background: rgba(255,255,255,0.04);\n  border-radius: 12px;\n  border: 1px solid rgba(255,255,255,0.08);\n  overflow: hidden;\n  transition: border-color 0.15s;\n}\n.ttp-product-card:hover { border-color: rgba(109,86,245,0.5); }\n\n.ttp-product-image {\n  height: 110px !important;\n  background: rgba(0,0,0,0.2);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  overflow: hidden;\n}\n.ttp-product-image img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n}\n\n.ttp-stock-badge {\n  position: absolute;\n  top: 6px; right: 6px;\n  background: rgba(239,68,68,0.15);\n  color: #ef4444;\n  font-size: 9px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n\n.ttp-product-details {\n  padding: 10px 12px 14px;\n}\n\n.ttp-product-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: #e8e4f0;\n  line-height: 1.3;\n  min-height: 30px;\n}\n\n.ttp-product-page-link {\n  display: inline-flex;\n  align-items: center;\n  margin-left: 5px;\n  font-size: 10px;\n  color: #a78bfa;\n  text-decoration: none;\n  opacity: 0.7;\n  vertical-align: middle;\n}\n.ttp-product-page-link:hover { opacity: 1; text-decoration: underline; }\n\n.ttp-product-meta {\n  font-size: 10px;\n  color: rgba(255,255,255,0.35);\n  margin-top: 2px;\n}\n\n.ttp-product-footer {\n  display: flex !important;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 6px;\n}\n\n.ttp-product-price {\n  font-size: 14px;\n  font-weight: 700;\n  color: #e8e4f0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT COMPACT (list view)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-compact {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 8px 10px;\n  background: rgba(255,255,255,0.04);\n  border-radius: 10px;\n  border: 1px solid rgba(255,255,255,0.08);\n  transition: border-color 0.15s;\n}\n.ttp-product-compact:hover { border-color: rgba(109,86,245,0.5); }\n\n.ttp-product-image-sm {\n  width: 72px !important; height: 72px !important;\n  border-radius: 10px;\n  background: rgba(0,0,0,0.2);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.ttp-product-image-sm img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n}\n\n.ttp-product-compact .ttp-product-info {\n  flex: 1;\n  min-width: 0;\n}\n.ttp-product-compact .ttp-product-name {\n  min-height: auto;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: #e8e4f0;\n}\n.ttp-product-compact .ttp-product-action {\n  text-align: right;\n  flex-shrink: 0 !important;\n}\n.ttp-product-compact .ttp-product-price {\n  font-size: 13px;\n}\n\n.ttp-out-of-stock {\n  font-size: 10px;\n  color: #f87171;\n  font-weight: 500;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ADD BUTTON\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-add-btn {\n  padding: 6px 14px;\n  border-radius: 8px;\n  border: 1.5px solid rgba(109,86,245,0.6);\n  font-size: 12px;\n  font-weight: 600;\n  cursor: pointer;\n  background: transparent;\n  color: #a78bfa;\n  transition: all 0.15s;\n}\n.ttp-add-btn:hover { background: rgba(109,86,245,0.15); border-color: #a78bfa; }\n.ttp-add-btn:active { transform: scale(0.95); }\n.ttp-add-btn.ttp-added { background: rgba(109,86,245,0.6) !important; border-color: #7c3aed !important; color: #fff !important; }\n.ttp-add-btn:disabled { cursor: default; opacity: 0.5; }\n.ttp-add-btn.ttp-update-btn { background: rgba(245,158,11,0.15); border-color: rgba(245,158,11,0.5); color: #fbbf24; }\n.ttp-add-btn.ttp-update-btn:hover { background: rgba(245,158,11,0.25); border-color: #fbbf24; }\n\n.ttp-products-animating .ttp-add-btn {\n  opacity: 0.4;\n  pointer-events: none;\n  cursor: not-allowed;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   CART TOAST\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Toast replaces waveform in desktop voice section */\n.ttp-cart-toast {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 12px 16px;\n  margin: 8px 12px;\n  background: rgba(16,185,129,0.1);\n  border-radius: 12px;\n  border: 1px solid rgba(16,185,129,0.2);\n  animation: ttpToastIn 0.25s ease;\n  flex-shrink: 0;\n  box-shadow: none;\n}\n\n@keyframes ttpToastIn {\n  from { opacity: 0; transform: translateY(8px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n.ttp-cart-toast.ttp-toast-hiding {\n  animation: ttpSlideDown 0.3s ease forwards;\n}\n\n@keyframes ttpSlideDown {\n  to { opacity: 0; transform: translateY(-8px); height: 0; padding: 0; margin: 0; overflow: hidden; }\n}\n\n.ttp-toast-icon {\n  width: 24px !important; height: 24px !important;\n  border-radius: 50%;\n  background: #10b981;\n  color: #fff;\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  font-size: 12px;\n  font-weight: 700;\n  flex-shrink: 0;\n}\n\n.ttp-toast-content { flex: 1; min-width: 0; }\n.ttp-toast-title { font-size: 12px; font-weight: 600; color: #34d399; }\n.ttp-toast-product {\n  font-size: 11px;\n  color: rgba(52,211,153,0.7);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ttp-toast-undo {\n  background: none;\n  border: 1px solid rgba(52,211,153,0.3);\n  border-radius: 6px;\n  padding: 3px 8px;\n  font-size: 10px;\n  color: #34d399;\n  cursor: pointer;\n  font-weight: 600;\n  flex-shrink: 0;\n}\n.ttp-toast-undo:hover { background: rgba(52,211,153,0.1); }\n\n/* Fly-to-cart desktop target (when cart summary is hidden) */\n.ttp-desktop-fly-target {\n  position: absolute;\n  bottom: 12px;\n  right: 80px;\n  width: 24px;\n  height: 24px;\n  pointer-events: none;\n}\n\n/* Fly-to-cart ripple effect */\n.ttp-fly-ripple {\n  position: absolute;\n  left: 10px;\n  top: 50%;\n  width: 30px;\n  height: 30px;\n  margin-top: -15px;\n  border-radius: 50%;\n  border: 2px solid rgba(74,222,128,0.7);\n  animation: ttp-ripple-expand 0.6s ease-out forwards;\n  pointer-events: none;\n}\n\n@keyframes ttp-ripple-expand {\n  0% { transform: scale(0.5); opacity: 0.8; }\n  100% { transform: scale(3); opacity: 0; }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   QUANTITY/WEIGHT STEPPER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-stepper {\n  display: flex !important;\n  align-items: center;\n  gap: 2px;\n  margin: 4px 0;\n}\n\n.ttp-stepper-btn {\n  width: 24px !important;\n  height: 24px !important;\n  border-radius: 6px;\n  border: 1px solid rgba(255,255,255,0.15);\n  background: rgba(255,255,255,0.06);\n  color: rgba(255,255,255,0.6);\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  line-height: 1;\n  transition: all 0.15s;\n  flex-shrink: 0;\n}\n\n.ttp-stepper-btn:hover:not(:disabled) {\n  background: rgba(255,255,255,0.12);\n  border-color: rgba(255,255,255,0.25);\n}\n\n.ttp-stepper-btn:active:not(:disabled) {\n  transform: scale(0.9);\n}\n\n.ttp-stepper-btn:disabled,\n.ttp-stepper-disabled {\n  opacity: 0.35;\n  cursor: default;\n}\n\n.ttp-stepper-value {\n  font-size: 12px;\n  font-weight: 600;\n  color: #e8e4f0;\n  min-width: 36px;\n  text-align: center;\n  user-select: none;\n}\n\n.ttp-product-compact .ttp-stepper {\n  justify-content: flex-end;\n}\n\n.ttp-product-compact .ttp-product-action {\n  display: flex !important;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 2px;\n}\n\n.ttp-product-card .ttp-stepper {\n  justify-content: center;\n  margin: 4px 0;\n}\n\n.ttp-product-card .ttp-product-footer {\n  display: flex !important;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   VARIATION DESKTOP PICKER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.picker-relative {\n  position: relative !important;\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  display: flex !important;\n  flex-direction: column !important;\n  overflow: hidden;\n}\n\n/* When variant picker is shown, center it horizontally and vertically */\n.picker-relative.ttp-var-picker-active {\n  justify-content: center !important;\n  align-items: center !important;\n}\n\n.ttp-var-picker {\n  background: rgba(255,255,255,0.04);\n  border-radius: 14px;\n  border: 1px solid rgba(255,255,255,0.08);\n  display: flex !important;\n  flex-direction: column;\n  animation: ttpVarFadeIn 0.2s ease;\n  overflow: hidden;\n  width: 100%;\n  flex-shrink: 0 !important;\n}\n\n@keyframes ttpVarFadeIn {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n\n.ttp-var-header {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  border-bottom: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-var-back-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: rgba(255,255,255,0.5);\n  font-size: 16px;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  line-height: 1;\n  font-family: inherit;\n}\n.ttp-var-back-btn:hover { color: #e8e4f0; }\n\n.ttp-var-title {\n  font-size: 13px;\n  font-weight: 700;\n  color: #e8e4f0;\n  flex: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ttp-var-page-link {\n  font-size: 11px;\n  color: #a78bfa;\n  text-decoration: none;\n  font-weight: 500;\n  white-space: nowrap;\n  flex-shrink: 0;\n}\n.ttp-var-page-link:hover { text-decoration: underline; }\n\n.ttp-var-body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px 14px;\n  display: flex !important;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.ttp-var-preview {\n  display: flex !important;\n  gap: 12px;\n  align-items: flex-start;\n}\n\n.ttp-var-preview-img {\n  width: 72px !important;\n  height: 72px !important;\n  border-radius: 12px;\n  background: rgba(0,0,0,0.2);\n  border: 1px solid rgba(255,255,255,0.08);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: all 0.2s ease;\n}\n\n.ttp-var-preview-img img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n  padding: 6px;\n}\n\n.ttp-var-preview-info { flex: 1; min-width: 0; }\n\n.ttp-var-preview-brand {\n  font-size: 10px;\n  color: rgba(255,255,255,0.4);\n  font-weight: 500;\n  text-transform: uppercase;\n  letter-spacing: 0.3px;\n}\n\n.ttp-var-preview-name {\n  font-size: 14px;\n  font-weight: 700;\n  color: #e8e4f0;\n  margin: 2px 0 4px;\n  line-height: 1.2;\n}\n\n.ttp-var-preview-price {\n  font-size: 18px;\n  font-weight: 700;\n  color: #7c3aed;\n}\n\n.ttp-var-preview-selected {\n  font-size: 11px;\n  color: rgba(255,255,255,0.4);\n  margin-top: 3px;\n}\n\n.ttp-var-section { display: flex !important; flex-direction: column; gap: 8px; }\n\n.ttp-var-section-label {\n  font-size: 11px;\n  font-weight: 700;\n  color: rgba(255,255,255,0.5);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n}\n\n.ttp-var-swatches { display: flex !important; flex-wrap: wrap; gap: 8px; }\n\n.ttp-var-swatch {\n  display: block !important;\n  width: 28px !important;\n  height: 28px !important;\n  border-radius: 50%;\n  cursor: pointer;\n  border: 3px solid transparent;\n  transition: all 0.15s;\n  position: relative;\n  flex-shrink: 0;\n}\n.ttp-var-swatch:hover { transform: scale(1.1); }\n.ttp-var-swatch.selected {\n  border-color: #7c3aed;\n  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #7c3aed;\n}\n.ttp-var-swatch.oos {\n  opacity: 0.35;\n  cursor: not-allowed;\n}\n\n.ttp-var-pills { display: flex !important; flex-wrap: wrap; gap: 6px; }\n\n.ttp-var-pill {\n  padding: 5px 12px;\n  border-radius: 8px;\n  border: 1.5px solid rgba(255,255,255,0.15);\n  background: rgba(255,255,255,0.04);\n  font-size: 12px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.6);\n  cursor: pointer;\n  transition: all 0.15s;\n  font-family: inherit;\n}\n.ttp-var-pill:hover:not(:disabled) { border-color: #7c3aed; color: #a78bfa; }\n.ttp-var-pill.selected { border-color: #7c3aed; background: #7c3aed; color: #fff; }\n.ttp-var-pill.oos { opacity: 0.35; cursor: not-allowed; text-decoration: line-through; }\n\n.ttp-var-footer {\n  padding: 10px 14px 12px;\n  border-top: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-var-add-btn {\n  width: 100%;\n  padding: 10px;\n  background: linear-gradient(135deg, #7c3aed, #6d28d9);\n  color: #fff;\n  border: none;\n  border-radius: 10px;\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n  font-family: inherit;\n  box-shadow: 0 3px 10px rgba(124,58,237,0.3);\n  transition: all 0.15s;\n}\n.ttp-var-add-btn:hover:not(:disabled) { transform: scale(0.99); }\n.ttp-var-add-btn:disabled {\n  background: rgba(255,255,255,0.1);\n  box-shadow: none;\n  cursor: not-allowed;\n  color: rgba(255,255,255,0.3);\n}\n\n.ttp-var-spinner {\n  width: 24px;\n  height: 24px;\n  border: 3px solid rgba(255,255,255,0.1);\n  border-top-color: #7c3aed;\n  border-radius: 50%;\n  animation: ttpVarSpin 0.7s linear infinite;\n}\n@keyframes ttpVarSpin {\n  to { transform: rotate(360deg); }\n}\n\n/* Amber \"Choose\" button for variant products */\n.ttp-add-btn.ttp-choose-btn {\n  background: linear-gradient(135deg, #f59e0b, #d97706);\n  box-shadow: 0 2px 8px rgba(245,158,11,0.3);\n  color: #fff;\n}\n\n  ";
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   generateEcommerceCSS: () => (/* binding */ generateEcommerceCSS)
+/* harmony export */ });
+/**
+ * ecommerceStyles - CSS for e-commerce components.
+ * Returns a CSS string to be merged into the shadow root <style> tag.
+ * Follows the same pattern as Styles.generateCSS().
+ */
+function generateEcommerceCSS() {
+  return "\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ECOMMERCE AREA\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n\n/*\n * When products are visible, expand the panel dynamically.\n * Actual height is set via inline style by EcommerceManager._expandPanelToFit().\n * When the class is removed, the panel returns to its CSS-defined default.\n */\n#text-chat-panel.ttp-panel-expanded {\n  transition: height 0.25s ease;\n}\n\n/*\n * Layout overrides ONLY when ecommerce/hotels overlay is active.\n * Scoped under .ttp-products-visible / .ttp-rooms-visible so the\n * normal voice CSS takes effect when products/rooms are hidden.\n *\n * voiceActiveState is a flex column: [voice-controls] [ecommerce] [conversation].\n * Ecommerce area fills the middle and scrolls; conversation panel stays at bottom.\n */\n#voiceActiveState.ttp-products-visible,\n#voiceActiveState.ttp-rooms-visible {\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  overflow: hidden !important;\n}\n\n.ttp-products-visible > .desktop-voice-section,\n.ttp-rooms-visible > .desktop-voice-section {\n  flex-shrink: 1 !important;\n}\n\n/* Conversation + input always stick to bottom; ecommerce area above grows to fill. */\n.ttp-products-visible > .desktop-conversation-panel,\n.ttp-rooms-visible > .desktop-conversation-panel {\n  flex: 0 0 auto !important;\n  margin-top: auto !important;\n  display: flex !important;\n  flex-direction: column !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .live-transcript-collapsed,\n.ttp-rooms-visible .desktop-conversation-panel .live-transcript-collapsed {\n  flex: 0 0 auto !important;\n  min-height: 40px !important;\n  overflow: hidden !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .voice-text-input-area,\n.ttp-rooms-visible .desktop-conversation-panel .voice-text-input-area {\n  margin-top: auto !important;\n  padding: 3px 16px !important;\n}\n\n.ttp-products-visible .desktop-conversation-panel .voice-input-hint,\n.ttp-rooms-visible .desktop-conversation-panel .voice-input-hint {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .desktop-voice-section {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .compact-voice-section {\n  display: flex !important;\n}\n\n#voiceActiveState.ttp-products-visible .desktop-conversation-panel {\n  flex: 0 0 auto !important;\n}\n\n#voiceActiveState.ttp-products-visible .conversation-history {\n  display: none !important;\n}\n\n#voiceActiveState.ttp-products-visible .live-transcript-collapsed {\n  flex: 0 0 auto !important;\n}\n\n.voice-text-input-area {\n  flex-shrink: 0 !important;\n}\n\n.ttp-products-visible .conversation-history,\n.ttp-rooms-visible .conversation-history {\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  overflow-y: auto !important;\n}\n\n.ttp-ecommerce-area {\n  display: flex !important;\n  flex-direction: column !important;\n  width: 100%;\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  position: relative !important;\n  overflow-x: hidden !important;\n  overflow-y: hidden !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT PICKER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-picker {\n  background: rgba(255,255,255,0.04);\n  border-radius: 14px;\n  border: 1px solid rgba(255,255,255,0.08);\n  box-shadow: none;\n  margin: 8px 10px;\n  overflow-x: hidden !important;\n  overflow-y: auto !important;\n  animation: ttpSlideUp 0.25s ease;\n  display: flex !important;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0 !important;\n}\n\n@keyframes ttpSlideUp {\n  from { opacity: 0; transform: translateY(8px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n.ttp-picker-header {\n  display: flex !important;\n  justify-content: space-between;\n  align-items: center;\n  padding: 10px 14px;\n  border-bottom: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-picker-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.5);\n}\n\n.ttp-picker-close {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: rgba(255,255,255,0.4);\n  font-size: 14px;\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n.ttp-picker-close:hover {\n  background: rgba(255,255,255,0.08);\n  color: rgba(255,255,255,0.7);\n}\n\n/* Horizontal card layout */\n.ttp-products-horizontal {\n  display: flex !important;\n  align-items: flex-start;\n  flex-shrink: 0;\n  gap: 10px;\n  padding: 12px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: thin;\n}\n.ttp-products-horizontal::-webkit-scrollbar { height: 4px; }\n.ttp-products-horizontal::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 2px; }\n.ttp-products-horizontal::-webkit-scrollbar-track { background: transparent; }\n\n/* Vertical list layout */\n.ttp-products-vertical {\n  padding: 8px 12px;\n  overflow-y: auto !important;\n  display: flex !important;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  min-height: 0 !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT CARD (horizontal)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-card {\n  width: 170px !important;\n  flex-shrink: 0 !important;\n  background: rgba(255,255,255,0.04);\n  border-radius: 12px;\n  border: 1px solid rgba(255,255,255,0.08);\n  overflow: hidden;\n  transition: border-color 0.15s;\n}\n.ttp-product-card:hover { border-color: rgba(109,86,245,0.5); }\n\n.ttp-product-image {\n  height: 110px !important;\n  background: rgba(0,0,0,0.2);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  overflow: hidden;\n}\n.ttp-product-image img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n}\n\n.ttp-stock-badge {\n  position: absolute;\n  top: 6px; right: 6px;\n  background: rgba(239,68,68,0.15);\n  color: #ef4444;\n  font-size: 9px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n\n.ttp-product-details {\n  padding: 10px 12px 14px;\n}\n\n.ttp-product-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: #e8e4f0;\n  line-height: 1.3;\n  min-height: 30px;\n}\n\n.ttp-product-page-link {\n  display: inline-flex;\n  align-items: center;\n  margin-left: 5px;\n  font-size: 10px;\n  color: #a78bfa;\n  text-decoration: none;\n  opacity: 0.7;\n  vertical-align: middle;\n}\n.ttp-product-page-link:hover { opacity: 1; text-decoration: underline; }\n\n.ttp-product-meta {\n  font-size: 10px;\n  color: rgba(255,255,255,0.35);\n  margin-top: 2px;\n}\n\n.ttp-product-footer {\n  display: flex !important;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 6px;\n}\n\n.ttp-product-price {\n  font-size: 14px;\n  font-weight: 700;\n  color: #e8e4f0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PRODUCT COMPACT (list view)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-product-compact {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 8px 10px;\n  background: rgba(255,255,255,0.04);\n  border-radius: 10px;\n  border: 1px solid rgba(255,255,255,0.08);\n  transition: border-color 0.15s;\n}\n.ttp-product-compact:hover { border-color: rgba(109,86,245,0.5); }\n\n.ttp-product-image-sm {\n  width: 72px !important; height: 72px !important;\n  border-radius: 10px;\n  background: rgba(0,0,0,0.2);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.ttp-product-image-sm img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n}\n\n.ttp-product-compact .ttp-product-info {\n  flex: 1;\n  min-width: 0;\n}\n.ttp-product-compact .ttp-product-name {\n  min-height: auto;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: #e8e4f0;\n}\n.ttp-product-compact .ttp-product-action {\n  text-align: right;\n  flex-shrink: 0 !important;\n}\n.ttp-product-compact .ttp-product-price {\n  font-size: 13px;\n}\n\n.ttp-out-of-stock {\n  font-size: 10px;\n  color: #f87171;\n  font-weight: 500;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ADD BUTTON\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-add-btn {\n  padding: 6px 14px;\n  border-radius: 8px;\n  border: 1.5px solid rgba(109,86,245,0.6);\n  font-size: 12px;\n  font-weight: 600;\n  cursor: pointer;\n  background: transparent;\n  color: #a78bfa;\n  transition: all 0.15s;\n}\n.ttp-add-btn:hover { background: rgba(109,86,245,0.15); border-color: #a78bfa; }\n.ttp-add-btn:active { transform: scale(0.95); }\n.ttp-add-btn.ttp-added { background: rgba(109,86,245,0.6) !important; border-color: #7c3aed !important; color: #fff !important; }\n.ttp-add-btn:disabled { cursor: default; opacity: 0.5; }\n.ttp-add-btn.ttp-update-btn { background: rgba(245,158,11,0.15); border-color: rgba(245,158,11,0.5); color: #fbbf24; }\n.ttp-add-btn.ttp-update-btn:hover { background: rgba(245,158,11,0.25); border-color: #fbbf24; }\n\n.ttp-products-animating .ttp-add-btn {\n  opacity: 0.4;\n  pointer-events: none;\n  cursor: not-allowed;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   CART TOAST\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Toast replaces waveform in desktop voice section */\n.ttp-cart-toast {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 12px 16px;\n  margin: 8px 12px;\n  background: rgba(16,185,129,0.1);\n  border-radius: 12px;\n  border: 1px solid rgba(16,185,129,0.2);\n  animation: ttpToastIn 0.25s ease;\n  flex-shrink: 0;\n  box-shadow: none;\n}\n\n@keyframes ttpToastIn {\n  from { opacity: 0; transform: translateY(8px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n.ttp-cart-toast.ttp-toast-hiding {\n  animation: ttpSlideDown 0.3s ease forwards;\n}\n\n@keyframes ttpSlideDown {\n  to { opacity: 0; transform: translateY(-8px); height: 0; padding: 0; margin: 0; overflow: hidden; }\n}\n\n.ttp-toast-icon {\n  width: 24px !important; height: 24px !important;\n  border-radius: 50%;\n  background: #10b981;\n  color: #fff;\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  font-size: 12px;\n  font-weight: 700;\n  flex-shrink: 0;\n}\n\n.ttp-toast-content { flex: 1; min-width: 0; }\n.ttp-toast-title { font-size: 12px; font-weight: 600; color: #34d399; }\n.ttp-toast-product {\n  font-size: 11px;\n  color: rgba(52,211,153,0.7);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ttp-toast-undo {\n  background: none;\n  border: 1px solid rgba(52,211,153,0.3);\n  border-radius: 6px;\n  padding: 3px 8px;\n  font-size: 10px;\n  color: #34d399;\n  cursor: pointer;\n  font-weight: 600;\n  flex-shrink: 0;\n}\n.ttp-toast-undo:hover { background: rgba(52,211,153,0.1); }\n\n/* Fly-to-cart desktop target (when cart summary is hidden) */\n.ttp-desktop-fly-target {\n  position: absolute;\n  bottom: 12px;\n  right: 80px;\n  width: 24px;\n  height: 24px;\n  pointer-events: none;\n}\n\n/* Fly-to-cart ripple effect */\n.ttp-fly-ripple {\n  position: absolute;\n  left: 10px;\n  top: 50%;\n  width: 30px;\n  height: 30px;\n  margin-top: -15px;\n  border-radius: 50%;\n  border: 2px solid rgba(74,222,128,0.7);\n  animation: ttp-ripple-expand 0.6s ease-out forwards;\n  pointer-events: none;\n}\n\n@keyframes ttp-ripple-expand {\n  0% { transform: scale(0.5); opacity: 0.8; }\n  100% { transform: scale(3); opacity: 0; }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   QUANTITY/WEIGHT STEPPER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.ttp-stepper {\n  display: flex !important;\n  align-items: center;\n  gap: 2px;\n  margin: 4px 0;\n}\n\n.ttp-stepper-btn {\n  width: 24px !important;\n  height: 24px !important;\n  border-radius: 6px;\n  border: 1px solid rgba(255,255,255,0.15);\n  background: rgba(255,255,255,0.06);\n  color: rgba(255,255,255,0.6);\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  line-height: 1;\n  transition: all 0.15s;\n  flex-shrink: 0;\n}\n\n.ttp-stepper-btn:hover:not(:disabled) {\n  background: rgba(255,255,255,0.12);\n  border-color: rgba(255,255,255,0.25);\n}\n\n.ttp-stepper-btn:active:not(:disabled) {\n  transform: scale(0.9);\n}\n\n.ttp-stepper-btn:disabled,\n.ttp-stepper-disabled {\n  opacity: 0.35;\n  cursor: default;\n}\n\n.ttp-stepper-value {\n  font-size: 12px;\n  font-weight: 600;\n  color: #e8e4f0;\n  min-width: 36px;\n  text-align: center;\n  user-select: none;\n}\n\n.ttp-product-compact .ttp-stepper {\n  justify-content: flex-end;\n}\n\n.ttp-product-compact .ttp-product-action {\n  display: flex !important;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 2px;\n}\n\n.ttp-product-card .ttp-stepper {\n  justify-content: center;\n  margin: 4px 0;\n}\n\n.ttp-product-card .ttp-product-footer {\n  display: flex !important;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   VARIATION DESKTOP PICKER\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.picker-relative {\n  position: relative !important;\n  flex: 1 1 0 !important;\n  min-height: 0 !important;\n  display: flex !important;\n  flex-direction: column !important;\n  overflow: hidden;\n}\n\n/* When variant picker is shown, center it horizontally and vertically */\n.picker-relative.ttp-var-picker-active {\n  justify-content: center !important;\n  align-items: center !important;\n}\n\n.ttp-var-picker {\n  background: rgba(255,255,255,0.04);\n  border-radius: 14px;\n  border: 1px solid rgba(255,255,255,0.08);\n  display: flex !important;\n  flex-direction: column;\n  animation: ttpVarFadeIn 0.2s ease;\n  overflow: hidden;\n  width: 100%;\n  flex-shrink: 0 !important;\n}\n\n@keyframes ttpVarFadeIn {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n\n.ttp-var-header {\n  display: flex !important;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  border-bottom: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-var-back-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: rgba(255,255,255,0.5);\n  font-size: 16px;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  line-height: 1;\n  font-family: inherit;\n}\n.ttp-var-back-btn:hover { color: #e8e4f0; }\n\n.ttp-var-title {\n  font-size: 13px;\n  font-weight: 700;\n  color: #e8e4f0;\n  flex: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ttp-var-page-link {\n  font-size: 11px;\n  color: #a78bfa;\n  text-decoration: none;\n  font-weight: 500;\n  white-space: nowrap;\n  flex-shrink: 0;\n}\n.ttp-var-page-link:hover { text-decoration: underline; }\n\n.ttp-var-body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px 14px;\n  display: flex !important;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.ttp-var-preview {\n  display: flex !important;\n  gap: 12px;\n  align-items: flex-start;\n}\n\n.ttp-var-preview-img {\n  width: 72px !important;\n  height: 72px !important;\n  border-radius: 12px;\n  background: rgba(0,0,0,0.2);\n  border: 1px solid rgba(255,255,255,0.08);\n  display: flex !important;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n  transition: all 0.2s ease;\n}\n\n.ttp-var-preview-img img {\n  width: 100% !important;\n  height: 100% !important;\n  max-width: none !important;\n  object-fit: contain !important;\n  display: block !important;\n  padding: 6px;\n}\n\n.ttp-var-preview-info { flex: 1; min-width: 0; }\n\n.ttp-var-preview-brand {\n  font-size: 10px;\n  color: rgba(255,255,255,0.4);\n  font-weight: 500;\n  text-transform: uppercase;\n  letter-spacing: 0.3px;\n}\n\n.ttp-var-preview-name {\n  font-size: 14px;\n  font-weight: 700;\n  color: #e8e4f0;\n  margin: 2px 0 4px;\n  line-height: 1.2;\n}\n\n.ttp-var-preview-price {\n  font-size: 18px;\n  font-weight: 700;\n  color: #7c3aed;\n}\n\n.ttp-var-preview-selected {\n  font-size: 11px;\n  color: rgba(255,255,255,0.4);\n  margin-top: 3px;\n}\n\n.ttp-var-section { display: flex !important; flex-direction: column; gap: 8px; }\n\n.ttp-var-section-label {\n  font-size: 11px;\n  font-weight: 700;\n  color: rgba(255,255,255,0.5);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n}\n\n.ttp-var-swatches { display: flex !important; flex-wrap: wrap; gap: 8px; }\n\n.ttp-var-swatch {\n  display: block !important;\n  width: 28px !important;\n  height: 28px !important;\n  border-radius: 50%;\n  cursor: pointer;\n  border: 3px solid transparent;\n  transition: all 0.15s;\n  position: relative;\n  flex-shrink: 0;\n}\n.ttp-var-swatch:hover { transform: scale(1.1); }\n.ttp-var-swatch.selected {\n  border-color: #7c3aed;\n  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #7c3aed;\n}\n.ttp-var-swatch.oos {\n  opacity: 0.35;\n  cursor: not-allowed;\n}\n\n.ttp-var-pills { display: flex !important; flex-wrap: wrap; gap: 6px; }\n\n.ttp-var-pill {\n  padding: 5px 12px;\n  border-radius: 8px;\n  border: 1.5px solid rgba(255,255,255,0.15);\n  background: rgba(255,255,255,0.04);\n  font-size: 12px;\n  font-weight: 600;\n  color: rgba(255,255,255,0.6);\n  cursor: pointer;\n  transition: all 0.15s;\n  font-family: inherit;\n}\n.ttp-var-pill:hover:not(:disabled) { border-color: #7c3aed; color: #a78bfa; }\n.ttp-var-pill.selected { border-color: #7c3aed; background: #7c3aed; color: #fff; }\n.ttp-var-pill.oos { opacity: 0.35; cursor: not-allowed; text-decoration: line-through; }\n\n.ttp-var-footer {\n  padding: 10px 14px 12px;\n  border-top: 1px solid rgba(255,255,255,0.06);\n  flex-shrink: 0;\n}\n\n.ttp-var-add-btn {\n  width: 100%;\n  padding: 10px;\n  background: linear-gradient(135deg, #7c3aed, #6d28d9);\n  color: #fff;\n  border: none;\n  border-radius: 10px;\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n  font-family: inherit;\n  box-shadow: 0 3px 10px rgba(124,58,237,0.3);\n  transition: all 0.15s;\n}\n.ttp-var-add-btn:hover:not(:disabled) { transform: scale(0.99); }\n.ttp-var-add-btn:disabled {\n  background: rgba(255,255,255,0.1);\n  box-shadow: none;\n  cursor: not-allowed;\n  color: rgba(255,255,255,0.3);\n}\n\n.ttp-var-spinner {\n  width: 24px;\n  height: 24px;\n  border: 3px solid rgba(255,255,255,0.1);\n  border-top-color: #7c3aed;\n  border-radius: 50%;\n  animation: ttpVarSpin 0.7s linear infinite;\n}\n@keyframes ttpVarSpin {\n  to { transform: rotate(360deg); }\n}\n\n/* Amber \"Choose\" button for variant products */\n.ttp-add-btn.ttp-choose-btn {\n  background: linear-gradient(135deg, #f59e0b, #d97706);\n  box-shadow: 0 2px 8px rgba(245,158,11,0.3);\n  color: #fff;\n}\n\n  ";
+}
+
+/***/ }),
+
+/***/ "./src/ecommerce/partnerLogo.js":
+/*!**************************************!*\
+  !*** ./src/ecommerce/partnerLogo.js ***!
+  \**************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   resolvePartnerId: () => (/* binding */ resolvePartnerId),
+/* harmony export */   resolvePartnerLogoUrl: () => (/* binding */ resolvePartnerLogoUrl),
+/* harmony export */   resolveSdkBaseUrl: () => (/* binding */ resolveSdkBaseUrl)
+/* harmony export */ });
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+/**
+ * Partner logos on the SDK CDN:
+ *   {sdkBaseUrl}/partners/{partnerId}.svg  (preferred — you provide)
+ *   {sdkBaseUrl}/partners/{partnerId}.png  (optional fallback)
+ *
+ * Missing partnerId or missing file → no logo rendered.
+ */
+
+var LOGO_EXTENSIONS = ['svg', 'png'];
+function resolveSdkBaseUrl() {
+  if (typeof document !== 'undefined') {
+    var scripts = document.querySelectorAll('script[src]');
+    var _iterator = _createForOfIteratorHelper(scripts),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var script = _step.value;
+        var src = script.getAttribute('src') || '';
+        if (!src.includes('agent-widget') && !src.includes('ttp-agent-sdk')) continue;
+        try {
+          var url = new URL(src, window.location.href);
+          return url.origin + url.pathname.replace(/\/[^/]*$/, '');
+        } catch (e) {/* continue */}
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  }
+  if (typeof window !== 'undefined') {
+    var host = window.location.hostname || '';
+    if (host.includes('cdn.talktopc.com') || host.includes('talktopc.com')) {
+      return "".concat(window.location.origin, "/ttp-agent-sdk");
+    }
+  }
+  return 'https://cdn.talktopc.com/ttp-agent-sdk';
+}
+
+/** partnerId from wire message, else widget flavor.partnerId. */
+function resolvePartnerId(widget, message) {
+  var _ref, _ref2, _message$partnerId, _message$recipe, _message$recipe2, _widget$config$flavor, _widget$config;
+  var fromMsg = (_ref = (_ref2 = (_message$partnerId = message === null || message === void 0 ? void 0 : message.partnerId) !== null && _message$partnerId !== void 0 ? _message$partnerId : message === null || message === void 0 ? void 0 : message.partner_id) !== null && _ref2 !== void 0 ? _ref2 : message === null || message === void 0 || (_message$recipe = message.recipe) === null || _message$recipe === void 0 ? void 0 : _message$recipe.partnerId) !== null && _ref !== void 0 ? _ref : message === null || message === void 0 || (_message$recipe2 = message.recipe) === null || _message$recipe2 === void 0 ? void 0 : _message$recipe2.partner_id;
+  if (fromMsg && String(fromMsg).trim()) {
+    return String(fromMsg).trim();
+  }
+  var flavor = (_widget$config$flavor = widget === null || widget === void 0 || (_widget$config = widget.config) === null || _widget$config === void 0 ? void 0 : _widget$config.flavor) !== null && _widget$config$flavor !== void 0 ? _widget$config$flavor : widget === null || widget === void 0 ? void 0 : widget._flavorObj;
+  var fromFlavor = flavor === null || flavor === void 0 ? void 0 : flavor.partnerId;
+  if (fromFlavor && String(fromFlavor).trim()) {
+    return String(fromFlavor).trim();
+  }
+  return null;
+}
+function probeImage(url) {
+  return new Promise(function (resolve) {
+    var img = new Image();
+    img.onload = function () {
+      return resolve(true);
+    };
+    img.onerror = function () {
+      return resolve(false);
+    };
+    img.src = url;
+  });
+}
+
+/** @returns {Promise<string|null>} First logo URL that loads, or null. */
+function resolvePartnerLogoUrl(_x, _x2) {
+  return _resolvePartnerLogoUrl.apply(this, arguments);
+}
+function _resolvePartnerLogoUrl() {
+  _resolvePartnerLogoUrl = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(partnerId, sdkBaseUrl) {
+    var id, base, safeId, _iterator2, _step2, ext, url, _t;
+    return _regenerator().w(function (_context) {
+      while (1) switch (_context.p = _context.n) {
+        case 0:
+          id = partnerId === null || partnerId === void 0 ? void 0 : partnerId.trim();
+          if (id) {
+            _context.n = 1;
+            break;
+          }
+          return _context.a(2, null);
+        case 1:
+          base = (sdkBaseUrl || resolveSdkBaseUrl()).replace(/\/$/, '');
+          safeId = encodeURIComponent(id);
+          _iterator2 = _createForOfIteratorHelper(LOGO_EXTENSIONS);
+          _context.p = 2;
+          _iterator2.s();
+        case 3:
+          if ((_step2 = _iterator2.n()).done) {
+            _context.n = 6;
+            break;
+          }
+          ext = _step2.value;
+          url = "".concat(base, "/partners/").concat(safeId, ".").concat(ext); // eslint-disable-next-line no-await-in-loop
+          _context.n = 4;
+          return probeImage(url);
+        case 4:
+          if (!_context.v) {
+            _context.n = 5;
+            break;
+          }
+          return _context.a(2, url);
+        case 5:
+          _context.n = 3;
+          break;
+        case 6:
+          _context.n = 8;
+          break;
+        case 7:
+          _context.p = 7;
+          _t = _context.v;
+          _iterator2.e(_t);
+        case 8:
+          _context.p = 8;
+          _iterator2.f();
+          return _context.f(8);
+        case 9:
+          return _context.a(2, null);
+      }
+    }, _callee, null, [[2, 7, 8, 9]]);
+  }));
+  return _resolvePartnerLogoUrl.apply(this, arguments);
 }
 
 /***/ }),
@@ -16929,6 +17806,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   MESSAGE_TYPES: () => (/* binding */ MESSAGE_TYPES)
 /* harmony export */ });
 /* harmony import */ var _widget_galleryHandler_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../widget/galleryHandler.js */ "./src/widget/galleryHandler.js");
+/* harmony import */ var _ecommerce_RecipeHandler_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../ecommerce/RecipeHandler.js */ "./src/ecommerce/RecipeHandler.js");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -16972,6 +17850,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  */
 
 
+
 /**
  * The universal message types that form the contract between widget and backend.
  * Flavors receive these incoming types and send these outgoing types.
@@ -16983,6 +17862,8 @@ var MESSAGE_TYPES = Object.freeze({
   CART_UPDATED: 'cart_updated',
   SHOW_MEDIA: 'show_media',
   DISMISS_MEDIA: 'dismiss_media',
+  SHOW_RECIPE: 'show_recipe',
+  DISMISS_RECIPE: 'dismiss_recipe',
   // Outgoing (widget → backend)
   PRODUCT_SELECTED: 'product_selected',
   PRODUCT_DESELECTED: 'product_deselected'
@@ -17068,6 +17949,14 @@ var BaseFlavor = /*#__PURE__*/function () {
     value: function buildTools() {
       return [];
     }
+  }, {
+    key: "_getRecipeHandler",
+    value: function _getRecipeHandler() {
+      if (!this._recipeHandler) {
+        this._recipeHandler = (0,_ecommerce_RecipeHandler_js__WEBPACK_IMPORTED_MODULE_1__.createRecipeHandler)(this.widget);
+      }
+      return this._recipeHandler;
+    }
 
     // ─── Shared helpers (available to subclasses) ─────────────────
 
@@ -17178,13 +18067,19 @@ var BaseFlavor = /*#__PURE__*/function () {
       };
 
       // Universal handlers — these are the contract
-      var universal = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MESSAGE_TYPES.SHOW_ITEMS, routeShowItems), "show_products", routeShowItems), MESSAGE_TYPES.CART_UPDATED, function (msg) {
+      var universal = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MESSAGE_TYPES.SHOW_ITEMS, routeShowItems), "show_products", routeShowItems), MESSAGE_TYPES.CART_UPDATED, function (msg) {
         _this.manager.handleCartUpdated(msg);
       }), MESSAGE_TYPES.SHOW_MEDIA, function (msg) {
         _this.hideManagerUI();
         _this.galleryHandler.handleShowMedia(msg);
       }), MESSAGE_TYPES.DISMISS_MEDIA, function () {
         _this.galleryHandler.dismissGallery();
+      }), MESSAGE_TYPES.SHOW_RECIPE, function (msg) {
+        _this._getRecipeHandler().handleShowRecipe(msg);
+      }), MESSAGE_TYPES.DISMISS_RECIPE, function (msg) {
+        _this._getRecipeHandler().dismissRecipe({
+          animate: (msg === null || msg === void 0 ? void 0 : msg.silent) !== true && (msg === null || msg === void 0 ? void 0 : msg.animate) !== false
+        });
       });
 
       // Extra handlers from subclass
@@ -17884,12 +18779,19 @@ var EcommerceFlavor = /*#__PURE__*/function (_BaseFlavor) {
         runAdapter: function runAdapter(action, args) {
           var _self$_partnerScriptR2;
           return (_self$_partnerScriptR2 = self._partnerScriptRunner) === null || _self$_partnerScriptR2 === void 0 ? void 0 : _self$_partnerScriptR2.runAdapter(action, args);
+        },
+        showRecipe: function showRecipe(recipe) {
+          return self._getRecipeHandler().handleShowRecipe({
+            recipe: recipe
+          });
         }
       };
     }
   }, {
     key: "destroy",
     value: function destroy() {
+      var _this$_recipeHandler;
+      (_this$_recipeHandler = this._recipeHandler) === null || _this$_recipeHandler === void 0 || _this$_recipeHandler.dismissRecipe();
       delete window.__TTP_ECOMMERCE__;
       _superPropGet(EcommerceFlavor, "destroy", this, 3)([]);
     }
@@ -20303,8 +21205,8 @@ var VoiceSDK = _v2_VoiceSDK_js__WEBPACK_IMPORTED_MODULE_0__["default"];
 
 
 // Version - injected at build time from package.json via webpack DefinePlugin
-var VERSION = "2.45.14";
-var BUILD_TIME = "2026-06-29T06:35:24.857Z";
+var VERSION = "2.46.1";
+var BUILD_TIME = "2026-07-13T08:30:44.984Z";
 console.log("%c TTP Agent SDK v".concat(VERSION, " (").concat(BUILD_TIME, ") "), 'background: #4f46e5; color: white; font-size: 12px; font-weight: bold; padding: 2px 6px; border-radius: 4px;');
 
 // Named exports
@@ -27010,6 +27912,10 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
       websocketUrl: config.websocketUrl || 'wss://speech.talktopc.com/ws/conv',
       agentId: config.agentId,
       appId: config.appId,
+      // Supervision monitor mode: listen-only to an existing call (no mic).
+      // mode:'monitor' + a short-lived ticket authorize /ws/supervision.
+      mode: config.mode || 'agent',
+      ticket: config.ticket || null,
       // Input format (what we send to server)
 
       sampleRate: config.sampleRate || 16000,
@@ -27651,12 +28557,28 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
     /**
      * Build WebSocket URL with query parameters
      */
+    /** True when this SDK instance is a listen-only supervision monitor (no mic). */
+  }, {
+    key: "isMonitor",
+    value: function isMonitor() {
+      return this.config.mode === 'monitor';
+    }
   }, {
     key: "buildWebSocketUrl",
     value: function buildWebSocketUrl() {
       var baseUrl = this.config.websocketUrl;
       var url = new URL(baseUrl, 'wss://placeholder.com');
       var params = url.searchParams;
+
+      // Supervision monitor: authenticate by the single-use ticket only — no agentId/appId,
+      // and never resume/attach a conversation of our own.
+      if (this.isMonitor()) {
+        if (this.config.ticket && !params.has('ticket')) {
+          params.append('ticket', this.config.ticket);
+        }
+        var queryStringM = params.toString();
+        return queryStringM ? "".concat(url.origin).concat(url.pathname, "?").concat(queryStringM) : "".concat(url.origin).concat(url.pathname);
+      }
       if (this.config.agentId && !params.has('agentId')) {
         params.append('agentId', this.config.agentId);
       }
@@ -27738,9 +28660,12 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
                     });
                   }
 
-                  // Send hello message
-
-                  _this5.sendHelloMessage();
+                  // Send hello message.
+                  // Supervision monitor: the server sends hello_ack unprompted (it only needs to
+                  // advertise outputAudioFormat), so we skip the agent hello entirely.
+                  if (!_this5.isMonitor()) {
+                    _this5.sendHelloMessage();
+                  }
                   _this5.emit('connected');
                   resolve(true);
                 };
@@ -27952,7 +28877,7 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
 
               // Include SDK build time for debugging
               if (true) {
-                helloMessage.lastBuildTime = "2026-06-29T06:35:24.857Z";
+                helloMessage.lastBuildTime = "2026-07-13T08:30:44.984Z";
               }
 
               // Page context is intentionally NOT attached to the hello message.
@@ -28254,6 +29179,8 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
             break;
           case 'show_items':
           case 'show_products':
+          case 'show_recipe':
+          case 'dismiss_recipe':
           case 'cart_updated':
           case 'add_to_store_cart':
           case 'add_to_site_cart':
@@ -28519,6 +29446,11 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
       // VoiceInterface waits for this flag before starting recording,
       // so config.sampleRate must be finalized first.
       this.helloAckReceived = true;
+
+      // Silently re-apply the user's persisted in-call settings (voice speed /
+      // response length) now that the session is ready — the backend applies
+      // them without a spoken acknowledgement (announce:false).
+      this._syncCallSettingsAfterHello();
       if (message.outputAudioFormat) {
         // v2 protocol: format was negotiated
 
@@ -29332,6 +30264,79 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
       }
     }
 
+    /**
+     * In-call user settings (voice speed / response length).
+     *
+     * Sends {t:"call_settings"} to the backend: `voiceSpeedFactor` multiplies the
+     * agent's configured TTS speed (1.0 = agent default, clamped server-side to
+     * 0.5–2.0) and applies from the next synthesized line; `responseLength`
+     * ("detailed"|"normal"|"brief"|"very_brief") is folded into the system prompt
+     * from the next LLM turn. `opts.announce` (default true) lets the agent speak
+     * a short fixed confirmation when idle.
+     *
+     * Called before hello_ack, the values are kept and flushed silently by
+     * _syncCallSettingsAfterHello() once the session is ready.
+     *
+     * @param {{voiceSpeedFactor?: number, responseLength?: string}} settings
+     * @param {{announce?: boolean}} [opts]
+     * @returns {boolean} true if the message was sent now
+     */
+  }, {
+    key: "setCallSettings",
+    value: function setCallSettings() {
+      var settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+      this._callSettings = _objectSpread(_objectSpread({}, this._callSettings || {}), settings);
+      if (!this.helloAckReceived || !this.websocket || this.websocket.readyState !== WebSocket.OPEN) {
+        return false; // flushed after hello_ack
+      }
+      var msg = {
+        t: 'call_settings',
+        announce: opts.announce !== false
+      };
+      if (typeof this._callSettings.voiceSpeedFactor === 'number') {
+        msg.voiceSpeedFactor = this._callSettings.voiceSpeedFactor;
+      }
+      if (this._callSettings.responseLength) {
+        msg.responseLength = this._callSettings.responseLength;
+      }
+      return this.sendMessage(msg);
+    }
+
+    /**
+     * Flush persisted call settings right after hello_ack (silent — no spoken ack).
+     * Values come from an earlier setCallSettings() call or, when none, from
+     * config.callSettingsProvider (the widget wires this to its localStorage).
+     * Defaults (factor 1.0 + "normal") are skipped — nothing to sync.
+     */
+  }, {
+    key: "_syncCallSettingsAfterHello",
+    value: function _syncCallSettingsAfterHello() {
+      try {
+        var s = this._callSettings;
+        if (!s && typeof this.config.callSettingsProvider === 'function') {
+          s = this.config.callSettingsProvider();
+        }
+        if (!s) return;
+        this._callSettings = _objectSpread({}, s);
+        var factor = typeof s.voiceSpeedFactor === 'number' ? s.voiceSpeedFactor : 1.0;
+        var length = s.responseLength || 'normal';
+        if (Math.abs(factor - 1.0) < 0.001 && length === 'normal') return;
+        this.sendMessage({
+          t: 'call_settings',
+          voiceSpeedFactor: factor,
+          responseLength: length,
+          announce: false
+        });
+        console.log('⚙️ VoiceSDK v2: Synced persisted call settings:', {
+          voiceSpeedFactor: factor,
+          responseLength: length
+        });
+      } catch (e) {
+        console.warn('⚙️ VoiceSDK v2: Failed to sync call settings (ignored):', e);
+      }
+    }
+
     /**
      * Pause the call. Stops sending/receiving audio.
      */
@@ -29455,64 +30460,72 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
           while (1) switch (_context8.p = _context8.n) {
             case 0:
               existingMediaStream = _args8.length > 0 && _args8[0] !== undefined ? _args8[0] : null;
-              if (this.isConnected) {
+              if (!this.isMonitor()) {
                 _context8.n = 1;
                 break;
               }
+              // Listen-only supervision: never open the mic / never uplink audio.
+              console.warn('VoiceSDK v2: startRecording ignored in monitor (listen-only) mode');
+              return _context8.a(2, false);
+            case 1:
+              if (this.isConnected) {
+                _context8.n = 2;
+                break;
+              }
               error = new Error('Not connected to voice server');
               this.emit('error', error);
               throw error;
-            case 1:
+            case 2:
               if (!this.isRecording) {
-                _context8.n = 2;
+                _context8.n = 3;
                 break;
               }
               console.warn('VoiceSDK v2: Already recording');
               return _context8.a(2, true);
-            case 2:
+            case 3:
               if (!this.disclaimersPending) {
-                _context8.n = 3;
+                _context8.n = 4;
                 break;
               }
               _error4 = new Error('Server disclaimers must be accepted before recording. Call sendDisclaimerAck(true) first.');
               _error4.code = 'DISCLAIMER_PENDING';
               this.emit('error', _error4);
               throw _error4;
-            case 3:
+            case 4:
               console.log('🎤 VoiceSDK v2: Starting recording...');
-              _context8.p = 4;
+              _context8.p = 5;
               // CRITICAL for mobile browsers: Request microphone permission FIRST
               // iOS: Pass existingMediaStream to avoid second getUserMedia (can fail on iOS)
               console.log('🎤 VoiceSDK v2: Requesting microphone permission (mobile-friendly)...');
-              _context8.n = 5;
+              _context8.n = 6;
               return this.audioRecorder.start(existingMediaStream ? {
                 existingMediaStream: existingMediaStream
               } : {});
-            case 5:
+            case 6:
               if (!(!this.isConnected || !this.websocket || this.websocket.readyState !== WebSocket.OPEN)) {
-                _context8.n = 10;
+                _context8.n = 11;
                 break;
               }
-              _context8.p = 6;
-              _context8.n = 7;
+              _context8.p = 7;
+              _context8.n = 8;
               return this.audioRecorder.stop();
-            case 7:
-              _context8.n = 9;
-              break;
             case 8:
-              _context8.p = 8;
-              _t6 = _context8.v;
+              _context8.n = 10;
+              break;
             case 9:
+              _context8.p = 9;
+              _t6 = _context8.v;
+            case 10:
               _error5 = new Error('Connection lost - server may have rejected the call');
               _error5.name = 'ServerRejected';
               _error5.isServerRejection = true;
               // Don't emit error event - this is expected when server rejects
               // The error handler in VoiceInterface will handle it appropriately
               throw _error5;
-            case 10:
-              _context8.n = 11;
-              return this.audioPlayer.resumeAudioContext();
             case 11:
+              _context8.n = 12;
+              return this.audioPlayer.resumeAudioContext();
+            case 12:
               // After permission is granted, send start_continuous_mode message to server
               this.sendMessage({
                 t: 'start_continuous_mode',
@@ -29522,29 +30535,29 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
               // Request screen wake lock to keep screen on during voice call (mobile)
               this._requestWakeLock();
               return _context8.a(2, true);
-            case 12:
-              _context8.p = 12;
+            case 13:
+              _context8.p = 13;
               _t7 = _context8.v;
               if (!(this.audioRecorder && this.audioRecorder.isRecording)) {
-                _context8.n = 16;
+                _context8.n = 17;
                 break;
               }
-              _context8.p = 13;
-              _context8.n = 14;
+              _context8.p = 14;
+              _context8.n = 15;
               return this.audioRecorder.stop();
-            case 14:
-              _context8.n = 16;
-              break;
             case 15:
-              _context8.p = 15;
-              _t8 = _context8.v;
+              _context8.n = 17;
+              break;
             case 16:
+              _context8.p = 16;
+              _t8 = _context8.v;
+            case 17:
               if (!(_t7.isServerRejection || _t7.name === 'ServerRejected')) {
-                _context8.n = 17;
+                _context8.n = 18;
                 break;
               }
               return _context8.a(2, false);
-            case 17:
+            case 18:
               // Log and emit other errors (permission denied, etc.)
               console.error('❌ VoiceSDK v2: Failed to start recording:', _t7);
 
@@ -29559,7 +30572,7 @@ var VoiceSDK_v2 = /*#__PURE__*/function (_EventEmitter) {
               }
               return _context8.a(2, false);
           }
-        }, _callee8, this, [[13, 15], [6, 8], [4, 12]]);
+        }, _callee8, this, [[14, 16], [7, 9], [5, 13]]);
       }));
       function startRecording() {
         return _startRecording.apply(this, arguments);
@@ -31391,7 +32404,10 @@ var AgentSDK = /*#__PURE__*/function () {
                 flavor: this.config.flavor || null,
                 // Shared client-tool handler map (set by TTPChatWidget so voice + text SDKs
                 // both look up handlers in the same registration site).
-                sharedToolHandlers: this.config.sharedToolHandlers || null
+                sharedToolHandlers: this.config.sharedToolHandlers || null,
+                // Persisted in-call settings provider (voice speed / response length) —
+                // read fresh at hello_ack so localStorage changes survive reconnects.
+                callSettingsProvider: this.config.callSettingsProvider || null
               }));
 
               // If we have stored resume info from checkResumeBeforeConnect(), use it
@@ -32387,6 +33403,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _widget_translations_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./widget-translations.js */ "./src/widget/widget-translations.js");
 /* harmony import */ var _flavors_index_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../flavors/index.js */ "./src/flavors/index.js");
 /* harmony import */ var _ecommerce_EcommerceVoiceStrip_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../ecommerce/EcommerceVoiceStrip.js */ "./src/ecommerce/EcommerceVoiceStrip.js");
+/* harmony import */ var _ecommerce_RecipeStore_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../ecommerce/RecipeStore.js */ "./src/ecommerce/RecipeStore.js");
 var _excluded = ["agentName"];
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
@@ -32415,6 +33432,7 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 
 
 
+
 /** Fallback for `buildWebSocketUrl()` when no optional `websocketUrl` override is set (VoiceSDK v2 uses the same default). */
 var DEFAULT_VOICE_WEBSOCKET_URL = 'wss://speech.talktopc.com/ws/conv';
 function isNonEmptyConfigString(v) {
@@ -32507,7 +33525,8 @@ function talkToPcLinkColorForPanel(isLightPanel, mergedVoice, rawConfig, voiceUi
 }
 var TTPChatWidget = /*#__PURE__*/function () {
   function TTPChatWidget() {
-    var _this$config$behavior,
+    var _this = this,
+      _this$config$behavior,
       _this$config$panel,
       _this$config$flavor,
       _this$config$text,
@@ -32517,8 +33536,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
       _this$config$voice3,
       _this$config$voice4,
       _this$config$voice5,
-      _this$config$voice6,
-      _this = this;
+      _this$config$voice6;
     var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     _classCallCheck(this, TTPChatWidget);
     this._rawConfig = config;
@@ -32526,6 +33544,14 @@ var TTPChatWidget = /*#__PURE__*/function () {
     this.config = this.mergeWithDefaults(config);
     // Silently ignore allowOverride (now server-side only)
 
+    // Persisted in-call settings (voice speed / response length). The provider is
+    // read fresh by VoiceSDK/TextChatSDK right after each hello_ack, so the saved
+    // values re-apply silently on every (re)connect. Rides on this.config so both
+    // voiceConfig spreads and the TextChatSDK constructor pick it up.
+    this.config.callSettingsProvider = function () {
+      return _this._loadCallSettings();
+    };
+
     // Shared client-tool handler map. Both VoiceSDK and TextChatSDK look up
     // handlers in this Map, so a single registerToolHandler() call works for
     // whichever channel the LLM happens to be running on at tool-call time.
@@ -32847,11 +33873,21 @@ var TTPChatWidget = /*#__PURE__*/function () {
                       if (flavor.messageHandlers['dismiss_media']) {
                         flavor.messageHandlers['dismiss_media']();
                       }
+                      if (flavor.messageHandlers['dismiss_recipe']) {
+                        flavor.messageHandlers['dismiss_recipe']({
+                          silent: true
+                        });
+                      }
                     });
                     this.voiceSDK.on('bargeIn', function () {
                       if (flavor.messageHandlers['dismiss_media']) {
                         flavor.messageHandlers['dismiss_media']();
                       }
+                      if (flavor.messageHandlers['dismiss_recipe']) {
+                        flavor.messageHandlers['dismiss_recipe']({
+                          silent: true
+                        });
+                      }
                     });
                     console.log("[TTPChatWidget] Flavor \"".concat(flavorName, "\" message listeners attached (voice)"));
                   }
@@ -33767,6 +34803,20 @@ var TTPChatWidget = /*#__PURE__*/function () {
       };
     }
 
+    /**
+     * Scoped localStorage-backed store for saved recipes (strip badge + popover).
+     */
+  }, {
+    key: "getRecipeStore",
+    value: function getRecipeStore() {
+      if (!this._recipeStore) {
+        var _this$_flavorObj2, _this$config$flavor2;
+        var partnerId = ((_this$_flavorObj2 = this._flavorObj) === null || _this$_flavorObj2 === void 0 ? void 0 : _this$_flavorObj2.partnerId) || (_typeof(this.config.flavor) === 'object' ? (_this$config$flavor2 = this.config.flavor) === null || _this$config$flavor2 === void 0 ? void 0 : _this$config$flavor2.partnerId : null) || 'default';
+        this._recipeStore = (0,_ecommerce_RecipeStore_js__WEBPACK_IMPORTED_MODULE_6__.createRecipeStore)((0,_ecommerce_RecipeStore_js__WEBPACK_IMPORTED_MODULE_6__.recipeStorageKey)(partnerId));
+      }
+      return this._recipeStore;
+    }
+
     /**
      * Generate footer branding HTML
      */
@@ -33854,7 +34904,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         return;
       }
       this._ensureAboutStyles();
-      var version =  true ? "2.45.14" : 0;
+      var version =  true ? "2.46.1" : 0;
       var convId = this._getLastConversationId();
       var t = function t(k, fb) {
         try {
@@ -33911,6 +34961,190 @@ var TTPChatWidget = /*#__PURE__*/function () {
         this._aboutOverlay = null;
       }
     }
+
+    // ===================================================================================
+    // In-call settings (voice speed / response length) — gear button + dialog
+    // ===================================================================================
+
+    /** localStorage key for the persisted call settings, scoped per agent + origin. */
+  }, {
+    key: "_callSettingsStorageKey",
+    value: function _callSettingsStorageKey() {
+      var agent = this.config.agentId || this.config.appId || 'default';
+      return "ttp_call_settings_".concat(agent);
+    }
+
+    /**
+     * Load persisted call settings. Defaults: agent-configured speed (factor 1.0)
+     * and "normal" response length.
+     * @returns {{voiceSpeedFactor: number, responseLength: string}}
+     */
+  }, {
+    key: "_loadCallSettings",
+    value: function _loadCallSettings() {
+      var defaults = {
+        voiceSpeedFactor: 1.0,
+        responseLength: 'normal'
+      };
+      try {
+        var raw = localStorage.getItem(this._callSettingsStorageKey());
+        if (!raw) return defaults;
+        var s = JSON.parse(raw);
+        var factor = typeof s.voiceSpeedFactor === 'number' ? Math.max(0.5, Math.min(2.0, s.voiceSpeedFactor)) : 1.0;
+        var length = ['detailed', 'normal', 'brief', 'very_brief'].includes(s.responseLength) ? s.responseLength : 'normal';
+        return {
+          voiceSpeedFactor: factor,
+          responseLength: length
+        };
+      } catch (_) {
+        return defaults;
+      }
+    }
+  }, {
+    key: "_saveCallSettings",
+    value: function _saveCallSettings(settings) {
+      try {
+        localStorage.setItem(this._callSettingsStorageKey(), JSON.stringify(settings));
+      } catch (_) {/* storage unavailable — settings still apply for this session */}
+    }
+
+    /**
+     * Persist + push a settings change to whichever channel is live. The backend
+     * applies voice speed from the next spoken line and response length from the
+     * next LLM turn — no tool call involved. announce=true lets the agent speak
+     * its short fixed confirmation (only when idle).
+     */
+  }, {
+    key: "_applyCallSettings",
+    value: function _applyCallSettings(partial) {
+      var _this$voiceInterface4, _this$sdk2;
+      var announce = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+      var merged = _objectSpread(_objectSpread({}, this._loadCallSettings()), partial);
+      this._saveCallSettings(merged);
+      var voice = (_this$voiceInterface4 = this.voiceInterface) === null || _this$voiceInterface4 === void 0 || (_this$voiceInterface4 = _this$voiceInterface4.sdk) === null || _this$voiceInterface4 === void 0 ? void 0 : _this$voiceInterface4.voiceSDK;
+      if (voice !== null && voice !== void 0 && voice.setCallSettings) {
+        voice.setCallSettings({
+          voiceSpeedFactor: merged.voiceSpeedFactor,
+          responseLength: merged.responseLength
+        }, {
+          announce: announce
+        });
+      }
+      if ((_this$sdk2 = this.sdk) !== null && _this$sdk2 !== void 0 && _this$sdk2.setCallSettings && this.sdk.connected) {
+        this.sdk.setCallSettings({
+          responseLength: merged.responseLength
+        });
+      }
+    }
+
+    /** Inject the settings-dialog styles into document.head once (global, above the strip). */
+  }, {
+    key: "_ensureCallSettingsStyles",
+    value: function _ensureCallSettingsStyles() {
+      if (document.getElementById('ttp-callsettings-dialog-styles')) return;
+      this._ensureAboutStyles(); // reuse the overlay/card/close/row styles
+      var style = document.createElement('style');
+      style.id = 'ttp-callsettings-dialog-styles';
+      style.textContent = "\n      .ttp-cs-row { text-align: start; }\n      .ttp-cs-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }\n      .ttp-cs-val {\n        font-size: 13px; font-weight: 700; color: #6d28d9;\n        font-variant-numeric: tabular-nums;\n      }\n      .ttp-cs-slider {\n        -webkit-appearance: none; appearance: none; width: 100%; height: 6px;\n        border-radius: 3px; background: #e5e7eb; outline: none; cursor: pointer;\n        accent-color: #6d28d9; margin: 4px 0 2px;\n      }\n      .ttp-cs-slider::-webkit-slider-thumb {\n        -webkit-appearance: none; appearance: none; width: 18px; height: 18px;\n        border-radius: 50%; background: #6d28d9; border: 2px solid #ffffff;\n        box-shadow: 0 1px 4px rgba(0,0,0,0.3); cursor: pointer;\n      }\n      .ttp-cs-slider::-moz-range-thumb {\n        width: 18px; height: 18px; border-radius: 50%; background: #6d28d9;\n        border: 2px solid #ffffff; box-shadow: 0 1px 4px rgba(0,0,0,0.3); cursor: pointer;\n      }\n      .ttp-cs-ends {\n        display: flex; justify-content: space-between;\n        font-size: 10.5px; color: #9ca3af; letter-spacing: 0.2px;\n      }\n    ";
+      document.head.appendChild(style);
+    }
+
+    /**
+     * Open the in-call settings dialog: two sliders — voice speed (higher = faster)
+     * and response length (very brief on the left → detailed on the right). Values
+     * persist to localStorage and apply from the next line/turn (backend `call_settings`).
+     */
+  }, {
+    key: "_openCallSettingsModal",
+    value: function _openCallSettingsModal() {
+      var _this9 = this,
+        _overlay$querySelecto2;
+      if (this._callSettingsOverlay) {
+        this._closeCallSettingsModal();
+        return;
+      }
+      this._ensureCallSettingsStyles();
+      var t = function t(k, fb) {
+        try {
+          var _this9$voiceInterface, _this9$voiceInterface2, _this9$textInterface, _this9$textInterface$;
+          return ((_this9$voiceInterface = _this9.voiceInterface) === null || _this9$voiceInterface === void 0 || (_this9$voiceInterface2 = _this9$voiceInterface.t) === null || _this9$voiceInterface2 === void 0 ? void 0 : _this9$voiceInterface2.call(_this9$voiceInterface, k)) || ((_this9$textInterface = _this9.textInterface) === null || _this9$textInterface === void 0 || (_this9$textInterface$ = _this9$textInterface.t) === null || _this9$textInterface$ === void 0 ? void 0 : _this9$textInterface$.call(_this9$textInterface, k)) || fb;
+        } catch (_) {
+          return fb;
+        }
+      };
+      var title = t('settingsTitle', 'Call settings');
+      var speedLabel = t('settingsVoiceSpeed', 'Voice speed');
+      var lengthLabel = t('settingsResponseLength', 'Response length');
+      // Slider order: very brief (left) → detailed (right); higher = more detail.
+      var LEVELS = ['very_brief', 'brief', 'normal', 'detailed'];
+      var levelLabels = {
+        detailed: t('lengthDetailed', 'Detailed'),
+        normal: t('lengthNormal', 'Normal'),
+        brief: t('lengthBrief', 'Brief'),
+        very_brief: t('lengthVeryBrief', 'Very brief')
+      };
+      var saved = this._loadCallSettings();
+      var levelIdx = Math.max(0, LEVELS.indexOf(saved.responseLength));
+      var overlay = document.createElement('div');
+      overlay.className = 'ttp-about-overlay';
+      overlay.innerHTML = "\n      <div class=\"ttp-about-card\" role=\"dialog\" aria-modal=\"true\" aria-label=\"".concat(title, "\">\n        <button type=\"button\" class=\"ttp-about-close\" aria-label=\"Close\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n            <path d=\"M10 2L2 10M2 2l8 8\"/>\n          </svg>\n        </button>\n        <div class=\"ttp-about-title\">").concat(title, "</div>\n        <div class=\"ttp-about-rows\">\n          <div class=\"ttp-about-row ttp-cs-row\">\n            <div class=\"ttp-cs-head\">\n              <span class=\"ttp-about-key\">").concat(speedLabel, "</span>\n              <span class=\"ttp-cs-val\" data-cs-speed-val></span>\n            </div>\n            <input type=\"range\" class=\"ttp-cs-slider\" data-cs-speed\n                   min=\"0.5\" max=\"2\" step=\"0.05\" value=\"").concat(saved.voiceSpeedFactor, "\"\n                   aria-label=\"").concat(speedLabel, "\">\n            <div class=\"ttp-cs-ends\"><span>0.5\xD7</span><span>2\xD7</span></div>\n          </div>\n          <div class=\"ttp-about-row ttp-cs-row\">\n            <div class=\"ttp-cs-head\">\n              <span class=\"ttp-about-key\">").concat(lengthLabel, "</span>\n              <span class=\"ttp-cs-val\" data-cs-length-val></span>\n            </div>\n            <input type=\"range\" class=\"ttp-cs-slider\" data-cs-length\n                   min=\"0\" max=\"3\" step=\"1\" value=\"").concat(levelIdx, "\"\n                   aria-label=\"").concat(lengthLabel, "\">\n            <div class=\"ttp-cs-ends\"><span>").concat(levelLabels.very_brief, "</span><span>").concat(levelLabels.detailed, "</span></div>\n          </div>\n        </div>\n      </div>");
+      var speedSlider = overlay.querySelector('[data-cs-speed]');
+      var speedVal = overlay.querySelector('[data-cs-speed-val]');
+      var lengthSlider = overlay.querySelector('[data-cs-length]');
+      var lengthVal = overlay.querySelector('[data-cs-length-val]');
+      var fmtSpeed = function fmtSpeed(v) {
+        return "".concat(Number(v).toFixed(2).replace(/0$/, ''), "\xD7");
+      };
+      var renderVals = function renderVals() {
+        if (speedVal) speedVal.textContent = fmtSpeed(speedSlider.value);
+        if (lengthVal) lengthVal.textContent = levelLabels[LEVELS[Number(lengthSlider.value)]] || '';
+      };
+      renderVals();
+
+      // Live label updates while dragging; persist + push on release only.
+      speedSlider === null || speedSlider === void 0 || speedSlider.addEventListener('input', renderVals);
+      lengthSlider === null || lengthSlider === void 0 || lengthSlider.addEventListener('input', renderVals);
+      speedSlider === null || speedSlider === void 0 || speedSlider.addEventListener('change', function () {
+        _this9._applyCallSettings({
+          voiceSpeedFactor: Number(speedSlider.value)
+        }, true);
+      });
+      lengthSlider === null || lengthSlider === void 0 || lengthSlider.addEventListener('change', function () {
+        _this9._applyCallSettings({
+          responseLength: LEVELS[Number(lengthSlider.value)]
+        }, true);
+      });
+      var close = function close() {
+        return _this9._closeCallSettingsModal();
+      };
+      overlay.addEventListener('click', function (e) {
+        if (e.target === overlay) close();
+      });
+      (_overlay$querySelecto2 = overlay.querySelector('.ttp-about-close')) === null || _overlay$querySelecto2 === void 0 || _overlay$querySelecto2.addEventListener('click', function (e) {
+        e.stopPropagation();
+        close();
+      });
+      this._callSettingsKeyHandler = function (e) {
+        if (e.key === 'Escape') close();
+      };
+      document.addEventListener('keydown', this._callSettingsKeyHandler);
+      document.body.appendChild(overlay);
+      this._callSettingsOverlay = overlay;
+    }
+
+    /** Close the in-call settings dialog if open. */
+  }, {
+    key: "_closeCallSettingsModal",
+    value: function _closeCallSettingsModal() {
+      if (this._callSettingsKeyHandler) {
+        document.removeEventListener('keydown', this._callSettingsKeyHandler);
+        this._callSettingsKeyHandler = null;
+      }
+      if (this._callSettingsOverlay) {
+        this._callSettingsOverlay.remove();
+        this._callSettingsOverlay = null;
+      }
+    }
   }, {
     key: "generatePositionStyles",
     value: function generatePositionStyles() {
@@ -34047,7 +35281,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "setupWidgetEvents",
     value: function setupWidgetEvents() {
-      var _this9 = this,
+      var _this0 = this,
         _this$config$behavior8,
         _this$config$position5;
       if (!this.shadowRoot) return;
@@ -34061,17 +35295,17 @@ var TTPChatWidget = /*#__PURE__*/function () {
         launcherBtn.onclick = function (e) {
           e.stopPropagation();
           // A drag just ended — don't treat the trailing click as "open panel".
-          if (_this9._suppressLauncherClick) return;
-          if (_this9.config.promptAnimation.hideAfterClick) {
-            _this9.hidePrompt();
+          if (_this0._suppressLauncherClick) return;
+          if (_this0.config.promptAnimation.hideAfterClick) {
+            _this0.hidePrompt();
           }
-          _this9.togglePanel();
+          _this0.togglePanel();
         };
       }
       var closeBtn = this.shadowRoot.getElementById('closeBtn');
       if (closeBtn) {
         closeBtn.onclick = function () {
-          _this9._doTogglePanel();
+          _this0._doTogglePanel();
         };
       }
 
@@ -34079,23 +35313,34 @@ var TTPChatWidget = /*#__PURE__*/function () {
       var closeIdle = this.shadowRoot.getElementById('ttpCloseIdle');
       if (closeIdle) {
         closeIdle.onclick = function () {
-          return _this9._doTogglePanel();
+          return _this0._doTogglePanel();
         };
       }
       var closeActive = this.shadowRoot.getElementById('ttpCloseActive');
       if (closeActive) {
         closeActive.onclick = function () {
-          return _this9._doTogglePanel();
+          return _this0._doTogglePanel();
         };
       }
 
       // "About" info buttons (present in every view: idle / active / compact /
       // mobile idle / mobile active / text top-bar). One shared dialog.
-      this.shadowRoot.querySelectorAll('.ttp-info-btn').forEach(function (btn) {
+      // Settings gear buttons share the .ttp-info-btn styling class — skip them here.
+      this.shadowRoot.querySelectorAll('.ttp-info-btn:not(.ttp-settings-btn)').forEach(function (btn) {
+        btn.onclick = function (e) {
+          e.stopPropagation();
+          e.preventDefault();
+          _this0._openAboutModal();
+        };
+      });
+
+      // In-call settings gear buttons (active-call views) — one shared dialog with
+      // the voice-speed / response-length sliders.
+      this.shadowRoot.querySelectorAll('.ttp-settings-btn').forEach(function (btn) {
         btn.onclick = function (e) {
           e.stopPropagation();
           e.preventDefault();
-          _this9._openAboutModal();
+          _this0._openCallSettingsModal();
         };
       });
 
@@ -34103,17 +35348,17 @@ var TTPChatWidget = /*#__PURE__*/function () {
       var startTextBtn = this.shadowRoot.getElementById('startTextBtn');
       if (startTextBtn) {
         startTextBtn.onclick = function () {
-          return _this9.showText();
+          return _this0.showText();
         };
       }
       var textUnifiedBackBtn = this.shadowRoot.getElementById('textUnifiedBackBtn');
       if (textUnifiedBackBtn) {
         textUnifiedBackBtn.onclick = function () {
-          var _this9$config$behavio;
-          var widgetMode = ((_this9$config$behavio = _this9.config.behavior) === null || _this9$config$behavio === void 0 ? void 0 : _this9$config$behavio.mode) || 'unified';
+          var _this0$config$behavio;
+          var widgetMode = ((_this0$config$behavio = _this0.config.behavior) === null || _this0$config$behavio === void 0 ? void 0 : _this0$config$behavio.mode) || 'unified';
           if (widgetMode !== 'unified') return;
-          _this9.showLanding();
-          _this9._openMobileCallTextLanding();
+          _this0.showLanding();
+          _this0._openMobileCallTextLanding();
         };
       }
 
@@ -34143,30 +35388,30 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // Setup back button handler
       if (backBtn) {
         backBtn.onclick = function () {
-          var _this9$voiceInterface, _this9$voiceInterface3;
+          var _this0$voiceInterface, _this0$voiceInterface3;
           // Check if we're showing a domain error — clear it and return to voice hero
-          if ((_this9$voiceInterface = _this9.voiceInterface) !== null && _this9$voiceInterface !== void 0 && _this9$voiceInterface.isShowingDomainError) {
-            var _this9$voiceInterface2;
+          if ((_this0$voiceInterface = _this0.voiceInterface) !== null && _this0$voiceInterface !== void 0 && _this0$voiceInterface.isShowingDomainError) {
+            var _this0$voiceInterface2;
             console.log('🔙 Back button clicked - clearing domain error and returning to voice hero');
             // Clear the domain error flag
-            _this9.voiceInterface.isShowingDomainError = false;
+            _this0.voiceInterface.isShowingDomainError = false;
             // Reset the connecting state (this will restore normal UI)
-            if ((_this9$voiceInterface2 = _this9.voiceInterface) !== null && _this9$voiceInterface2 !== void 0 && _this9$voiceInterface2.resetConnectingState) {
-              _this9.voiceInterface.resetConnectingState();
+            if ((_this0$voiceInterface2 = _this0.voiceInterface) !== null && _this0$voiceInterface2 !== void 0 && _this0$voiceInterface2.resetConnectingState) {
+              _this0.voiceInterface.resetConnectingState();
             }
-            _this9.showLanding();
-            _this9._openMobileCallTextLanding();
+            _this0.showLanding();
+            _this0._openMobileCallTextLanding();
             return;
           }
-          if ((_this9$voiceInterface3 = _this9.voiceInterface) !== null && _this9$voiceInterface3 !== void 0 && _this9$voiceInterface3.isActive) {
+          if ((_this0$voiceInterface3 = _this0.voiceInterface) !== null && _this0$voiceInterface3 !== void 0 && _this0$voiceInterface3.isActive) {
             // If call is active, show message inside widget instead of modal
-            _this9.showBackButtonWarning();
+            _this0.showBackButtonWarning();
           } else if (window.innerWidth <= 768) {
-            _this9.showLanding();
-            _this9._openMobileCallTextLanding();
+            _this0.showLanding();
+            _this0._openMobileCallTextLanding();
           } else {
             // Desktop: return to voice hero (unified home)
-            _this9.showLanding();
+            _this0.showLanding();
           }
         };
       }
@@ -34209,7 +35454,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // Setup header button handlers
       if (newChatBtn) {
         newChatBtn.onclick = function () {
-          return _this9.textInterface.startNewChat();
+          return _this0.textInterface.startNewChat();
         };
         // Hide new chat on unified home (voice hero) initially
         if (isUnified && this.currentView !== 'text') {
@@ -34355,7 +35600,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_restoreUnitOffset",
     value: function _restoreUnitOffset(key) {
-      var _this0 = this;
+      var _this1 = this;
       var saved;
       try {
         saved = JSON.parse(window.localStorage.getItem(key) || 'null');
@@ -34364,13 +35609,13 @@ var TTPChatWidget = /*#__PURE__*/function () {
       }
       if (!saved || typeof saved.x !== 'number' || typeof saved.y !== 'number') return;
       requestAnimationFrame(function () {
-        _this0._unitOffset = {
+        _this1._unitOffset = {
           x: 0,
           y: 0
         }; // ensure DOM matches before measuring
-        var bases = _this0._unitBaseRects();
-        _this0._unitOffset = _this0._clampUnitOffset(saved.x, saved.y, bases);
-        _this0._applyUnitOffset();
+        var bases = _this1._unitBaseRects();
+        _this1._unitOffset = _this1._clampUnitOffset(saved.x, saved.y, bases);
+        _this1._applyUnitOffset();
       });
     }
 
@@ -34387,7 +35632,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_attachUnitDrag",
     value: function _attachUnitDrag(handle, opts) {
-      var _this1 = this;
+      var _this10 = this;
       var persist = opts.persist,
         key = opts.key,
         excludeSelector = opts.excludeSelector,
@@ -34408,8 +35653,8 @@ var TTPChatWidget = /*#__PURE__*/function () {
         var dy = e.clientY - startY;
         if (!moved && Math.hypot(dx, dy) < DRAG_THRESHOLD) return;
         moved = true;
-        _this1._unitOffset = _this1._clampUnitOffset(baseX + dx, baseY + dy, bases);
-        _this1._applyUnitOffset();
+        _this10._unitOffset = _this10._clampUnitOffset(baseX + dx, baseY + dy, bases);
+        _this10._applyUnitOffset();
       };
       var _onUp = function onUp(e) {
         window.removeEventListener('pointermove', onMove);
@@ -34423,7 +35668,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
           if (typeof onMoved === 'function') onMoved();
           if (persist && key) {
             try {
-              window.localStorage.setItem(key, JSON.stringify(_this1._unitOffset));
+              window.localStorage.setItem(key, JSON.stringify(_this10._unitOffset));
             } catch (err) {/* unavailable */}
           }
         }
@@ -34434,7 +35679,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         if (excludeSelector && e.target && e.target.closest && e.target.closest(excludeSelector)) return;
         dragging = true;
         moved = false;
-        var o = _this1._unitOffset || (_this1._unitOffset = {
+        var o = _this10._unitOffset || (_this10._unitOffset = {
           x: 0,
           y: 0
         });
@@ -34442,7 +35687,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         startY = e.clientY;
         baseX = o.x;
         baseY = o.y;
-        bases = _this1._unitBaseRects();
+        bases = _this10._unitBaseRects();
         handle.style.setProperty('cursor', 'grabbing');
         try {
           handle.setPointerCapture(e.pointerId);
@@ -34464,7 +35709,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
     key: "setupDraggableWidget",
     value: function setupDraggableWidget() {
       var _this$config$position6,
-        _this10 = this;
+        _this11 = this;
       var root = this.shadowRoot;
       if (!root) return;
       var container = root.getElementById('text-chat-button-container');
@@ -34480,14 +35725,14 @@ var TTPChatWidget = /*#__PURE__*/function () {
 
       // Launcher handles: pill + mobile FAB (suppress the click after a drag).
       [root.getElementById('text-chat-button'), root.querySelector('.ttp-mobile-fab')].filter(Boolean).forEach(function (h) {
-        return _this10._attachUnitDrag(h, {
+        return _this11._attachUnitDrag(h, {
           persist: persist,
           key: key,
           restCursor: 'grab',
           onMoved: function onMoved() {
-            _this10._suppressLauncherClick = true;
+            _this11._suppressLauncherClick = true;
             setTimeout(function () {
-              _this10._suppressLauncherClick = false;
+              _this11._suppressLauncherClick = false;
             }, 0);
           }
         });
@@ -34498,7 +35743,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         ['.ttp-header', '.ttp-call-topbar', '.text-interface-top-bar'].map(function (sel) {
           return panel.querySelector(sel);
         }).filter(Boolean).forEach(function (h) {
-          return _this10._attachUnitDrag(h, {
+          return _this11._attachUnitDrag(h, {
             persist: persist,
             key: key,
             restCursor: 'move',
@@ -34533,13 +35778,13 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_bindDragResize",
     value: function _bindDragResize() {
-      var _this11 = this;
+      var _this12 = this;
       if (this._dragResizeBound) return;
       this._dragResizeBound = true;
       window.addEventListener('resize', function () {
-        var _this11$_ecommerceVoi, _this11$_ecommerceVoi2;
-        _this11._reclampUnit();
-        (_this11$_ecommerceVoi = _this11._ecommerceVoiceStrip) === null || _this11$_ecommerceVoi === void 0 || (_this11$_ecommerceVoi2 = _this11$_ecommerceVoi.reclampDrag) === null || _this11$_ecommerceVoi2 === void 0 || _this11$_ecommerceVoi2.call(_this11$_ecommerceVoi);
+        var _this12$_ecommerceVoi, _this12$_ecommerceVoi2;
+        _this12._reclampUnit();
+        (_this12$_ecommerceVoi = _this12._ecommerceVoiceStrip) === null || _this12$_ecommerceVoi === void 0 || (_this12$_ecommerceVoi2 = _this12$_ecommerceVoi.reclampDrag) === null || _this12$_ecommerceVoi2 === void 0 || _this12$_ecommerceVoi2.call(_this12$_ecommerceVoi);
       });
     }
   }, {
@@ -34588,9 +35833,9 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_isDomainErrorVisible",
     value: function _isDomainErrorVisible() {
-      var _this$voiceInterface4, _this$voiceInterface5, _idleState$dataset;
-      if ((_this$voiceInterface4 = this.voiceInterface) !== null && _this$voiceInterface4 !== void 0 && _this$voiceInterface4.isShowingDomainError) return true;
-      var idleState = (_this$voiceInterface5 = this.voiceInterface) === null || _this$voiceInterface5 === void 0 || (_this$voiceInterface5 = _this$voiceInterface5.shadowRoot) === null || _this$voiceInterface5 === void 0 ? void 0 : _this$voiceInterface5.getElementById('voiceIdleState');
+      var _this$voiceInterface5, _this$voiceInterface6, _idleState$dataset;
+      if ((_this$voiceInterface5 = this.voiceInterface) !== null && _this$voiceInterface5 !== void 0 && _this$voiceInterface5.isShowingDomainError) return true;
+      var idleState = (_this$voiceInterface6 = this.voiceInterface) === null || _this$voiceInterface6 === void 0 || (_this$voiceInterface6 = _this$voiceInterface6.shadowRoot) === null || _this$voiceInterface6 === void 0 ? void 0 : _this$voiceInterface6.getElementById('voiceIdleState');
       return idleState && ((_idleState$dataset = idleState.dataset) === null || _idleState$dataset === void 0 ? void 0 : _idleState$dataset.domainError) === 'true';
     }
   }, {
@@ -34618,7 +35863,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_openMobileCallTextLanding",
     value: function _openMobileCallTextLanding() {
-      var _this12 = this;
+      var _this13 = this;
       if (!this.shadowRoot || window.innerWidth > 768) return;
       var mobileFab = this.shadowRoot.querySelector('.ttp-mobile-fab');
       var mobileLanding = this.shadowRoot.getElementById('ttpMobileLanding');
@@ -34629,30 +35874,30 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // "Back" button: composedPath includes the panel but not #ttpMobileLanding, so it treated
       // the click as "outside" and closed the landing immediately (user only saw the FAB again).
       var open = function open() {
-        if (!_this12.shadowRoot || window.innerWidth > 768) return;
-        var panel = _this12.shadowRoot.getElementById('text-chat-panel');
+        if (!_this13.shadowRoot || window.innerWidth > 768) return;
+        var panel = _this13.shadowRoot.getElementById('text-chat-panel');
         if (panel) {
           panel.classList.remove('open');
-          _this12.isOpen = false;
+          _this13.isOpen = false;
         }
-        if (_this12.config.promptAnimation.hideAfterClick) {
-          _this12.hidePrompt();
+        if (_this13.config.promptAnimation.hideAfterClick) {
+          _this13.hidePrompt();
         }
-        var errorBanner = _this12.shadowRoot.getElementById('ttpMobileLandingError');
+        var errorBanner = _this13.shadowRoot.getElementById('ttpMobileLandingError');
         if (errorBanner) errorBanner.style.display = 'none';
-        var fab = _this12.shadowRoot.querySelector('.ttp-mobile-fab');
-        var landing = _this12.shadowRoot.getElementById('ttpMobileLanding');
+        var fab = _this13.shadowRoot.querySelector('.ttp-mobile-fab');
+        var landing = _this13.shadowRoot.getElementById('ttpMobileLanding');
         if (!fab || !landing) return;
         fab.style.display = 'none';
         landing.classList.add('active');
-        _this12.isMobileLandingOpen = true;
+        _this13.isMobileLandingOpen = true;
       };
       queueMicrotask(open);
     }
   }, {
     key: "setupMobileWidgetEvents",
     value: function setupMobileWidgetEvents() {
-      var _this13 = this;
+      var _this14 = this;
       if (!this.shadowRoot) return;
       var mobileFab = this.shadowRoot.querySelector('.ttp-mobile-fab');
       var mobileLanding = this.shadowRoot.getElementById('ttpMobileLanding');
@@ -34660,12 +35905,12 @@ var TTPChatWidget = /*#__PURE__*/function () {
       var closeMobileLanding = function closeMobileLanding() {
         mobileLanding.classList.remove('active');
         mobileFab.style.display = '';
-        _this13.isMobileLandingOpen = false;
+        _this14.isMobileLandingOpen = false;
       };
       mobileFab.onclick = function () {
         // A drag just ended — don't open the landing on the trailing click.
-        if (_this13._suppressLauncherClick) return;
-        _this13._openMobileCallTextLanding();
+        if (_this14._suppressLauncherClick) return;
+        _this14._openMobileCallTextLanding();
       };
       var mobileClose = mobileLanding.querySelector('.ttp-mobile-landing__close');
       if (mobileClose) {
@@ -34675,18 +35920,18 @@ var TTPChatWidget = /*#__PURE__*/function () {
       if (mobileCallBtn) {
         mobileCallBtn.onclick = function () {
           closeMobileLanding();
-          var panel = _this13.shadowRoot.getElementById('text-chat-panel');
+          var panel = _this14.shadowRoot.getElementById('text-chat-panel');
           if (panel) {
             panel.style.removeProperty('display');
             panel.classList.add('open');
-            _this13.isOpen = true;
+            _this14.isOpen = true;
           }
           mobileFab.style.display = 'none';
-          _this13.showVoice();
+          _this14.showVoice();
           // Landing already chose "Voice call" — start the call (mic permission / pre-prompt) instead of
           // leaving users on a second "Start Call" tap that feels broken.
           queueMicrotask(function () {
-            _this13.startVoiceCall().catch(function (err) {
+            _this14.startVoiceCall().catch(function (err) {
               console.error('[TTPChatWidget] Mobile landing voice start failed:', err);
             });
           });
@@ -34696,20 +35941,20 @@ var TTPChatWidget = /*#__PURE__*/function () {
       if (mobileChatBtn) {
         mobileChatBtn.onclick = function () {
           closeMobileLanding();
-          var panel = _this13.shadowRoot.getElementById('text-chat-panel');
+          var panel = _this14.shadowRoot.getElementById('text-chat-panel');
           if (panel) {
             panel.style.removeProperty('display');
             panel.classList.add('open');
-            _this13.isOpen = true;
+            _this14.isOpen = true;
           }
           mobileFab.style.display = 'none';
-          _this13.showText();
+          _this14.showText();
         };
       }
 
       // Close mobile landing on outside click
       document.addEventListener('click', function (e) {
-        if (!_this13.isMobileLandingOpen) return;
+        if (!_this14.isMobileLandingOpen) return;
         var path = e.composedPath();
         if (!path.includes(mobileLanding) && !path.includes(mobileFab)) {
           closeMobileLanding();
@@ -34718,7 +35963,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
 
       // Close mobile landing on Escape
       document.addEventListener('keydown', function (e) {
-        if (e.key === 'Escape' && _this13.isMobileLandingOpen) {
+        if (e.key === 'Escape' && _this14.isMobileLandingOpen) {
           closeMobileLanding();
         }
       });
@@ -34734,19 +35979,19 @@ var TTPChatWidget = /*#__PURE__*/function () {
           _prevIsMobile = nowMobile;
           if (nowMobile) {
             // Switched desktop → mobile: close desktop panel so only mobile FAB shows
-            if (_this13.isOpen) {
-              var _this13$shadowRoot, _this13$shadowRoot2;
-              var panel = (_this13$shadowRoot = _this13.shadowRoot) === null || _this13$shadowRoot === void 0 ? void 0 : _this13$shadowRoot.getElementById('text-chat-panel');
+            if (_this14.isOpen) {
+              var _this14$shadowRoot, _this14$shadowRoot2;
+              var panel = (_this14$shadowRoot = _this14.shadowRoot) === null || _this14$shadowRoot === void 0 ? void 0 : _this14$shadowRoot.getElementById('text-chat-panel');
               if (panel) {
                 panel.classList.remove('open');
-                _this13.isOpen = false;
+                _this14.isOpen = false;
               }
-              var pill = (_this13$shadowRoot2 = _this13.shadowRoot) === null || _this13$shadowRoot2 === void 0 ? void 0 : _this13$shadowRoot2.getElementById('text-chat-button');
+              var pill = (_this14$shadowRoot2 = _this14.shadowRoot) === null || _this14$shadowRoot2 === void 0 ? void 0 : _this14$shadowRoot2.getElementById('text-chat-button');
               if (pill) pill.classList.remove('open');
             }
           } else {
             // Switched mobile → desktop: close mobile landing/FAB so only desktop pill shows
-            if (_this13.isMobileLandingOpen) {
+            if (_this14.isMobileLandingOpen) {
               closeMobileLanding();
             }
             // Ensure mobile FAB is reset to CSS-controlled state (media query hides it on desktop)
@@ -34758,10 +36003,10 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "setupKeyboardNavigation",
     value: function setupKeyboardNavigation() {
-      var _this14 = this;
+      var _this15 = this;
       document.addEventListener('keydown', function (e) {
-        if (e.key === 'Escape' && _this14.isOpen) {
-          _this14.togglePanel();
+        if (e.key === 'Escape' && _this15.isOpen) {
+          _this15.togglePanel();
         }
       });
     }
@@ -34772,7 +36017,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "setupPromptAnimation",
     value: function setupPromptAnimation() {
-      var _this15 = this;
+      var _this16 = this;
       if (!this.shadowRoot) return;
       var promptConfig = this.config.promptAnimation || {};
       // Default to disabled if not specified (enabled === true means explicitly enabled)
@@ -34802,7 +36047,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // Auto-hide after configured seconds (only if widget is closed)
       if (!this.isOpen && promptConfig.hideAfterSeconds !== null && promptConfig.hideAfterSeconds > 0) {
         this.promptAutoHideTimer = setTimeout(function () {
-          _this15.hidePrompt();
+          _this16.hidePrompt();
         }, promptConfig.hideAfterSeconds * 1000);
       }
 
@@ -34814,7 +36059,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         // Wrap the callback to also hide pulse rings
         this.config.onConversationStart = function () {
           // Hide pulse rings when call starts
-          var pulseRings = _this15.shadowRoot.getElementById('prompt-pulse-rings');
+          var pulseRings = _this16.shadowRoot.getElementById('prompt-pulse-rings');
           if (pulseRings) pulseRings.style.display = 'none';
 
           // Call original callback if it exists
@@ -34826,7 +36071,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         // Also listen to recordingStarted event from SDK if available
         if (this.voiceInterface.sdk.voiceSDK) {
           this.voiceInterface.sdk.voiceSDK.on('recordingStarted', function () {
-            var pulseRings = _this15.shadowRoot.getElementById('prompt-pulse-rings');
+            var pulseRings = _this16.shadowRoot.getElementById('prompt-pulse-rings');
             if (pulseRings) pulseRings.style.display = 'none';
           });
         }
@@ -34874,7 +36119,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "showPrompt",
     value: function showPrompt() {
-      var _this16 = this;
+      var _this17 = this;
       if (!this.shadowRoot) return;
       var promptConfig = this.config.promptAnimation || {};
       // Default to enabled if not specified
@@ -34894,8 +36139,8 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // Function to actually show the elements
       var doShow = function doShow() {
         // Show prompt bubble (check both shadow root and document for compatibility)
-        var promptBubble = _this16.shadowRoot.getElementById('prompt-bubble');
-        if (!promptBubble && _this16.shadowRoot !== document) {
+        var promptBubble = _this17.shadowRoot.getElementById('prompt-bubble');
+        if (!promptBubble && _this17.shadowRoot !== document) {
           promptBubble = document.getElementById('prompt-bubble');
         }
         if (promptBubble) {
@@ -34909,8 +36154,8 @@ var TTPChatWidget = /*#__PURE__*/function () {
 
         // Show pulse rings if enabled
         if (promptConfig.showPulseRings !== false) {
-          var _pulseRings = _this16.shadowRoot.getElementById('prompt-pulse-rings');
-          if (!_pulseRings && _this16.shadowRoot !== document) {
+          var _pulseRings = _this17.shadowRoot.getElementById('prompt-pulse-rings');
+          if (!_pulseRings && _this17.shadowRoot !== document) {
             _pulseRings = document.getElementById('prompt-pulse-rings');
           }
           if (_pulseRings) {
@@ -34947,7 +36192,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         }
         // Start new timer
         this.promptAutoHideTimer = setTimeout(function () {
-          _this16.hidePrompt();
+          _this17.hidePrompt();
         }, promptConfig.hideAfterSeconds * 1000);
       }
     }
@@ -34963,7 +36208,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_doTogglePanel",
     value: function _doTogglePanel() {
-      var _this17 = this;
+      var _this18 = this;
       if (!this.shadowRoot) return;
       this.isOpen = !this.isOpen;
       var panel = this.shadowRoot.getElementById('text-chat-panel');
@@ -34977,7 +36222,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
           if ((_this$config$position8 = this.config.position) !== null && _this$config$position8 !== void 0 && _this$config$position8.draggable) {
             this._applyUnitOffset();
             requestAnimationFrame(function () {
-              return _this17._reclampUnit();
+              return _this18._reclampUnit();
             });
           }
         }
@@ -34994,7 +36239,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         // Panel is opening - hide prompt
         this.hidePrompt();
         setTimeout(function () {
-          var input = _this17.shadowRoot.getElementById('messageInput');
+          var input = _this18.shadowRoot.getElementById('messageInput');
           if (input) input.focus();
         }, 100);
       } else {
@@ -35006,13 +36251,13 @@ var TTPChatWidget = /*#__PURE__*/function () {
         // Panel is closing - show prompt (if enabled)
         this.showPrompt();
         setTimeout(function () {
-          var _this17$config$prompt;
-          var promptBubble = _this17.shadowRoot.getElementById('prompt-bubble');
+          var _this18$config$prompt;
+          var promptBubble = _this18.shadowRoot.getElementById('prompt-bubble');
           if (promptBubble && promptBubble.style.display === 'none') {
             promptBubble.style.display = 'block';
           }
-          var pulseRings = _this17.shadowRoot.getElementById('prompt-pulse-rings');
-          if (pulseRings && ((_this17$config$prompt = _this17.config.promptAnimation) === null || _this17$config$prompt === void 0 ? void 0 : _this17$config$prompt.showPulseRings) !== false) {
+          var pulseRings = _this18.shadowRoot.getElementById('prompt-pulse-rings');
+          if (pulseRings && ((_this18$config$prompt = _this18.config.promptAnimation) === null || _this18$config$prompt === void 0 ? void 0 : _this18$config$prompt.showPulseRings) !== false) {
             if (pulseRings.style.display === 'none') {
               pulseRings.style.display = 'block';
             }
@@ -35204,8 +36449,8 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "showBackButtonWarning",
     value: function showBackButtonWarning() {
-      var _this$voiceInterface6, _this$voiceInterface$;
-      if (!((_this$voiceInterface6 = this.voiceInterface) !== null && _this$voiceInterface6 !== void 0 && _this$voiceInterface6.isActive)) return;
+      var _this$voiceInterface7, _this$voiceInterface$;
+      if (!((_this$voiceInterface7 = this.voiceInterface) !== null && _this$voiceInterface7 !== void 0 && _this$voiceInterface7.isActive)) return;
 
       // Show warning message in the voice interface
       if ((_this$voiceInterface$ = this.voiceInterface.desktop) !== null && _this$voiceInterface$ !== void 0 && _this$voiceInterface$.showBackButtonWarning) {
@@ -35280,13 +36525,13 @@ var TTPChatWidget = /*#__PURE__*/function () {
     value: function updateConfig(newConfig) {
       var _this$config3,
         _this$config4,
-        _this$config$flavor2,
+        _this$config$flavor3,
         _this$config$voice8,
         _this$config$voice9,
         _this$config$voice0,
         _this$config$voice1,
         _this$config$voice10,
-        _this18 = this;
+        _this19 = this;
       // Deep merge nested objects
       var mergedConfig = _objectSpread({}, this.config);
 
@@ -35484,7 +36729,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
       // Recreate interfaces with new config (after mergeWithDefaults, so language is current)
       // Ensure language is correctly passed - use the merged config value
       var currentLanguage = this.config.language || 'en';
-      var desktopMinimizedEcommerceStripUi = typeof window !== 'undefined' && window.innerWidth > 768 && ((_this$config$flavor2 = this.config.flavor) === null || _this$config$flavor2 === void 0 ? void 0 : _this$config$flavor2.callView) === 'minimized';
+      var desktopMinimizedEcommerceStripUi = typeof window !== 'undefined' && window.innerWidth > 768 && ((_this$config$flavor3 = this.config.flavor) === null || _this$config$flavor3 === void 0 ? void 0 : _this$config$flavor3.callView) === 'minimized';
       var voiceConfig = _objectSpread(_objectSpread(_objectSpread({}, this.config), this.config.voice), {}, {
         agentName: this.config.agentName,
         language: currentLanguage,
@@ -35504,20 +36749,20 @@ var TTPChatWidget = /*#__PURE__*/function () {
         outputBitDepth: ((_this$config$voice10 = this.config.voice) === null || _this$config$voice10 === void 0 ? void 0 : _this$config$voice10.outputBitDepth) || 16,
         desktopMinimizedEcommerceStripUi: desktopMinimizedEcommerceStripUi,
         onDesktopMinimizedStripCallStart: desktopMinimizedEcommerceStripUi ? function () {
-          var _this18$_ecommerceVoi;
-          (_this18$_ecommerceVoi = _this18._ecommerceVoiceStrip) === null || _this18$_ecommerceVoi === void 0 || _this18$_ecommerceVoi.show();
-          if (_this18.isOpen) _this18.minimize();
-          _this18._setPanelFooterVisible(false);
-          _this18._setEcommerceStripLauncherVisible(false);
+          var _this19$_ecommerceVoi;
+          (_this19$_ecommerceVoi = _this19._ecommerceVoiceStrip) === null || _this19$_ecommerceVoi === void 0 || _this19$_ecommerceVoi.show();
+          if (_this19.isOpen) _this19.minimize();
+          _this19._setPanelFooterVisible(false);
+          _this19._setEcommerceStripLauncherVisible(false);
         } : undefined,
         onDesktopMinimizedStripLauncherRestore: desktopMinimizedEcommerceStripUi ? function () {
-          return _this18._restoreDesktopEcommerceStripChrome();
+          return _this19._restoreDesktopEcommerceStripChrome();
         } : undefined,
         // Pass event callbacks to voice interface (forward only; panel is not auto-minimized on call start)
         onConversationStart: function onConversationStart() {
-          if (typeof _this18.config.onConversationStart === 'function') {
-            var _this18$config;
-            (_this18$config = _this18.config).onConversationStart.apply(_this18$config, arguments);
+          if (typeof _this19.config.onConversationStart === 'function') {
+            var _this19$config;
+            (_this19$config = _this19.config).onConversationStart.apply(_this19$config, arguments);
           }
         },
         onConversationEnd: this.config.onConversationEnd,
@@ -35526,48 +36771,48 @@ var TTPChatWidget = /*#__PURE__*/function () {
         onAudioStoppedPlaying: this.config.onAudioStoppedPlaying,
         onSubtitleDisplay: this.config.onSubtitleDisplay,
         onCallEnd: function onCallEnd() {
-          var _this18$config$behavi;
-          if (_this18._isDomainErrorVisible()) return;
-          var widgetMode = ((_this18$config$behavi = _this18.config.behavior) === null || _this18$config$behavi === void 0 ? void 0 : _this18$config$behavi.mode) || 'unified';
+          var _this19$config$behavi;
+          if (_this19._isDomainErrorVisible()) return;
+          var widgetMode = ((_this19$config$behavi = _this19.config.behavior) === null || _this19$config$behavi === void 0 ? void 0 : _this19$config$behavi.mode) || 'unified';
           if (widgetMode === 'unified') {
             if (window.innerWidth <= 768) {
-              var _this18$shadowRoot, _this18$shadowRoot2;
-              var panel = (_this18$shadowRoot = _this18.shadowRoot) === null || _this18$shadowRoot === void 0 ? void 0 : _this18$shadowRoot.getElementById('text-chat-panel');
+              var _this19$shadowRoot, _this19$shadowRoot2;
+              var panel = (_this19$shadowRoot = _this19.shadowRoot) === null || _this19$shadowRoot === void 0 ? void 0 : _this19$shadowRoot.getElementById('text-chat-panel');
               if (panel) {
                 panel.classList.remove('open');
-                _this18.isOpen = false;
+                _this19.isOpen = false;
               }
-              var fab = (_this18$shadowRoot2 = _this18.shadowRoot) === null || _this18$shadowRoot2 === void 0 ? void 0 : _this18$shadowRoot2.querySelector('.ttp-mobile-fab');
+              var fab = (_this19$shadowRoot2 = _this19.shadowRoot) === null || _this19$shadowRoot2 === void 0 ? void 0 : _this19$shadowRoot2.querySelector('.ttp-mobile-fab');
               if (fab) fab.style.display = '';
             }
-            _this18.showLanding();
+            _this19.showLanding();
           }
         },
         onShowVoice: function onShowVoice() {
-          _this18.showVoice();
+          _this19.showVoice();
         },
         onShowLanding: function onShowLanding() {
-          _this18.showLanding();
+          _this19.showLanding();
         },
         onDisclaimerDeclined: function onDisclaimerDeclined() {
-          var _this18$config$behavi2;
-          if (_this18._isDomainErrorVisible()) return;
-          var widgetMode = ((_this18$config$behavi2 = _this18.config.behavior) === null || _this18$config$behavi2 === void 0 ? void 0 : _this18$config$behavi2.mode) || 'unified';
+          var _this19$config$behavi2;
+          if (_this19._isDomainErrorVisible()) return;
+          var widgetMode = ((_this19$config$behavi2 = _this19.config.behavior) === null || _this19$config$behavi2 === void 0 ? void 0 : _this19$config$behavi2.mode) || 'unified';
           if (widgetMode === 'voice-only') {
-            _this18.showVoice();
+            _this19.showVoice();
             return;
           }
           if (widgetMode !== 'unified') return;
           if (window.innerWidth <= 768) {
-            var _this18$shadowRoot3;
-            var panel = (_this18$shadowRoot3 = _this18.shadowRoot) === null || _this18$shadowRoot3 === void 0 ? void 0 : _this18$shadowRoot3.getElementById('text-chat-panel');
+            var _this19$shadowRoot3;
+            var panel = (_this19$shadowRoot3 = _this19.shadowRoot) === null || _this19$shadowRoot3 === void 0 ? void 0 : _this19$shadowRoot3.getElementById('text-chat-panel');
             if (panel) {
               panel.classList.remove('open');
-              _this18.isOpen = false;
+              _this19.isOpen = false;
             }
-            _this18._openMobileCallTextLanding();
+            _this19._openMobileCallTextLanding();
           } else {
-            _this18.showLanding();
+            _this19.showLanding();
           }
         },
         direction: this.getEffectiveTextDirection()
@@ -35614,9 +36859,9 @@ var TTPChatWidget = /*#__PURE__*/function () {
   }, {
     key: "_initEcommerceVoiceStrip",
     value: function _initEcommerceVoiceStrip() {
-      var _this19 = this,
+      var _this20 = this,
         _this$config$position9,
-        _this$voiceInterface7;
+        _this$voiceInterface8;
       var flavor = this.config.flavor && _typeof(this.config.flavor) === 'object' ? this.config.flavor : null;
       if (window.innerWidth <= 768) return;
       if (!flavor || flavor.callView !== 'minimized') return;
@@ -35637,34 +36882,44 @@ var TTPChatWidget = /*#__PURE__*/function () {
           endCallButtonColor: v.endCallButtonColor || '#ef4444'
         },
         getVoiceUiState: function getVoiceUiState() {
-          var _this19$voiceInterfac, _this19$voiceInterfac2, _this19$voiceInterfac3;
+          var _this20$voiceInterfac, _this20$voiceInterfac2, _this20$voiceInterfac3;
           return {
-            isMicMuted: !!((_this19$voiceInterfac = _this19.voiceInterface) !== null && _this19$voiceInterfac !== void 0 && _this19$voiceInterfac.isMicMuted),
-            isPaused: !!((_this19$voiceInterfac2 = _this19.voiceInterface) !== null && _this19$voiceInterfac2 !== void 0 && _this19$voiceInterfac2.isPaused),
-            isSpeakerMuted: !!((_this19$voiceInterfac3 = _this19.voiceInterface) !== null && _this19$voiceInterfac3 !== void 0 && _this19$voiceInterfac3.isSpeakerMuted)
+            isMicMuted: !!((_this20$voiceInterfac = _this20.voiceInterface) !== null && _this20$voiceInterfac !== void 0 && _this20$voiceInterfac.isMicMuted),
+            isPaused: !!((_this20$voiceInterfac2 = _this20.voiceInterface) !== null && _this20$voiceInterfac2 !== void 0 && _this20$voiceInterfac2.isPaused),
+            isSpeakerMuted: !!((_this20$voiceInterfac3 = _this20.voiceInterface) !== null && _this20$voiceInterfac3 !== void 0 && _this20$voiceInterfac3.isSpeakerMuted)
           };
         },
         onAbout: function onAbout() {
-          return _this19._openAboutModal();
+          return _this20._openAboutModal();
+        },
+        onSettings: function onSettings() {
+          return _this20._openCallSettingsModal();
+        },
+        onRecipeSelect: function onRecipeSelect(recipe) {
+          var _this20$_flavor, _this20$_flavor$_getR, _this20$_flavor$_getR2;
+          (_this20$_flavor = _this20._flavor) === null || _this20$_flavor === void 0 || (_this20$_flavor$_getR = _this20$_flavor._getRecipeHandler) === null || _this20$_flavor$_getR === void 0 || (_this20$_flavor$_getR = _this20$_flavor$_getR.call(_this20$_flavor)) === null || _this20$_flavor$_getR === void 0 || (_this20$_flavor$_getR2 = _this20$_flavor$_getR.handleShowRecipe) === null || _this20$_flavor$_getR2 === void 0 || _this20$_flavor$_getR2.call(_this20$_flavor$_getR, {
+            recipe: recipe,
+            reshow: true
+          });
         },
         onHangup: function onHangup() {
-          if (_this19.voiceInterface) _this19.voiceInterface.endVoiceCall();
+          if (_this20.voiceInterface) _this20.voiceInterface.endVoiceCall();
         },
         onToggleMute: function onToggleMute() {
-          if (_this19.voiceInterface) _this19.voiceInterface.toggleMute();
+          if (_this20.voiceInterface) _this20.voiceInterface.toggleMute();
           strip.syncFromVoice();
         },
         onTogglePause: function onTogglePause() {
-          if (_this19.voiceInterface) _this19.voiceInterface.togglePause();
+          if (_this20.voiceInterface) _this20.voiceInterface.togglePause();
           strip.syncFromVoice();
         },
         onToggleSpeaker: function onToggleSpeaker() {
-          if (_this19.voiceInterface) _this19.voiceInterface.toggleSpeaker();
+          if (_this20.voiceInterface) _this20.voiceInterface.toggleSpeaker();
           strip.syncFromVoice();
         },
         onSendText: function onSendText(text) {
-          var _this19$voiceInterfac4;
-          var voiceSDK = (_this19$voiceInterfac4 = _this19.voiceInterface) === null || _this19$voiceInterfac4 === void 0 || (_this19$voiceInterfac4 = _this19$voiceInterfac4.sdk) === null || _this19$voiceInterfac4 === void 0 ? void 0 : _this19$voiceInterfac4.voiceSDK;
+          var _this20$voiceInterfac4;
+          var voiceSDK = (_this20$voiceInterfac4 = _this20.voiceInterface) === null || _this20$voiceInterfac4 === void 0 || (_this20$voiceInterfac4 = _this20$voiceInterfac4.sdk) === null || _this20$voiceInterfac4 === void 0 ? void 0 : _this20$voiceInterfac4.voiceSDK;
           if (voiceSDK && typeof voiceSDK.sendMessage === 'function') {
             voiceSDK.sendMessage({
               t: 'text_inject',
@@ -35674,6 +36929,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         }
       });
       this._ecommerceVoiceStrip = strip;
+      strip.bindRecipeStore(this.getRecipeStore());
 
       // Make the strip draggable too when position.draggable is enabled.
       if ((_this$config$position9 = this.config.position) !== null && _this$config$position9 !== void 0 && _this$config$position9.draggable) {
@@ -35681,7 +36937,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
       }
 
       // Show strip when conversation starts
-      var agentSDK = (_this$voiceInterface7 = this.voiceInterface) === null || _this$voiceInterface7 === void 0 ? void 0 : _this$voiceInterface7.sdk;
+      var agentSDK = (_this$voiceInterface8 = this.voiceInterface) === null || _this$voiceInterface8 === void 0 ? void 0 : _this$voiceInterface8.sdk;
       if (agentSDK) {
         var origConvStart = agentSDK.onConversationStart;
         agentSDK.onConversationStart = function () {
@@ -35719,7 +36975,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
         var _this$voiceInterface$2;
         var origOnCallEnd = this.voiceInterface.config.onCallEnd;
         this.voiceInterface.config.onCallEnd = function () {
-          _this19._restoreDesktopEcommerceStripChrome();
+          _this20._restoreDesktopEcommerceStripChrome();
           if (typeof origOnCallEnd === 'function') origOnCallEnd();
         };
 
@@ -35843,7 +37099,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
     key: "injectData",
     value: (function () {
       var _injectData = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee6(data) {
-        var _this$voiceInterface8;
+        var _this$voiceInterface9;
         var options,
           voiceSDK,
           ack,
@@ -35868,7 +37124,7 @@ var TTPChatWidget = /*#__PURE__*/function () {
               throw new Error('Voice call is not active');
             case 2:
               // Check if SDK is available
-              voiceSDK = (_this$voiceInterface8 = this.voiceInterface) === null || _this$voiceInterface8 === void 0 ? void 0 : _this$voiceInterface8.getVoiceSDK();
+              voiceSDK = (_this$voiceInterface9 = this.voiceInterface) === null || _this$voiceInterface9 === void 0 ? void 0 : _this$voiceInterface9.getVoiceSDK();
               if (voiceSDK) {
                 _context6.n = 3;
                 break;
@@ -36902,7 +38158,9 @@ var VoiceInterface = /*#__PURE__*/function () {
       flavor: config.flavor,
       // Shared client-tool handler map from TTPChatWidget (so the same handler
       // map serves both voice and text channels).
-      sharedToolHandlers: config.sharedToolHandlers
+      sharedToolHandlers: config.sharedToolHandlers,
+      // Persisted in-call settings provider (voice speed / response length).
+      callSettingsProvider: config.callSettingsProvider
     });
 
     // Initialize modules with context (delegation pattern)
@@ -41278,6 +42536,22 @@ var Templates = /*#__PURE__*/function () {
       return "<button type=\"button\" class=\"".concat(cls, "\" aria-label=\"").concat(escapeHtmlAttr(label), "\" title=\"").concat(escapeHtmlAttr(label), "\">\n              <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <circle cx=\"12\" cy=\"12\" r=\"9\"/>\n                <line x1=\"12\" y1=\"11\" x2=\"12\" y2=\"16\"/>\n                <circle cx=\"12\" cy=\"7.7\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>\n              </svg>\n            </button>");
     }
 
+    /**
+     * Shared in-call settings gear button markup. Opens the call-settings dialog
+     * (voice speed / response length sliders) wired by TTPChatWidget. Shares the
+     * .ttp-info-btn styling class; .ttp-settings-btn is the wiring discriminator.
+     * @param {string} [extraClass] - extra class(es) for positioning per view
+     * @returns {string}
+     */
+  }, {
+    key: "settingsButton",
+    value: function settingsButton() {
+      var extraClass = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      var cls = extraClass ? "ttp-info-btn ttp-settings-btn ".concat(extraClass) : 'ttp-info-btn ttp-settings-btn';
+      var label = this.t('settingsTitle') || 'Call settings';
+      return "<button type=\"button\" class=\"".concat(cls, "\" aria-label=\"").concat(escapeHtmlAttr(label), "\" title=\"").concat(escapeHtmlAttr(label), "\">\n              <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <circle cx=\"12\" cy=\"12\" r=\"3\"/>\n                <path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33h.01a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51h.01a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82v.01a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\"/>\n              </svg>\n            </button>");
+    }
+
     /**
      * Generate HTML for voice interface.
      * Automatically detects mobile vs desktop based on voiceInterface.isMobile
@@ -41308,7 +42582,7 @@ var Templates = /*#__PURE__*/function () {
       var transcriptPlaceholder = this.t('transcriptWillAppear') || '';
       var transcriptDir = (0,_rtlText_js__WEBPACK_IMPORTED_MODULE_0__.dirForTranscriptSnippet)(transcriptPlaceholder, this.config);
       var voiceInputDir = (0,_rtlText_js__WEBPACK_IMPORTED_MODULE_0__.dirForAssistantStreamingText)(this.config);
-      return "<div class=\"voice-interface\" id=\"voiceInterface\">\n      <!-- Idle View -->\n      <div id=\"voiceIdleState\">\n        <div class=\"ttp-hero\">\n          <div class=\"ttp-header\">\n            <div class=\"ttp-agent\">\n              <div class=\"ttp-avatar-wrap\">\n                <div class=\"".concat(idleAvatarClass, "\">").concat(idleAvatarInner, "</div>\n                <div class=\"ttp-online-dot\"></div>\n              </div>\n              <div>\n                <div class=\"ttp-agent-name\">").concat(agentName, "</div>\n                <div class=\"ttp-agent-role\">").concat(agentRole, "</div>\n              </div>\n            </div>\n            <div class=\"ttp-header-actions\">\n              ").concat(this.infoButton(), "\n              <button type=\"button\" class=\"ttp-close-btn\" id=\"ttpCloseIdle\" aria-label=\"Close widget\">\n                <svg width=\"10\" height=\"10\" viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                  <path d=\"M10 2L2 10M2 2l8 8\"/>\n                </svg>\n              </button>\n            </div>\n          </div>\n          <div class=\"ttp-headline\">").concat(headline, "</div>\n          <div class=\"ttp-subline\">").concat(subline, "</div>\n        </div>\n\n        <div class=\"ttp-body\">\n          <button type=\"button\" class=\"ttp-btn-primary\" id=\"startCallBtn\">\n            <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"").concat(this.config.startCallButtonTextColor || 'white', "\" stroke-width=\"2\">\n              <path d=\"M12 2a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V5a3 3 0 0 1 3-3z\"/>\n              <path d=\"M19 10v2a7 7 0 0 1-14 0v-2M12 19v3M8 22h8\"/>\n            </svg>\n            ").concat(this.getText('startCallButtonText', 'startCall') || 'Start Voice Call', "\n          </button>\n          ").concat((((_this$config$behavior = this.config.behavior) === null || _this$config$behavior === void 0 ? void 0 : _this$config$behavior.mode) || 'unified') !== 'voice-only' ? "\n          <button type=\"button\" class=\"ttp-btn-secondary\" id=\"startTextBtn\">\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n              <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>\n            </svg>\n            ".concat(this.config.sendMessageText || this.getText('sendMessageText', 'sendMessage') || 'Send a Message', "\n          </button>\n          ") : '', "\n          ").concat((_this$config$whatsapp = this.config.whatsapp) !== null && _this$config$whatsapp !== void 0 && _this$config$whatsapp.number ? "\n          <a class=\"ttp-btn-wa\" id=\"ttpWhatsAppBtn\"\n             href=\"https://wa.me/".concat(this.config.whatsapp.number).concat(this.config.whatsapp.text ? '?text=' + encodeURIComponent(this.config.whatsapp.text) : '', "\"\n             target=\"_blank\" rel=\"noopener\">\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"#25d366\">\n              <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.655-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z\"/>\n            </svg>\n            WhatsApp\n          </a>\n          ") : '', "\n        </div>\n      </div>\n\n      <!-- Active Call View -->\n      <div id=\"voiceActiveState\" style=\"display: none;\">\n        <!-- Full voice section (hidden when items/rooms are shown) -->\n        <div class=\"desktop-voice-section\" id=\"desktopVoiceSection\">\n          <div class=\"ttp-call-hero\">\n            <div class=\"ttp-call-topbar\">\n              <div class=\"ttp-rec\">\n                <div class=\"ttp-rec-dot\"></div>\n                <span class=\"ttp-timer\" id=\"desktopTimerText\">00:00</span>\n              </div>\n              <span class=\"ttp-call-label\">Voice call active</span>\n              <div class=\"ttp-header-actions\">\n                ").concat(this.infoButton(), "\n                <button type=\"button\" class=\"ttp-close-btn\" id=\"ttpCloseActive\" aria-label=\"Close widget\">\n                  <svg width=\"9\" height=\"9\" viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                    <path d=\"M10 2L2 10M2 2l8 8\"/>\n                  </svg>\n                </button>\n              </div>\n            </div>\n\n            <div class=\"ttp-orb-wrap\">\n              <div class=\"ttp-orb-rings\">\n                <div class=\"ttp-ring ttp-ring-1\"></div>\n                <div class=\"ttp-ring ttp-ring-2\"></div>\n                <div class=\"ttp-orb\" id=\"desktopMainWaveform\">\n                  <div class=\"ttp-wave\" id=\"ttp-wave\"></div>\n                </div>\n              </div>\n              <div class=\"ttp-listen-label\" id=\"desktopStatusText\">").concat(this.t('listening') || 'Listening to you...', "</div>\n            </div>\n          </div>\n\n          <div class=\"ttp-controls\">\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopMuteBtn\" title=\"").concat(this.getTooltip('mute'), "\" aria-label=\"Mute microphone\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-mic-icon\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-mic-off-icon\" style=\"display: none; position: absolute;\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopPauseBtn\" title=\"Pause call\" aria-label=\"Pause call\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" class=\"desktop-pause-icon\">\n                <rect x=\"6\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                <rect x=\"14\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"none\" class=\"desktop-play-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"6,4 20,12 6,20\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopSpeakerBtn\" title=\"").concat(this.getTooltip('speaker'), "\" aria-label=\"Toggle speaker\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-speaker-icon\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-speaker-off-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-end-btn\" id=\"desktopEndCallBtn\" title=\"").concat(this.getTooltip('endCall'), "\" aria-label=\"End call\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.99 12 19.79 19.79 0 0 1 1.97 3.4 2 2 0 0 1 3.95 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <!-- Compact voice section (shown when items/rooms are visible) -->\n        <div class=\"compact-voice-section\" id=\"compactVoiceSection\" style=\"display: none;\">\n          <div class=\"compact-left\">\n            <div class=\"compact-avatar\" id=\"desktopAvatarCompact\">\n              <div class=\"ttp-orb compact-orb\" id=\"desktopMainWaveformCompact\">\n                <div class=\"ttp-wave\"></div>\n              </div>\n            </div>\n            <div class=\"compact-info\">\n              <div class=\"compact-timer\" id=\"desktopTimerCompact\">\n                <span class=\"ttp-rec-dot\"></span>\n                <span id=\"compactTimerText\">00:00</span>\n              </div>\n              <div class=\"compact-status\" id=\"desktopStatusCompact\">\n                <span id=\"compactStatusText\">").concat(this.t('listening') || 'Listening...', "</span>\n              </div>\n            </div>\n          </div>\n          <div class=\"compact-controls\">\n            ").concat(this.infoButton('ttp-info-btn--onctrl'), "\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopMuteBtnCompact\" title=\"").concat(this.getTooltip('mute'), "\" aria-label=\"Mute microphone\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-mic-icon\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-mic-off-icon\" style=\"display: none; position: absolute;\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopPauseBtnCompact\" title=\"Pause call\" aria-label=\"Pause call\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" class=\"desktop-pause-icon\">\n                <rect x=\"6\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                <rect x=\"14\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"none\" class=\"desktop-play-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"6,4 20,12 6,20\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopSpeakerBtnCompact\" title=\"").concat(this.getTooltip('speaker'), "\" aria-label=\"Toggle speaker\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-speaker-icon\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-speaker-off-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn danger\" id=\"desktopEndCallBtnCompact\" title=\"").concat(this.getTooltip('endCall'), "\" aria-label=\"End call\">\n              <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" style=\"overflow: visible;\">\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.99 12 19.79 19.79 0 0 1 1.97 3.4 2 2 0 0 1 3.95 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\" transform=\"rotate(135 12 12)\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <!-- Transcript -->\n        <div class=\"ttp-transcript desktop-conversation-panel\" id=\"desktopConversationPanel\" dir=\"").concat(textDir, "\">\n          <div class=\"ttp-transcript-hdr\" id=\"conversationHeader\">\n            <span class=\"ttp-live-label\">Live</span>\n            <span class=\"ttp-toggle-text\" id=\"conversationToggleText\">Show history</span>\n            <div class=\"ttp-dots\">\n              <div class=\"ttp-dot\"></div>\n              <div class=\"ttp-dot\"></div>\n              <div class=\"ttp-dot\"></div>\n            </div>\n          </div>\n          <div class=\"live-transcript-collapsed\" id=\"liveTranscriptCollapsed\">\n            <div class=\"ttp-transcript-text\" id=\"liveTextCollapsed\" dir=\"").concat(transcriptDir, "\">\n              ").concat(this.t('transcriptWillAppear') || 'Transcript will appear here...', "<span class=\"ttp-cursor\"></span>\n            </div>\n          </div>\n          <div class=\"conversation-history\" id=\"conversationHistory\">\n            <div class=\"conversation-messages\" id=\"conversationMessages\"></div>\n            <div class=\"live-message-row\" id=\"liveMessageRow\" style=\"display: none;\">\n              <div class=\"message-bubble\" dir=\"").concat(transcriptDir, "\">\n                <span class=\"live-badge\">Live</span>\n                <span id=\"liveMessageText\"></span><span class=\"ttp-cursor\"></span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <!-- Type row -->\n        <div class=\"ttp-type-row voice-text-input-area\">\n          <input class=\"ttp-input\" type=\"text\" id=\"voiceTextInput\" dir=\"").concat(voiceInputDir, "\" placeholder=\"").concat(this.getText('inputPlaceholder', 'typeMessage') || 'Or type here…', "\" aria-label=\"Type a message\" />\n          <button type=\"button\" class=\"ttp-send-btn\" id=\"voiceSendBtn\" aria-label=\"Send message\">\n            <svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\">\n              <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\"/>\n              <polygon points=\"22 2 15 22 11 13 2 9 22 2\"/>\n            </svg>\n          </button>\n        </div>\n      </div>\n    </div>");
+      return "<div class=\"voice-interface\" id=\"voiceInterface\">\n      <!-- Idle View -->\n      <div id=\"voiceIdleState\">\n        <div class=\"ttp-hero\">\n          <div class=\"ttp-header\">\n            <div class=\"ttp-agent\">\n              <div class=\"ttp-avatar-wrap\">\n                <div class=\"".concat(idleAvatarClass, "\">").concat(idleAvatarInner, "</div>\n                <div class=\"ttp-online-dot\"></div>\n              </div>\n              <div>\n                <div class=\"ttp-agent-name\">").concat(agentName, "</div>\n                <div class=\"ttp-agent-role\">").concat(agentRole, "</div>\n              </div>\n            </div>\n            <div class=\"ttp-header-actions\">\n              ").concat(this.infoButton(), "\n              <button type=\"button\" class=\"ttp-close-btn\" id=\"ttpCloseIdle\" aria-label=\"Close widget\">\n                <svg width=\"10\" height=\"10\" viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                  <path d=\"M10 2L2 10M2 2l8 8\"/>\n                </svg>\n              </button>\n            </div>\n          </div>\n          <div class=\"ttp-headline\">").concat(headline, "</div>\n          <div class=\"ttp-subline\">").concat(subline, "</div>\n        </div>\n\n        <div class=\"ttp-body\">\n          <button type=\"button\" class=\"ttp-btn-primary\" id=\"startCallBtn\">\n            <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"").concat(this.config.startCallButtonTextColor || 'white', "\" stroke-width=\"2\">\n              <path d=\"M12 2a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V5a3 3 0 0 1 3-3z\"/>\n              <path d=\"M19 10v2a7 7 0 0 1-14 0v-2M12 19v3M8 22h8\"/>\n            </svg>\n            ").concat(this.getText('startCallButtonText', 'startCall') || 'Start Voice Call', "\n          </button>\n          ").concat((((_this$config$behavior = this.config.behavior) === null || _this$config$behavior === void 0 ? void 0 : _this$config$behavior.mode) || 'unified') !== 'voice-only' ? "\n          <button type=\"button\" class=\"ttp-btn-secondary\" id=\"startTextBtn\">\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n              <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"/>\n            </svg>\n            ".concat(this.config.sendMessageText || this.getText('sendMessageText', 'sendMessage') || 'Send a Message', "\n          </button>\n          ") : '', "\n          ").concat((_this$config$whatsapp = this.config.whatsapp) !== null && _this$config$whatsapp !== void 0 && _this$config$whatsapp.number ? "\n          <a class=\"ttp-btn-wa\" id=\"ttpWhatsAppBtn\"\n             href=\"https://wa.me/".concat(this.config.whatsapp.number).concat(this.config.whatsapp.text ? '?text=' + encodeURIComponent(this.config.whatsapp.text) : '', "\"\n             target=\"_blank\" rel=\"noopener\">\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"#25d366\">\n              <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.655-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z\"/>\n            </svg>\n            WhatsApp\n          </a>\n          ") : '', "\n        </div>\n      </div>\n\n      <!-- Active Call View -->\n      <div id=\"voiceActiveState\" style=\"display: none;\">\n        <!-- Full voice section (hidden when items/rooms are shown) -->\n        <div class=\"desktop-voice-section\" id=\"desktopVoiceSection\">\n          <div class=\"ttp-call-hero\">\n            <div class=\"ttp-call-topbar\">\n              <div class=\"ttp-rec\">\n                <div class=\"ttp-rec-dot\"></div>\n                <span class=\"ttp-timer\" id=\"desktopTimerText\">00:00</span>\n              </div>\n              <span class=\"ttp-call-label\">Voice call active</span>\n              <div class=\"ttp-header-actions\">\n                ").concat(this.settingsButton(), "\n                ").concat(this.infoButton(), "\n                <button type=\"button\" class=\"ttp-close-btn\" id=\"ttpCloseActive\" aria-label=\"Close widget\">\n                  <svg width=\"9\" height=\"9\" viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                    <path d=\"M10 2L2 10M2 2l8 8\"/>\n                  </svg>\n                </button>\n              </div>\n            </div>\n\n            <div class=\"ttp-orb-wrap\">\n              <div class=\"ttp-orb-rings\">\n                <div class=\"ttp-ring ttp-ring-1\"></div>\n                <div class=\"ttp-ring ttp-ring-2\"></div>\n                <div class=\"ttp-orb\" id=\"desktopMainWaveform\">\n                  <div class=\"ttp-wave\" id=\"ttp-wave\"></div>\n                </div>\n              </div>\n              <div class=\"ttp-listen-label\" id=\"desktopStatusText\">").concat(this.t('listening') || 'Listening to you...', "</div>\n            </div>\n          </div>\n\n          <div class=\"ttp-controls\">\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopMuteBtn\" title=\"").concat(this.getTooltip('mute'), "\" aria-label=\"Mute microphone\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-mic-icon\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-mic-off-icon\" style=\"display: none; position: absolute;\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopPauseBtn\" title=\"Pause call\" aria-label=\"Pause call\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" class=\"desktop-pause-icon\">\n                <rect x=\"6\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                <rect x=\"14\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"none\" class=\"desktop-play-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"6,4 20,12 6,20\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-ctrl-btn\" id=\"desktopSpeakerBtn\" title=\"").concat(this.getTooltip('speaker'), "\" aria-label=\"Toggle speaker\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-speaker-icon\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-speaker-off-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"ttp-end-btn\" id=\"desktopEndCallBtn\" title=\"").concat(this.getTooltip('endCall'), "\" aria-label=\"End call\">\n              <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.99 12 19.79 19.79 0 0 1 1.97 3.4 2 2 0 0 1 3.95 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <!-- Compact voice section (shown when items/rooms are visible) -->\n        <div class=\"compact-voice-section\" id=\"compactVoiceSection\" style=\"display: none;\">\n          <div class=\"compact-left\">\n            <div class=\"compact-avatar\" id=\"desktopAvatarCompact\">\n              <div class=\"ttp-orb compact-orb\" id=\"desktopMainWaveformCompact\">\n                <div class=\"ttp-wave\"></div>\n              </div>\n            </div>\n            <div class=\"compact-info\">\n              <div class=\"compact-timer\" id=\"desktopTimerCompact\">\n                <span class=\"ttp-rec-dot\"></span>\n                <span id=\"compactTimerText\">00:00</span>\n              </div>\n              <div class=\"compact-status\" id=\"desktopStatusCompact\">\n                <span id=\"compactStatusText\">").concat(this.t('listening') || 'Listening...', "</span>\n              </div>\n            </div>\n          </div>\n          <div class=\"compact-controls\">\n            ").concat(this.settingsButton('ttp-info-btn--onctrl'), "\n            ").concat(this.infoButton('ttp-info-btn--onctrl'), "\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopMuteBtnCompact\" title=\"").concat(this.getTooltip('mute'), "\" aria-label=\"Mute microphone\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-mic-icon\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-mic-off-icon\" style=\"display: none; position: absolute;\">\n                <path d=\"M12 1a3 3 0 0 1 3 3v7a3 3 0 0 1-6 0V4a3 3 0 0 1 3-3z\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopPauseBtnCompact\" title=\"Pause call\" aria-label=\"Pause call\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" class=\"desktop-pause-icon\">\n                <rect x=\"6\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                <rect x=\"14\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\" stroke=\"none\" class=\"desktop-play-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"6,4 20,12 6,20\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn secondary\" id=\"desktopSpeakerBtnCompact\" title=\"").concat(this.getTooltip('speaker'), "\" aria-label=\"Toggle speaker\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" class=\"desktop-speaker-icon\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n              </svg>\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" class=\"desktop-speaker-off-icon\" style=\"display: none; position: absolute;\">\n                <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\" stroke=\"currentColor\" stroke-width=\"1.8\" fill=\"none\"/>\n                <line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke=\"#ef4444\" stroke-width=\"1.5\" stroke-linecap=\"round\" opacity=\"0.85\"/>\n              </svg>\n            </button>\n            <button type=\"button\" class=\"compact-control-btn danger\" id=\"desktopEndCallBtnCompact\" title=\"").concat(this.getTooltip('endCall'), "\" aria-label=\"End call\">\n              <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" style=\"overflow: visible;\">\n                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.99 12 19.79 19.79 0 0 1 1.97 3.4 2 2 0 0 1 3.95 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\" transform=\"rotate(135 12 12)\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <!-- Transcript -->\n        <div class=\"ttp-transcript desktop-conversation-panel\" id=\"desktopConversationPanel\" dir=\"").concat(textDir, "\">\n          <div class=\"ttp-transcript-hdr\" id=\"conversationHeader\">\n            <span class=\"ttp-live-label\">Live</span>\n            <span class=\"ttp-toggle-text\" id=\"conversationToggleText\">Show history</span>\n            <div class=\"ttp-dots\">\n              <div class=\"ttp-dot\"></div>\n              <div class=\"ttp-dot\"></div>\n              <div class=\"ttp-dot\"></div>\n            </div>\n          </div>\n          <div class=\"live-transcript-collapsed\" id=\"liveTranscriptCollapsed\">\n            <div class=\"ttp-transcript-text\" id=\"liveTextCollapsed\" dir=\"").concat(transcriptDir, "\">\n              ").concat(this.t('transcriptWillAppear') || 'Transcript will appear here...', "<span class=\"ttp-cursor\"></span>\n            </div>\n          </div>\n          <div class=\"conversation-history\" id=\"conversationHistory\">\n            <div class=\"conversation-messages\" id=\"conversationMessages\"></div>\n            <div class=\"live-message-row\" id=\"liveMessageRow\" style=\"display: none;\">\n              <div class=\"message-bubble\" dir=\"").concat(transcriptDir, "\">\n                <span class=\"live-badge\">Live</span>\n                <span id=\"liveMessageText\"></span><span class=\"ttp-cursor\"></span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <!-- Type row -->\n        <div class=\"ttp-type-row voice-text-input-area\">\n          <input class=\"ttp-input\" type=\"text\" id=\"voiceTextInput\" dir=\"").concat(voiceInputDir, "\" placeholder=\"").concat(this.getText('inputPlaceholder', 'typeMessage') || 'Or type here…', "\" aria-label=\"Type a message\" />\n          <button type=\"button\" class=\"ttp-send-btn\" id=\"voiceSendBtn\" aria-label=\"Send message\">\n            <svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" stroke-width=\"2\">\n              <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\"/>\n              <polygon points=\"22 2 15 22 11 13 2 9 22 2\"/>\n            </svg>\n          </button>\n        </div>\n      </div>\n    </div>");
     }
 
     /**
@@ -41325,7 +42599,7 @@ var Templates = /*#__PURE__*/function () {
       var headerAvatarUrl = resolveIdleHeaderAvatarUrl(this.config);
       var mobileAvatarInner = headerAvatarUrl ? "<img src=\"".concat(escapeHtmlAttr(headerAvatarUrl), "\" alt=\"\" class=\"voice-avatar-img\" />") : '🤖';
       var mobileAvatarClass = headerAvatarUrl ? 'voice-avatar voice-avatar--image' : 'voice-avatar';
-      return "<div class=\"voice-interface mobile-voice-interface\" id=\"voiceInterface\" dir=\"".concat(textDir, "\">\n      <!-- Before Call State (same as desktop) -->\n      <div id=\"voiceIdleState\">\n        ").concat(this.infoButton('ttp-info-btn--floating'), "\n        <div class=\"").concat(mobileAvatarClass, "\" id=\"voiceAvatar\">").concat(mobileAvatarInner, "</div>\n        <div class=\"voice-status\">\n          <div class=\"voice-status-title\">").concat(this.getText('startCallTitle', 'clickToStartCall'), "</div>\n          <div class=\"voice-status-subtitle\">").concat(this.getText('startCallSubtitle', 'realTimeVoice'), "</div>\n        </div>\n        <button type=\"button\" class=\"start-call-btn\" id=\"startCallBtn\">\n          <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path d=\"M20.01 15.38c-1.23 0-2.42-.2-3.53-.56-.35-.12-.74-.03-1.01.24l-1.57 1.97c-2.83-1.35-5.48-3.9-6.89-6.83l1.95-1.66c.27-.28.35-.67.24-1.02-.37-1.11-.56-2.3-.56-3.53 0-.54-.45-.99-.99-.99H4.19C3.65 3 3 3.24 3 3.99 3 13.28 10.73 21 20.01 21c.71 0 .99-.63.99-1.18v-3.45c0-.54-.45-.99-.99-.99z\"/>\n          </svg>\n          <span>").concat(this.getText('startCallButtonText', 'startCall'), "</span>\n        </button>\n      </div>\n      \n      <!-- Mobile Active Call State - Hidden placeholder (actual bar will be appended to body) -->\n      <div id=\"voiceActiveState\" class=\"mobile-active-state\" style=\"display: none;\">\n        <!-- Duration Badge -->\n        <div class=\"mobile-duration-badge\" id=\"mobileDurationBadge\">\n          <div class=\"mobile-duration-dot\"></div>\n          <span id=\"mobileDurationText\">00:00</span>\n          ").concat(this.infoButton('ttp-info-btn--onbadge'), "\n        </div>\n\n        <!-- Main Bar -->\n        <div class=\"mobile-voice-bar\">\n          <!-- Top Row: Status, Waveform, Controls -->\n          <div class=\"mobile-top-row\">\n            <!-- Status Indicator -->\n            <div class=\"mobile-status-indicator\">\n              <div class=\"mobile-status-dot\" id=\"mobileStatusDot\"></div>\n              <span class=\"mobile-status-text\" id=\"mobileStatusText\">Listening...</span>\n            </div>\n            \n            <!-- Centered Waveform -->\n            <div class=\"mobile-waveform-center\" id=\"mobileWaveform\">\n              ").concat(Array(7).fill(0).map(function (_, i) {
+      return "<div class=\"voice-interface mobile-voice-interface\" id=\"voiceInterface\" dir=\"".concat(textDir, "\">\n      <!-- Before Call State (same as desktop) -->\n      <div id=\"voiceIdleState\">\n        ").concat(this.infoButton('ttp-info-btn--floating'), "\n        <div class=\"").concat(mobileAvatarClass, "\" id=\"voiceAvatar\">").concat(mobileAvatarInner, "</div>\n        <div class=\"voice-status\">\n          <div class=\"voice-status-title\">").concat(this.getText('startCallTitle', 'clickToStartCall'), "</div>\n          <div class=\"voice-status-subtitle\">").concat(this.getText('startCallSubtitle', 'realTimeVoice'), "</div>\n        </div>\n        <button type=\"button\" class=\"start-call-btn\" id=\"startCallBtn\">\n          <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path d=\"M20.01 15.38c-1.23 0-2.42-.2-3.53-.56-.35-.12-.74-.03-1.01.24l-1.57 1.97c-2.83-1.35-5.48-3.9-6.89-6.83l1.95-1.66c.27-.28.35-.67.24-1.02-.37-1.11-.56-2.3-.56-3.53 0-.54-.45-.99-.99-.99H4.19C3.65 3 3 3.24 3 3.99 3 13.28 10.73 21 20.01 21c.71 0 .99-.63.99-1.18v-3.45c0-.54-.45-.99-.99-.99z\"/>\n          </svg>\n          <span>").concat(this.getText('startCallButtonText', 'startCall'), "</span>\n        </button>\n      </div>\n      \n      <!-- Mobile Active Call State - Hidden placeholder (actual bar will be appended to body) -->\n      <div id=\"voiceActiveState\" class=\"mobile-active-state\" style=\"display: none;\">\n        <!-- Duration Badge -->\n        <div class=\"mobile-duration-badge\" id=\"mobileDurationBadge\">\n          <div class=\"mobile-duration-dot\"></div>\n          <span id=\"mobileDurationText\">00:00</span>\n          ").concat(this.settingsButton('ttp-info-btn--onbadge'), "\n          ").concat(this.infoButton('ttp-info-btn--onbadge'), "\n        </div>\n\n        <!-- Main Bar -->\n        <div class=\"mobile-voice-bar\">\n          <!-- Top Row: Status, Waveform, Controls -->\n          <div class=\"mobile-top-row\">\n            <!-- Status Indicator -->\n            <div class=\"mobile-status-indicator\">\n              <div class=\"mobile-status-dot\" id=\"mobileStatusDot\"></div>\n              <span class=\"mobile-status-text\" id=\"mobileStatusText\">Listening...</span>\n            </div>\n            \n            <!-- Centered Waveform -->\n            <div class=\"mobile-waveform-center\" id=\"mobileWaveform\">\n              ").concat(Array(7).fill(0).map(function (_, i) {
         return "<div class=\"mobile-waveform-bar\" data-index=\"".concat(i, "\"></div>");
       }).join(''), "\n            </div>\n            \n            <!-- Controls -->\n            <div class=\"mobile-controls\">\n              <button type=\"button\" class=\"mobile-control-btn\" id=\"mobileMuteBtn\" aria-label=\"Mute microphone\">\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"mobile-mic-icon\">\n                  <path d=\"M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z\"/>\n                  <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n                  <line x1=\"12\" x2=\"12\" y1=\"19\" y2=\"22\"/>\n                </svg>\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"mobile-mic-off-icon\" style=\"display: none;\">\n                  <path d=\"M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z\"/>\n                  <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"/>\n                  <line x1=\"12\" x2=\"12\" y1=\"19\" y2=\"22\"/>\n                  <line x1=\"4\" y1=\"4\" x2=\"20\" y2=\"20\" stroke=\"#ef4444\" stroke-width=\"1.5\" opacity=\"0.85\"/>\n                </svg>\n              </button>\n              \n              <button type=\"button\" class=\"mobile-control-btn\" id=\"mobilePauseBtn\" aria-label=\"Pause call\">\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" class=\"mobile-pause-icon\">\n                  <rect x=\"6\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                  <rect x=\"14\" y=\"4\" width=\"4\" height=\"16\" rx=\"1\"/>\n                </svg>\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"#fff\" stroke=\"none\" class=\"mobile-play-icon\" style=\"display: none;\">\n                  <polygon points=\"6,4 20,12 6,20\"/>\n                </svg>\n              </button>\n\n              <button type=\"button\" class=\"mobile-control-btn\" id=\"mobileSpeakerBtn\" aria-label=\"Toggle speaker\">\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"mobile-speaker-icon\">\n                  <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                  <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n                </svg>\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"mobile-speaker-off-icon\" style=\"display: none;\">\n                  <polygon points=\"11 5 6 9 2 9 2 15 6 15 11 19 11 5\"/>\n                  <path d=\"M15.54 8.46a5 5 0 0 1 0 7.07\"/>\n                  <line x1=\"4\" y1=\"4\" x2=\"20\" y2=\"20\" stroke=\"#ef4444\" stroke-width=\"1.5\" opacity=\"0.85\"/>\n                </svg>\n              </button>\n\n              <button type=\"button\" class=\"mobile-end-call-btn\" id=\"mobileEndCallBtn\" aria-label=\"End call\">\n                <svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                  <path d=\"M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91\"/>\n                  <line x1=\"22\" x2=\"2\" y1=\"2\" y2=\"22\"/>\n                </svg>\n              </button>\n            </div>\n          </div>\n          \n          <!-- Bottom Row: Transcript (expandable) -->\n          <button type=\"button\" class=\"mobile-transcript-row\" id=\"mobileTranscriptRow\">\n            <p class=\"mobile-transcript-text\" id=\"mobileTranscriptText\" dir=\"").concat(transcriptDir, "\">").concat(this.t('transcriptWillAppear'), "</p>\n            <div class=\"mobile-transcript-footer\">\n              <span class=\"mobile-expand-hint\">tap to expand & type</span>\n              <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"opacity: 0.6;\">\n                <path d=\"M7 17L17 7M17 7H7M17 7V17\"/>\n              </svg>\n            </div>\n          </button>\n        </div>\n      </div>\n      \n      <!-- Expanded Transcript Overlay -->\n      <div class=\"mobile-transcript-overlay\" id=\"mobileTranscriptOverlay\">\n        <div class=\"mobile-expanded-transcript\" id=\"mobileExpandedTranscript\">\n          <!-- Header -->\n          <div class=\"mobile-transcript-header\">\n            <div class=\"mobile-header-left\">\n              <div class=\"mobile-header-status\">\n                <div class=\"mobile-header-status-dot\"></div>\n                <span class=\"mobile-header-status-text\" id=\"mobileHeaderStatusText\">Listening...</span>\n                <span class=\"mobile-header-duration\" id=\"mobileHeaderDuration\">00:00</span>\n              </div>\n              <span class=\"mobile-transcript-label\">CONVERSATION</span>\n            </div>\n            <button type=\"button\" class=\"mobile-close-transcript-btn\" id=\"mobileCloseTranscriptBtn\">\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                <path d=\"M18 6L6 18M6 6l12 12\"/>\n              </svg>\n            </button>\n          </div>\n          \n          <!-- Messages Container -->\n          <div class=\"mobile-messages-container\" id=\"mobileMessagesContainer\">\n            <!-- Messages will be dynamically added here -->\n          </div>\n          \n          <!-- Text Input Area -->\n          <div class=\"mobile-input-area\">\n            <div class=\"mobile-input-wrapper\">\n              <input\n                type=\"text\"\n                placeholder=\"Type a message...\"\n                id=\"mobileTextInput\"\n                class=\"mobile-text-input\"\n                dir=\"").concat(voiceInputDir, "\"\n              />\n              <button type=\"button\" class=\"mobile-send-btn\" id=\"mobileSendBtn\" disabled>\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                  <path d=\"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z\"/>\n                </svg>\n              </button>\n            </div>\n            <p class=\"mobile-input-hint\">\uD83C\uDF99\uFE0F Voice is still active \u2022 Type or speak</p>\n          </div>\n        </div>\n      </div>\n    </div>");
     }
@@ -42174,7 +43448,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "About",
     "aboutVersion": "SDK version",
     "aboutConversationId": "Last conversation ID",
-    "aboutNoConversation": "No conversation yet"
+    "aboutNoConversation": "No conversation yet",
+    "settingsTitle": "Call settings",
+    "settingsVoiceSpeed": "Voice speed",
+    "settingsResponseLength": "Response length",
+    "lengthDetailed": "Detailed",
+    "lengthNormal": "Normal",
+    "lengthBrief": "Brief",
+    "lengthVeryBrief": "Very brief"
   },
   "he": {
     "landingTitle": "איך תרצה לתקשר?",
@@ -42211,7 +43492,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "אודות",
     "aboutVersion": "גרסת SDK",
     "aboutConversationId": "מזהה שיחה אחרון",
-    "aboutNoConversation": "אין שיחה עדיין"
+    "aboutNoConversation": "אין שיחה עדיין",
+    "settingsTitle": "הגדרות שיחה",
+    "settingsVoiceSpeed": "מהירות דיבור",
+    "settingsResponseLength": "אורך תשובות",
+    "lengthDetailed": "מפורט",
+    "lengthNormal": "רגיל",
+    "lengthBrief": "קצר",
+    "lengthVeryBrief": "קצר מאוד"
   },
   "ar": {
     "landingTitle": "كيف تريد التواصل؟",
@@ -42248,7 +43536,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "حول",
     "aboutVersion": "إصدار SDK",
     "aboutConversationId": "معرّف آخر محادثة",
-    "aboutNoConversation": "لا توجد محادثة بعد"
+    "aboutNoConversation": "لا توجد محادثة بعد",
+    "settingsTitle": "إعدادات المكالمة",
+    "settingsVoiceSpeed": "سرعة الصوت",
+    "settingsResponseLength": "طول الإجابات",
+    "lengthDetailed": "مفصّل",
+    "lengthNormal": "عادي",
+    "lengthBrief": "مختصر",
+    "lengthVeryBrief": "مختصر جداً"
   },
   "ru": {
     "landingTitle": "Как вы хотите общаться?",
@@ -42285,7 +43580,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "О приложении",
     "aboutVersion": "Версия SDK",
     "aboutConversationId": "ID последнего разговора",
-    "aboutNoConversation": "Разговоров пока нет"
+    "aboutNoConversation": "Разговоров пока нет",
+    "settingsTitle": "Настройки звонка",
+    "settingsVoiceSpeed": "Скорость речи",
+    "settingsResponseLength": "Длина ответов",
+    "lengthDetailed": "Подробно",
+    "lengthNormal": "Обычно",
+    "lengthBrief": "Кратко",
+    "lengthVeryBrief": "Очень кратко"
   },
   "es": {
     "landingTitle": "¿Cómo te gustaría comunicarte?",
@@ -42322,7 +43624,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "Acerca de",
     "aboutVersion": "Versión del SDK",
     "aboutConversationId": "ID de última conversación",
-    "aboutNoConversation": "Aún no hay conversación"
+    "aboutNoConversation": "Aún no hay conversación",
+    "settingsTitle": "Ajustes de llamada",
+    "settingsVoiceSpeed": "Velocidad de voz",
+    "settingsResponseLength": "Longitud de respuesta",
+    "lengthDetailed": "Detallada",
+    "lengthNormal": "Normal",
+    "lengthBrief": "Breve",
+    "lengthVeryBrief": "Muy breve"
   },
   "fr": {
     "landingTitle": "Comment souhaitez-vous communiquer?",
@@ -42359,7 +43668,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "À propos",
     "aboutVersion": "Version du SDK",
     "aboutConversationId": "ID de la dernière conversation",
-    "aboutNoConversation": "Aucune conversation pour l'instant"
+    "aboutNoConversation": "Aucune conversation pour l'instant",
+    "settingsTitle": "Paramètres d'appel",
+    "settingsVoiceSpeed": "Vitesse de la voix",
+    "settingsResponseLength": "Longueur des réponses",
+    "lengthDetailed": "Détaillée",
+    "lengthNormal": "Normale",
+    "lengthBrief": "Brève",
+    "lengthVeryBrief": "Très brève"
   },
   "de": {
     "landingTitle": "Wie möchten Sie kommunizieren?",
@@ -42396,7 +43712,14 @@ __webpack_require__.r(__webpack_exports__);
     "aboutTitle": "Über",
     "aboutVersion": "SDK-Version",
     "aboutConversationId": "Letzte Konversations-ID",
-    "aboutNoConversation": "Noch keine Konversation"
+    "aboutNoConversation": "Noch keine Konversation",
+    "settingsTitle": "Anrufeinstellungen",
+    "settingsVoiceSpeed": "Sprechgeschwindigkeit",
+    "settingsResponseLength": "Antwortlänge",
+    "lengthDetailed": "Ausführlich",
+    "lengthNormal": "Normal",
+    "lengthBrief": "Kurz",
+    "lengthVeryBrief": "Sehr kurz"
   }
 });