@rndev77/suzu-ai 0.1.0

package/src/bind-panel.js

@@ -0,0 +1,1500 @@
+/* Bound production panel — single instance, same IDs as SUZU landing */
+export function bindSuzuPanel() {
+    (function () {
+        var dock = document.getElementById("suzu-dock");
+        var panel = document.getElementById("suzu-panel");
+        var thread = document.getElementById("suzu-panel-thread");
+        var empty = document.getElementById("suzu-panel-empty");
+        var wrap = document.querySelector(".page-wrapper");
+        var handle = panel && panel.querySelector(".suzu-panel__resize");
+        var dockForm = document.getElementById("suzu-dock-form");
+        var panelForm = document.getElementById("suzu-panel-form");
+        var heroForm = document.getElementById("suzu-hero-glow");
+        if (!panel || !thread) return;
+
+        var dockInput = dockForm && dockForm.querySelector("input");
+        var panelInput = panelForm && panelForm.querySelector("input");
+        var heroInput = heroForm && heroForm.querySelector("input");
+        /* iOS Safari: disable sentence-case autocapitalize on chat fields. */
+        [dockInput, panelInput, heroInput].forEach(function (el) {
+            if (!el) return;
+            el.setAttribute("autocapitalize", "none");
+            el.setAttribute("autocorrect", "off");
+            el.setAttribute("autocomplete", "off");
+            el.setAttribute("spellcheck", "false");
+            el.autocapitalize = "none";
+        });
+
+        var assistW = 340;
+        var chatsW = 220;
+        var resizing = false;
+        var resizeStartX = 0;
+        var resizeStartW = 340;
+        var draft = "";
+
+        function isDesktop() {
+            return window.matchMedia("(min-width: 1200px)").matches;
+        }
+        function sheetWidth() {
+            var extra = panel.classList.contains("is-chats") && isDesktop() ? chatsW : 0;
+            var vw = window.innerWidth || 1200;
+            var cap = Math.floor(vw * 0.72);
+            var a = Math.max(300, Math.min(assistW, cap - extra));
+            return a + extra;
+        }
+        function clearDockScale() {
+            if (!wrap) return;
+            wrap.style.removeProperty("transform");
+            wrap.style.removeProperty("transform-origin");
+            wrap.style.removeProperty("margin-left");
+            wrap.style.removeProperty("width");
+            wrap.style.removeProperty("transition");
+            document.documentElement.style.removeProperty("overflow-x");
+            document.documentElement.style.removeProperty("--suzu-dock-w");
+        }
+        var sheetEl = panel.querySelector(".suzu-panel__sheet");
+        var chatsEl = panel.querySelector(".suzu-panel__chats");
+        var chatsDimEl = panel.querySelector(".suzu-panel__chats-dim");
+        function resetSheetBox() {
+            if (!sheetEl) return;
+            sheetEl.style.removeProperty("height");
+            sheetEl.style.removeProperty("max-height");
+            sheetEl.style.removeProperty("bottom");
+            if (chatsEl) {
+                chatsEl.style.removeProperty("height");
+                chatsEl.style.removeProperty("max-height");
+                chatsEl.style.removeProperty("bottom");
+                chatsEl.style.removeProperty("left");
+            }
+            if (chatsDimEl) {
+                chatsDimEl.style.removeProperty("height");
+                chatsDimEl.style.removeProperty("max-height");
+                chatsDimEl.style.removeProperty("bottom");
+                chatsDimEl.style.removeProperty("left");
+                chatsDimEl.style.removeProperty("right");
+                chatsDimEl.style.removeProperty("width");
+                chatsDimEl.style.removeProperty("top");
+            }
+        }
+        function fitSheetToViewport() {
+            if (!sheetEl || isDesktop() || !panel.classList.contains("is-open")) {
+                resetSheetBox();
+                return;
+            }
+            var vv = window.visualViewport;
+            var visH = vv ? vv.height : (window.innerHeight || 0);
+            var visBottom = vv ? (vv.offsetTop + vv.height) : visH;
+            var layoutH = window.innerHeight || visH;
+            var gapTop = 8;
+            var gapBottom = Math.max(8, layoutH - visBottom + 8);
+            var height = Math.max(280, Math.round(visH - gapTop - 8));
+            var bottomPx = gapBottom + "px";
+            var heightPx = height + "px";
+            sheetEl.style.bottom = bottomPx;
+            sheetEl.style.height = heightPx;
+            sheetEl.style.maxHeight = heightPx;
+            /* Keep chats drawer + dim locked to the sheet box (Safari keyboard / vv). */
+            if (chatsEl) {
+                chatsEl.style.bottom = bottomPx;
+                chatsEl.style.height = heightPx;
+                chatsEl.style.maxHeight = heightPx;
+                chatsEl.style.left = "8px";
+            }
+            if (chatsDimEl) {
+                chatsDimEl.style.left = "8px";
+                chatsDimEl.style.right = "8px";
+                chatsDimEl.style.top = "auto";
+                chatsDimEl.style.bottom = bottomPx;
+                chatsDimEl.style.height = heightPx;
+                chatsDimEl.style.maxHeight = heightPx;
+                chatsDimEl.style.width = "auto";
+            }
+            /* Keyboard resize shrinks thread — re-stick like Gemini if still following. */
+            keepPinnedAfterLayout();
+        }
+        function focusPanelInput() {
+            if (!panelInput) return;
+            var sx = window.scrollX || 0;
+            var sy = window.scrollY || 0;
+            try { panelInput.focus({ preventScroll: true }); }
+            catch (err) { panelInput.focus(); }
+            try { window.scrollTo(sx, sy); } catch (err2) {}
+            var len = panelInput.value.length;
+            try { panelInput.setSelectionRange(len, len); } catch (err3) {}
+            fitSheetToViewport();
+            keepPinnedAfterLayout();
+        }
+        function applyDockScale() {
+            var extra = panel.classList.contains("is-chats") && isDesktop() ? chatsW : 0;
+            var vw = window.innerWidth || 1200;
+            var cap = Math.floor(vw * 0.72);
+            var a = Math.max(300, Math.min(assistW, cap - extra));
+            var w = a + extra;
+            panel.style.setProperty("--suzu-sheet-w", a + "px");
+            panel.style.setProperty("--suzu-chats-w", chatsW + "px");
+            if (!wrap) return;
+            if (!panel.classList.contains("is-open") || !isDesktop()) {
+                clearDockScale();
+                return;
+            }
+            document.documentElement.style.setProperty("overflow-x", "hidden");
+            document.documentElement.style.setProperty("--suzu-dock-w", w + "px");
+            wrap.style.setProperty(
+                "transition",
+                resizing ? "none" : "margin-left 0.34s cubic-bezier(0.32, 0.72, 0, 1), width 0.34s cubic-bezier(0.32, 0.72, 0, 1)"
+            );
+            wrap.style.setProperty("margin-left", w + "px");
+            wrap.style.setProperty("width", "calc(100% - " + w + "px)");
+        }
+
+        function showDock() {
+            if (!dock || panel.classList.contains("is-open")) return;
+            dock.classList.add("is-on");
+            dock.setAttribute("aria-hidden", "false");
+        }
+        function hideDock() {
+            if (!dock) return;
+            dock.classList.remove("is-on");
+            dock.setAttribute("aria-hidden", "true");
+        }
+        var heroInView = true;
+        function syncDock() {
+            if (panel.classList.contains("is-open") || document.body.classList.contains("suzu-sheet-open")) {
+                hideDock();
+                return;
+            }
+            if (heroInView) hideDock();
+            else showDock();
+        }
+        if (heroForm && "IntersectionObserver" in window) {
+            var io = new IntersectionObserver(function (entries) {
+                var entry = entries[0];
+                heroInView = !!(entry && entry.isIntersecting);
+                syncDock();
+            }, { threshold: 0, rootMargin: "0px 0px -48px 0px" });
+            io.observe(heroForm);
+        } else {
+            window.addEventListener("scroll", function () {
+                if (!heroForm) {
+                    heroInView = window.scrollY < 80;
+                } else {
+                    var r = heroForm.getBoundingClientRect();
+                    heroInView = r.bottom > 48 && r.top < window.innerHeight;
+                }
+                syncDock();
+            }, { passive: true });
+            syncDock();
+        }
+
+        var pills = document.getElementById("suzu-panel-pills");
+        var suggest = document.getElementById("suzu-panel-suggest");
+        var chatList = document.getElementById("suzu-panel-chat-list");
+        var productBox = document.getElementById("suzu-product");
+        var starters = [
+            { title: "Подарок с доставкой", prompt: "Нужен подарок коллеге, доставка сегодня" },
+            { title: "Кроссовки для прогулок", prompt: "Кроссовки для долгих прогулок, размер 42" },
+            { title: "Ремонт ноутбука рядом", prompt: "Ремонт ноутбука рядом, не включается" }
+        ];
+        var STREAM_KEY = "suzu_chat_sessions";
+        var streamEl = null;
+        var ribbonEl = null;
+        var typingEl = null;
+        var searchEl = null;
+        var lastSearchLabel = "";
+        var awaitingResults = false;
+        var lastQuery = "";
+        var hasMore = false;
+        var moreBtnEl = null;
+        var moreAppending = false;
+        var ribbonLoaderEl = null;
+        var pendingMoreMeta = null;
+
+        function hideEmpty() {
+            if (!empty) return;
+            empty.setAttribute("hidden", "");
+            empty.style.display = "none";
+            if (empty.parentNode) empty.parentNode.removeChild(empty);
+        }
+        function clearThreadLive() {
+            if (!thread) return;
+            Array.prototype.slice.call(thread.children).forEach(function (el) {
+                if (el.id !== "suzu-panel-empty") el.remove();
+            });
+            streamEl = null;
+            ribbonEl = null;
+            typingEl = null;
+            searchEl = null;
+            lastSearchLabel = "";
+            awaitingResults = false;
+            hasMore = false;
+            moreAppending = false;
+            moreBtnEl = null;
+            ribbonLoaderEl = null;
+            pendingMoreMeta = null;
+            turnAnchorEl = null;
+            threadPad = null;
+            followTurn = true;
+            if (pills) {
+                pills.innerHTML = "";
+                pills.hidden = true;
+            }
+        }
+        function showEmpty() {
+            clearThreadLive();
+            if (empty && thread) {
+                empty.removeAttribute("hidden");
+                empty.style.display = "";
+                thread.insertBefore(empty, thread.firstChild);
+            }
+        }
+        /* Gemini: last user message pins to the top; answer grows under it. */
+        var turnAnchorEl = null;
+        var followTurn = false;
+        var threadPad = null;
+        var pinRaf = 0;
+        var pinUserScroll = false;
+        var pinScrollTop = 0;
+        function getThreadPad() {
+            if (threadPad && threadPad.parentNode === thread) return threadPad;
+            threadPad = document.createElement("div");
+            threadPad.className = "suzu-panel__thread-pad";
+            threadPad.setAttribute("aria-hidden", "true");
+            thread.appendChild(threadPad);
+            return threadPad;
+        }
+        function appendToThread(el) {
+            if (!thread || !el) return;
+            var pad = getThreadPad();
+            thread.insertBefore(el, pad);
+            if (pad.parentNode !== thread) thread.appendChild(pad);
+        }
+        function yInThread(el) {
+            if (!thread || !el) return 0;
+            return el.getBoundingClientRect().top - thread.getBoundingClientRect().top + thread.scrollTop;
+        }
+        function sizeThreadPad() {
+            if (!thread) return;
+            var pad = getThreadPad();
+            if (!followTurn || !turnAnchorEl || !turnAnchorEl.parentNode) {
+                if (pad.style.height !== "0px") pad.style.height = "0px";
+                return;
+            }
+            var last = lastTurnBlock() || turnAnchorEl;
+            var fromAnchor = last.getBoundingClientRect().bottom - turnAnchorEl.getBoundingClientRect().top;
+            var needed = Math.max(0, Math.round(thread.clientHeight - fromAnchor - 12));
+            var prev = parseInt(pad.style.height, 10) || 0;
+            if (Math.abs(needed - prev) < 3) return;
+            pad.style.height = needed + "px";
+        }
+        var scrollAnim = 0;
+        var reducedMotion = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+        function scrollThreadOnly(y, smooth) {
+            if (!thread) return;
+            y = Math.max(0, y);
+            if (scrollAnim) {
+                cancelAnimationFrame(scrollAnim);
+                scrollAnim = 0;
+            }
+            var from = thread.scrollTop;
+            var dist = Math.abs(y - from);
+            if (!smooth || reducedMotion || dist < 1.5) {
+                thread.scrollTop = y;
+                return;
+            }
+            /* Gemini-like: longer ease-out, soft landing. */
+            var dur = Math.min(920, Math.max(520, 380 + dist * 0.72));
+            var start = performance.now();
+            pinUserScroll = true;
+            function step(now) {
+                var t = Math.min(1, (now - start) / dur);
+                /* easeOutQuint — soft deceleration like Gemini */
+                var ease = 1 - Math.pow(1 - t, 5);
+                thread.scrollTop = from + (y - from) * ease;
+                if (t < 1) {
+                    scrollAnim = requestAnimationFrame(step);
+                } else {
+                    scrollAnim = 0;
+                    thread.scrollTop = y;
+                    pinUserScroll = false;
+                }
+            }
+            scrollAnim = requestAnimationFrame(step);
+        }
+        function pinTurnToTop(behavior) {
+            if (!thread || !turnAnchorEl || !turnAnchorEl.parentNode || !followTurn) return;
+            sizeThreadPad();
+            var y = Math.max(0, yInThread(turnAnchorEl) - 8);
+            pinScrollTop = y;
+            if (behavior === "smooth") {
+                requestAnimationFrame(function () {
+                    if (!followTurn || !turnAnchorEl || !turnAnchorEl.parentNode) return;
+                    sizeThreadPad();
+                    y = Math.max(0, yInThread(turnAnchorEl) - 8);
+                    pinScrollTop = y;
+                    scrollThreadOnly(y, true);
+                });
+                return;
+            }
+            var drift = Math.abs(thread.scrollTop - y);
+            if (drift < 1.5) return;
+            pinUserScroll = true;
+            thread.scrollTop = y;
+            pinScrollTop = y;
+            window.setTimeout(function () { pinUserScroll = false; }, 40);
+        }
+        /* Coalesce layout work — product streams used to reflow/scroll every card. */
+        var pinLayoutQueued = false;
+        function keepPinnedAfterLayout() {
+            if (pinLayoutQueued) return;
+            pinLayoutQueued = true;
+            requestAnimationFrame(function () {
+                pinLayoutQueued = false;
+                if (!followTurn || !turnAnchorEl) {
+                    sizeThreadPad();
+                    return;
+                }
+                sizeThreadPad();
+                var y = Math.max(0, yInThread(turnAnchorEl) - 8);
+                var drift = Math.abs(thread.scrollTop - y);
+                if (drift > 3 && drift < 64 && !scrollAnim) {
+                    pinUserScroll = true;
+                    thread.scrollTop = y;
+                    pinUserScroll = false;
+                }
+                pinScrollTop = y;
+            });
+        }
+        function releasePinFollow() {
+            followTurn = false;
+            pinLayoutQueued = false;
+            if (scrollAnim) {
+                cancelAnimationFrame(scrollAnim);
+                scrollAnim = 0;
+            }
+            if (pinRaf) {
+                cancelAnimationFrame(pinRaf);
+                pinRaf = 0;
+            }
+            pinUserScroll = false;
+            sizeThreadPad();
+        }
+        thread.addEventListener("scroll", function () {
+            if (pinUserScroll || !followTurn || !turnAnchorEl) return;
+            /* Cheap unfollow — no getBoundingClientRect on every scroll tick. */
+            if (Math.abs(thread.scrollTop - pinScrollTop) > 64) releasePinFollow();
+        }, { passive: true });
+        thread.addEventListener("wheel", function () {
+            markThreadScrollBusy();
+            releasePinFollow();
+        }, { passive: true });
+        thread.addEventListener("pointerdown", function () {
+            if (pinUserScroll || scrollAnim) releasePinFollow();
+        }, { passive: true });
+        function markThreadScrollBusy() {
+            document.documentElement.classList.add("is-scrolling");
+            window.clearTimeout(markThreadScrollBusy._t);
+            markThreadScrollBusy._t = window.setTimeout(function () {
+                document.documentElement.classList.remove("is-scrolling");
+            }, 140);
+        }
+        function lastTurnBlock() {
+            if (!thread) return null;
+            var kids = thread.children;
+            for (var i = kids.length - 1; i >= 0; i--) {
+                var el = kids[i];
+                if (el === empty || el === threadPad) continue;
+                if (el.classList && el.classList.contains("suzu-panel__thread-pad")) continue;
+                return el;
+            }
+            return null;
+        }
+        function lastThreadContent() {
+            if (!thread) return null;
+            var kids = thread.children;
+            for (var i = kids.length - 1; i >= 0; i--) {
+                var el = kids[i];
+                if (el === empty) continue;
+                if (el === threadPad) continue;
+                if (el === typingEl || el === searchEl) continue;
+                if (el.classList.contains("suzu-panel__thread-pad")) continue;
+                if (el.classList.contains("suzu-panel__search")) continue;
+                if (el.classList.contains("suzu-ui__typing")) continue;
+                return el;
+            }
+            return null;
+        }
+        function addMsg(text, who) {
+            hideEmpty();
+            var value = String(text || "");
+            /* Merge consecutive AI lines into one continuous block (Gemini-style). */
+            if (who === "ai" && value) {
+                var prev = lastThreadContent();
+                if (
+                    prev &&
+                    prev.classList.contains("suzu-panel__msg") &&
+                    prev.classList.contains("ai") &&
+                    !prev.classList.contains("suzu-ui__typing")
+                ) {
+                    var p = document.createElement("p");
+                    p.textContent = value;
+                    if (!prev.querySelector("p") && prev.childNodes.length && prev.textContent) {
+                        var wrap = document.createElement("p");
+                        wrap.textContent = prev.textContent;
+                        prev.textContent = "";
+                        prev.appendChild(wrap);
+                    }
+                    prev.appendChild(p);
+                    if (followTurn) keepPinnedAfterLayout();
+                    return prev;
+                }
+            }
+            var el = document.createElement("div");
+            el.className = "suzu-panel__msg " + who;
+            if (who === "ai" && value) {
+                var first = document.createElement("p");
+                first.textContent = value;
+                el.appendChild(first);
+            } else {
+                el.textContent = value;
+            }
+            appendToThread(el);
+            if (who === "me" && !loadingHistory) {
+                turnAnchorEl = el;
+                followTurn = true;
+                requestAnimationFrame(function () {
+                    requestAnimationFrame(function () { pinTurnToTop("smooth"); });
+                });
+            } else if (followTurn) {
+                keepPinnedAfterLayout();
+            }
+            return el;
+        }
+        function showTyping() {
+            hideEmpty();
+            if (typingEl && typingEl.parentNode) return;
+            hideTyping();
+            typingEl = document.createElement("div");
+            typingEl.className = "suzu-panel__msg ai suzu-ui__typing";
+            typingEl.innerHTML = "<i></i><i></i><i></i>";
+            appendToThread(typingEl);
+            if (followTurn) keepPinnedAfterLayout();
+        }
+        function hideTyping() {
+            if (typingEl && typingEl.parentNode) typingEl.remove();
+            typingEl = null;
+        }
+        function showSearch(label) {
+            hideEmpty();
+            hideTyping();
+            awaitingResults = true;
+            var text = String(label || lastSearchLabel || "подходящие варианты").trim();
+            if (text) lastSearchLabel = text;
+            if (searchEl && searchEl.parentNode) {
+                var cap = searchEl.querySelector(".suzu-panel__search-label");
+                if (cap) cap.textContent = lastSearchLabel;
+                /* Label-only refresh — don't re-pin (blocks PC scroll while thinking). */
+                return;
+            }
+            searchEl = document.createElement("div");
+            searchEl.className = "suzu-panel__search";
+            searchEl.setAttribute("role", "status");
+            searchEl.setAttribute("aria-live", "polite");
+            searchEl.innerHTML =
+                '<div class="suzu-panel__search-ai" aria-hidden="true">' +
+                '<span class="suzu-panel__search-ring"></span>' +
+                '<span class="suzu-panel__search-core"></span>' +
+                '</div>' +
+                '<div class="suzu-panel__search-copy">' +
+                '<span class="suzu-panel__search-title">Думаю<span class="suzu-panel__search-dots"><i></i><i></i><i></i></span></span>' +
+                '<span class="suzu-panel__search-label"></span>' +
+                '</div>';
+            searchEl.querySelector(".suzu-panel__search-label").textContent = lastSearchLabel;
+            appendToThread(searchEl);
+            if (followTurn) {
+                sizeThreadPad();
+            }
+        }
+        function hideSearch() {
+            if (searchEl && searchEl.parentNode) searchEl.remove();
+            searchEl = null;
+            awaitingResults = false;
+        }
+        function hideWaiters() {
+            hideTyping();
+            hideSearch();
+        }
+        function firstText() {
+            for (var i = 0; i < arguments.length; i++) {
+                var v = arguments[i];
+                if (v != null && String(v).trim()) return String(v).trim();
+            }
+            return "";
+        }
+        function unwrapListing(data) {
+            if (!data) return null;
+            if (data.listing && typeof data.listing === "object") return data.listing;
+            return data;
+        }
+        function listingTitle(listing) {
+            listing = unwrapListing(listing);
+            if (!listing) return "Товар";
+            return firstText(listing.title_ru, listing.title, listing.name) || "Товар";
+        }
+        function looksRu(s) {
+            return /[А-Яа-яЁё]/.test(String(s || ""));
+        }
+        function listingDesc(listing) {
+            listing = unwrapListing(listing);
+            if (!listing) return "";
+            var keys = ["selling_description_ru", "raw_description_ru", "description_ru", "normalized_description_ru"];
+            for (var i = 0; i < keys.length; i++) {
+                var t = String(listing[keys[i]] || "").trim();
+                if (t && looksRu(t)) return t;
+            }
+            return "";
+        }
+        function formatPrice(n) {
+            if (n == null || n === "") return "";
+            return String(n).replace(/\B(?=(\d{3})+(?!\d))/g, "\u00a0") + " ₽";
+        }
+        function formatWhen(iso) {
+            if (!iso) return "";
+            var ms = Date.now() - new Date(iso).getTime();
+            var min = Math.floor(ms / 60000);
+            if (min < 1) return "Только что";
+            if (min < 60) return min + " мин";
+            var hr = Math.floor(min / 60);
+            if (hr < 24) return hr + " ч";
+            var day = Math.floor(hr / 24);
+            if (day === 1) return "Вчера";
+            return day + " дн.";
+        }
+        function readSessions() {
+            try {
+                var raw = JSON.parse(localStorage.getItem(STREAM_KEY) || "[]");
+                return Array.isArray(raw) ? raw : [];
+            } catch (err) { return []; }
+        }
+        function writeSessions(list) {
+            try { localStorage.setItem(STREAM_KEY, JSON.stringify(list.slice(0, 20))); } catch (err) {}
+        }
+        function rememberSession(id, title) {
+            if (!id) return;
+            var next = readSessions().filter(function (s) { return s.id !== id; });
+            next.unshift({ id: id, title: (title || "Чат").slice(0, 60), created_at: new Date().toISOString() });
+            writeSessions(next);
+            renderChatList();
+        }
+        function renderChatList() {
+            if (!chatList) return;
+            chatList.innerHTML = "";
+            var sessions = readSessions();
+            var sid = chat && chat.sessionId();
+            if (!sessions.length) {
+                starters.forEach(function (item) {
+                    chatList.appendChild(chatButton(item.title, "", function () {
+                        sendFrom(item.prompt);
+                        if (!isDesktop()) closeChats();
+                    }, false));
+                });
+                return;
+            }
+            sessions.forEach(function (session) {
+                chatList.appendChild(chatButton(session.title || "Чат", formatWhen(session.created_at), function () {
+                    loadChat(session.id);
+                    if (!isDesktop()) closeChats();
+                }, session.id === sid));
+            });
+        }
+        function chatButton(title, time, onClick, active) {
+            var btn = document.createElement("button");
+            btn.type = "button";
+            btn.className = "suzu-ui__chat" + (active ? " is-active" : "");
+            btn.innerHTML = '<span class="suzu-ui__chat-meta"><strong></strong><small></small></span>';
+            btn.querySelector("strong").textContent = title;
+            btn.querySelector("small").textContent = time;
+            btn.addEventListener("click", onClick);
+            return btn;
+        }
+        function setPills(options) {
+            if (!pills) return;
+            pills.innerHTML = "";
+            if (!options || !options.length) {
+                pills.hidden = true;
+                return;
+            }
+            pills.hidden = false;
+            options.forEach(function (label) {
+                var btn = document.createElement("button");
+                btn.type = "button";
+                btn.textContent = label;
+                btn.addEventListener("click", function () { sendFrom(label); });
+                pills.appendChild(btn);
+            });
+        }
+        function setSuggest(options) {
+            if (!suggest) return;
+            suggest.innerHTML = "";
+            (options || []).forEach(function (label) {
+                var btn = document.createElement("button");
+                btn.type = "button";
+                btn.textContent = label;
+                btn.addEventListener("click", function () { sendFrom(label); });
+                suggest.appendChild(btn);
+            });
+        }
+        function ensureRibbon() {
+            if (ribbonEl && ribbonEl.parentNode) return ribbonEl;
+            hideEmpty();
+            var deck = document.createElement("div");
+            deck.className = "suzu-panel__deck";
+            ribbonEl = document.createElement("div");
+            ribbonEl.className = "suzu-panel__ribbon";
+            var prev = document.createElement("button");
+            prev.type = "button";
+            prev.className = "suzu-panel__deck-nav suzu-panel__deck-nav--prev";
+            prev.setAttribute("aria-label", "Предыдущая карточка");
+            prev.innerHTML = '<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 6l-6 6 6 6"/></svg>';
+            var next = document.createElement("button");
+            next.type = "button";
+            next.className = "suzu-panel__deck-nav suzu-panel__deck-nav--next";
+            next.setAttribute("aria-label", "Следующая карточка");
+            next.innerHTML = '<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 6l6 6-6 6"/></svg>';
+            deck.appendChild(prev);
+            deck.appendChild(ribbonEl);
+            deck.appendChild(next);
+            appendToThread(deck);
+            bindRibbonGestures(ribbonEl, prev, next);
+            if (followTurn) keepPinnedAfterLayout();
+            return ribbonEl;
+        }
+        function ribbonCardStep(ribbon) {
+            var card = ribbon.querySelector(".suzu-panel__card");
+            if (card) return Math.round(card.getBoundingClientRect().width + 12);
+            return Math.max(180, Math.round(ribbon.clientWidth * 0.85));
+        }
+        function bindRibbonGestures(ribbon, prev, next) {
+            var moreTimer = 0;
+            ribbon.addEventListener("scroll", function () {
+                if (moreTimer) return;
+                moreTimer = window.setTimeout(function () {
+                    moreTimer = 0;
+                    onRibbonScroll();
+                }, 120);
+            }, { passive: true });
+            ribbon.addEventListener("wheel", function (e) {
+                var absX = Math.abs(e.deltaX);
+                var absY = Math.abs(e.deltaY);
+                if (absY >= absX && absY > 0) {
+                    releasePinFollow();
+                    thread.scrollTop += e.deltaY;
+                    e.preventDefault();
+                }
+            }, { passive: false });
+
+            function step(dir) {
+                ribbon.scrollBy({ left: dir * ribbonCardStep(ribbon), behavior: "auto" });
+                if (dir > 0) onRibbonScroll();
+            }
+            prev.addEventListener("click", function (e) {
+                e.preventDefault();
+                e.stopPropagation();
+                step(-1);
+            });
+            next.addEventListener("click", function (e) {
+                e.preventDefault();
+                e.stopPropagation();
+                step(1);
+            });
+        }
+        function onRibbonScroll() {
+            if (!ribbonEl || !hasMore || moreAppending) return;
+            if (!chat || chat.busy()) return;
+            var left = ribbonEl.scrollWidth - ribbonEl.scrollLeft - ribbonEl.clientWidth;
+            if (left < 80) requestMore();
+        }
+        function showRibbonLoader() {
+            var ribbon = ensureRibbon();
+            if (ribbonLoaderEl && ribbonLoaderEl.parentNode) {
+                ribbon.appendChild(ribbonLoaderEl);
+            } else {
+                ribbonLoaderEl = document.createElement("div");
+                ribbonLoaderEl.className = "suzu-panel__ribbon-loader";
+                ribbonLoaderEl.setAttribute("role", "status");
+                ribbonLoaderEl.setAttribute("aria-label", "Загрузка");
+                ribbonLoaderEl.innerHTML = '<span class="suzu-panel__ribbon-spinner" aria-hidden="true"></span>';
+                ribbon.appendChild(ribbonLoaderEl);
+            }
+            /* Only jump to loader when user is loading more — not on first card wave. */
+            if (moreAppending) {
+                ribbon.scrollLeft = ribbon.scrollWidth;
+            }
+        }
+        function hideRibbonLoader() {
+            if (ribbonLoaderEl && ribbonLoaderEl.parentNode) ribbonLoaderEl.remove();
+            ribbonLoaderEl = null;
+        }
+        function addProduct(item) {
+            var pid = item && item.product_id;
+            if (!pid || !chat) return;
+            var card = document.createElement("article");
+            card.className = "suzu-panel__card is-loading";
+            card.setAttribute("role", "button");
+            card.tabIndex = 0;
+            card.innerHTML =
+                '<div class="suzu-panel__card-inner">' +
+                '<div class="suzu-panel__card-img" aria-hidden="true"></div>' +
+                '<div class="suzu-panel__card-copy">' +
+                '<span class="suzu-panel__card-title">Загрузка…</span>' +
+                '<div class="suzu-panel__card-meta">' +
+                '<span class="suzu-panel__card-price" hidden></span>' +
+                '<span class="suzu-panel__card-cta" aria-hidden="true">' +
+                '<svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">' +
+                '<path d="M7 17L17 7"/><path d="M9 7h8v8"/>' +
+                '</svg></span>' +
+                '</div>' +
+                '<p class="suzu-panel__card-desc">Собираю описание и детали</p>' +
+                '</div></div>';
+            ensureRibbon().appendChild(card);
+            if (ribbonLoaderEl && ribbonLoaderEl.parentNode) {
+                ensureRibbon().appendChild(ribbonLoaderEl);
+            }
+            if (followTurn) keepPinnedAfterLayout();
+
+            function bindOpen(listing) {
+                card.onclick = function () { openProduct(listing); };
+                card.onkeydown = function (e) {
+                    if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        openProduct(listing);
+                    }
+                };
+            }
+
+            function fillCard(listing, ready) {
+                listing = unwrapListing(listing);
+                card.classList.remove("is-loading");
+                if (!listing) {
+                    card.querySelector(".suzu-panel__card-title").textContent = "Товар";
+                    card.querySelector(".suzu-panel__card-desc").textContent = "Не удалось загрузить описание";
+                    return;
+                }
+                var media = card.querySelector(".suzu-panel__card-img");
+                var img = listing.images && listing.images[0];
+                var imgKey = img ? String(img.id || img.delivery_url || img.url || "") : "";
+                if (imgKey && media.getAttribute("data-img") === imgKey && media.querySelector(".suzu-panel__card-photo")) {
+                    /* already filled — skip re-fetch on stream → listing refresh */
+                } else if (img) {
+                    media.setAttribute("data-img", imgKey);
+                    chat.imageUrl(img).then(function (src) {
+                        if (!src || media.getAttribute("data-img") !== imgKey) return;
+                        if (media.querySelector(".suzu-panel__card-photo")) return;
+                        var photo = document.createElement("img");
+                        photo.className = "suzu-panel__card-photo";
+                        photo.src = src;
+                        photo.alt = listingTitle(listing);
+                        photo.decoding = "async";
+                        var ahead = 0;
+                        try {
+                            ahead = ensureRibbon().querySelectorAll(".suzu-panel__card").length;
+                        } catch (err) {}
+                        photo.loading = ahead <= 2 ? "eager" : "lazy";
+                        media.appendChild(photo);
+                    });
+                }
+                var title = listingTitle(listing);
+                card.querySelector(".suzu-panel__card-title").textContent = title;
+                card.setAttribute("aria-label", title);
+                var descEl = card.querySelector(".suzu-panel__card-desc");
+                var ruDesc = listingDesc(listing);
+                descEl.hidden = false;
+                descEl.textContent = ruDesc || (ready ? "Описание появится позже" : "Собираю описание…");
+                var priceEl = card.querySelector(".suzu-panel__card-price");
+                if (listing.price != null && listing.price !== "") {
+                    priceEl.hidden = false;
+                    priceEl.textContent = formatPrice(listing.price);
+                } else {
+                    priceEl.hidden = true;
+                }
+                bindOpen(listing);
+            }
+
+            if (item.title || item.name || item.image_url) {
+                fillCard({
+                    title_ru: item.title_ru,
+                    title: item.title || item.name || "Товар",
+                    selling_description_ru: "",
+                    raw_description_ru: "",
+                    selling_description: "",
+                    description: "",
+                    normalized_description: "",
+                    price: item.price,
+                    images: item.images || (item.image_url ? [{ id: "inline", delivery_url: item.image_url, alt_text: item.title || "" }] : []),
+                    external_base_url: item.external_base_url || item.url || ""
+                }, false);
+            }
+            chat.listing(pid).then(function (listing) {
+                listing = unwrapListing(listing);
+                if (listing) fillCard(listing, true);
+                else if (!item.title && !item.name) fillCard(null, true);
+                else card.classList.remove("is-loading");
+            });
+        }
+        function openProduct(listing) {
+            if (!productBox || !listing) return;
+            var media = productBox.querySelector(".suzu-product__media");
+            var body = productBox.querySelector(".suzu-product__body");
+            media.innerHTML = "";
+            body.innerHTML = "";
+            var img = listing.images && listing.images[0];
+            if (chat) {
+                chat.imageUrl(img).then(function (src) {
+                    if (!src) return;
+                    var photo = document.createElement("img");
+                    photo.src = src;
+                    photo.alt = listingTitle(listing);
+                    media.appendChild(photo);
+                });
+            }
+            var h = document.createElement("h3");
+            h.className = "suzu-product__title";
+            h.textContent = listingTitle(listing);
+            body.appendChild(h);
+            if (listing.price != null) {
+                var price = document.createElement("p");
+                price.className = "suzu-product__price";
+                price.textContent = formatPrice(listing.price);
+                body.appendChild(price);
+            }
+            var desc = listingDesc(listing);
+            if (desc) {
+                var p = document.createElement("p");
+                p.className = "suzu-product__desc";
+                p.textContent = desc;
+                body.appendChild(p);
+            }
+            var url = listing.external_base_url;
+            if (url && /^https?:\/\//i.test(url)) {
+                var a = document.createElement("a");
+                a.className = "suzu-product__cta";
+                a.href = url;
+                a.target = "_blank";
+                a.rel = "noopener noreferrer";
+                a.textContent = "Открыть товар";
+                body.appendChild(a);
+            }
+            productBox.hidden = false;
+        }
+        function closeProduct() {
+            if (productBox) productBox.hidden = true;
+        }
+        function cannedReply(text) {
+            addMsg(text, "me");
+            window.setTimeout(function () {
+                addMsg("Поняла запрос. Уточню детали и соберу подборку из каталога. Чтобы увидеть это на ваших товарах — обсудим пилот.", "ai");
+            }, 450);
+        }
+        function requestMore() {
+            if (!chat || !chat.ready() || chat.busy() || !chat.sessionId()) return false;
+            if (!hasMore && !pendingMoreMeta) return false;
+            pendingMoreMeta = null;
+            hasMore = false;
+            moreAppending = true;
+            hideSearch();
+            hideTyping();
+            showRibbonLoader();
+            liveSend("", true);
+            return true;
+        }
+        function placeMoreButton(meta) {
+            /* No visible button — more loads via ribbon scroll (is_more). */
+            if (moreBtnEl && moreBtnEl.parentNode) moreBtnEl.remove();
+            moreBtnEl = null;
+            var allow = meta && meta.has_more !== false;
+            hasMore = !!allow;
+            pendingMoreMeta = allow ? meta : null;
+        }
+        function flushPendingMoreButton() {
+            if (!pendingMoreMeta) return;
+            placeMoreButton(pendingMoreMeta);
+        }
+        function liveSend(text, isMore) {
+            if (!chat || chat.busy()) return;
+            if (!isMore) {
+                lastQuery = text;
+                addMsg(text, "me");
+                rememberSession(chat.sessionId(), text);
+                setPills([]);
+                ribbonEl = null;
+                streamEl = null;
+                hasMore = false;
+                moreAppending = false;
+                pendingMoreMeta = null;
+                if (moreBtnEl && moreBtnEl.parentNode) moreBtnEl.remove();
+                moreBtnEl = null;
+                showTyping();
+            }
+            chat.send(text, !!isMore);
+        }
+        function replyTo(text) {
+            if (chat && chat.ready()) liveSend(text, false);
+            else cannedReply(text);
+        }
+        function resetConversation() {
+            if (chat) chat.reset();
+            showEmpty();
+            renderChatList();
+        }
+        var loadingHistory = false;
+        function loadChat(id) {
+            if (!chat || !id) return;
+            chat.setSession(id);
+            chat.messages(id).then(function (messages) {
+                showEmpty();
+                loadingHistory = true;
+                var lastMe = null;
+                messages.forEach(function (msg) {
+                    if (msg.role === "user" && (msg.type === "message" || !msg.type)) {
+                        lastMe = addMsg(msg.content || "", "me");
+                        ribbonEl = null;
+                    } else if (msg.role === "assistant") {
+                        if ((msg.type === "message" || msg.type === "follow_up") && msg.content) {
+                            addMsg(msg.content, "ai");
+                        } else if (msg.type === "product") {
+                            addProduct(msg);
+                        } else if (msg.type === "option_pills") {
+                            setPills(msg.options || []);
+                        }
+                    }
+                });
+                loadingHistory = false;
+                if (lastMe) {
+                    turnAnchorEl = lastMe;
+                    followTurn = true;
+                    requestAnimationFrame(function () {
+                        requestAnimationFrame(function () { pinTurnToTop("auto"); });
+                    });
+                }
+                renderChatList();
+            });
+        }
+
+        var chat = window.SuzuChat ? new window.SuzuChat({
+            apiBase: panel.getAttribute("data-api-url") || "",
+            apiKey: panel.getAttribute("data-api-key") || "",
+            on: {
+                session: function (data) {
+                    rememberSession(String((data && data.session_id) || chat.sessionId()), lastQuery || (data && data.title) || "Чат");
+                },
+                text: function (data) {
+                    hideTyping();
+                    if (!streamEl) {
+                        streamEl = addMsg("", "ai");
+                        var streamP = document.createElement("p");
+                        streamEl.appendChild(streamP);
+                        streamEl._streamP = streamP;
+                    }
+                    var target = streamEl._streamP || streamEl;
+                    target.textContent += String((data && data.delta) || "");
+                    if (searchEl && searchEl.parentNode && streamEl.nextSibling !== searchEl) {
+                        appendToThread(searchEl);
+                    }
+                    if (followTurn) keepPinnedAfterLayout();
+                },
+                commit: function () {
+                    streamEl = null;
+                    if (awaitingResults && chat && chat.busy()) {
+                        showSearch(lastSearchLabel || lastQuery || "подходящие варианты");
+                    }
+                },
+                tooltip: function (data) {
+                    showSearch(String((data && data.text) || lastQuery || "Поиск…"));
+                },
+                more_mode: function (data) {
+                    /* append → keep current ribbon; products stream as wrapper/product */
+                    if (String((data && data.mode) || "") === "append") {
+                        moreAppending = true;
+                        hideTyping();
+                        hideSearch();
+                        if (!ribbonEl) ensureRibbon();
+                        showRibbonLoader();
+                    }
+                },
+                wrapper: function (data) {
+                    var type = String((data && data.type) || "");
+                    if (type === "product") {
+                        hideSearch();
+                        addProduct(data);
+                    } else if (type === "option_pills") {
+                        hideRibbonLoader();
+                        hideSearch();
+                        setPills(data.options || []);
+                    } else if (type === "follow_up" && data.content) {
+                        hideRibbonLoader();
+                        hideSearch();
+                        addMsg(data.content, "ai");
+                    } else if (type === "more_meta") {
+                        hideRibbonLoader();
+                        hideSearch();
+                        moreAppending = false;
+                        placeMoreButton(data);
+                    } else if (type === "action") {
+                        hideRibbonLoader();
+                        hideSearch();
+                        var card = document.createElement("div");
+                        card.className = "suzu-panel__action";
+                        card.textContent = data.label || data.action_type || "Действие";
+                        if (data.src || data.embed_url || data.url) {
+                            var link = document.createElement("a");
+                            link.href = data.src || data.embed_url || data.url;
+                            link.target = "_blank";
+                            link.rel = "noopener noreferrer";
+                            link.textContent = "Открыть";
+                            card.appendChild(link);
+                        }
+                        hideEmpty();
+                        appendToThread(card);
+                    }
+                },
+                location_request: function () {
+                    if (!navigator.geolocation) {
+                        chat.sendLocation(null);
+                        return;
+                    }
+                    navigator.geolocation.getCurrentPosition(
+                        function (pos) {
+                            chat.sendLocation({ lat: pos.coords.latitude, lon: pos.coords.longitude });
+                        },
+                        function () { chat.sendLocation(null); },
+                        { enableHighAccuracy: false, timeout: 10000, maximumAge: 60000 }
+                    );
+                },
+                error: function (data) {
+                    hideWaiters();
+                    addMsg(String((data && data.detail) || "Ошибка"), "ai");
+                },
+                done: function () {
+                    hideWaiters();
+                    hideRibbonLoader();
+                    moreAppending = false;
+                    flushPendingMoreButton();
+                    rememberSession(chat.sessionId(), lastQuery || "Чат");
+                    renderChatList();
+                },
+                idle: function () {
+                    hideWaiters();
+                    hideRibbonLoader();
+                    moreAppending = false;
+                    flushPendingMoreButton();
+                }
+            }
+        }) : null;
+
+        if (chat && chat.ready()) {
+            chat.welcome().then(function (data) {
+                var list = (data && data.suggestions) || [];
+                if (list.length) setSuggest(list);
+            });
+        } else {
+            setSuggest(starters.map(function (s) { return s.title; }));
+        }
+        renderChatList();
+        var newBtn = document.getElementById("suzu-panel-new");
+        if (newBtn) newBtn.addEventListener("click", function () {
+            resetConversation();
+            if (chat && chat.ready()) chat.newChat();
+        });
+        if (productBox) {
+            productBox.querySelectorAll("[data-suzu-product-close]").forEach(function (el) {
+                el.addEventListener("click", closeProduct);
+            });
+        }
+
+        function openChats() {
+            panel.classList.add("is-chats");
+            applyDockScale();
+            fitSheetToViewport();
+        }
+        function closeChats() {
+            panel.classList.remove("is-chats");
+            applyDockScale();
+            fitSheetToViewport();
+        }
+        var pageLockY = 0;
+        var pageLocked = false;
+        function panelScrollRoot(e) {
+            var path = typeof e.composedPath === "function" ? e.composedPath() : [];
+            var i;
+            for (i = 0; i < path.length; i++) {
+                var n = path[i];
+                if (!n || !n.classList) continue;
+                if (
+                    n.classList.contains("suzu-panel__thread") ||
+                    n.classList.contains("suzu-panel__ribbon") ||
+                    n.classList.contains("suzu-panel__chats") ||
+                    n.classList.contains("suzu-panel__pills") ||
+                    n.classList.contains("suzu-product") ||
+                    n.classList.contains("suzu-product__body")
+                ) {
+                    return n;
+                }
+            }
+            return null;
+        }
+        function isInsidePanel(e) {
+            var t = e.target;
+            if (t && t.nodeType === 3) t = t.parentNode;
+            return !!(panel && t && typeof panel.contains === "function" && panel.contains(t));
+        }
+        function stopPageScroll(e) {
+            if (!pageLocked) return;
+            if (isDesktop()) return;
+            if (isInsidePanel(e)) return;
+            e.preventDefault();
+        }
+        function stopPageTouch(e) {
+            if (!pageLocked) return;
+            if (isDesktop()) return;
+            if (isInsidePanel(e)) return;
+            e.preventDefault();
+        }
+        function lockPage(lock) {
+            var html = document.documentElement;
+            var body = document.body;
+            /* Desktop: landing stays visible beside the sheet — never freeze page scroll. */
+            if (lock && isDesktop()) {
+                if (pageLocked) lockPage(false);
+                return;
+            }
+            if (lock) {
+                if (pageLocked) return;
+                pageLocked = true;
+                pageLockY = window.scrollY || window.pageYOffset || 0;
+                html.classList.add("suzu-page-lock");
+                body.classList.add("suzu-page-lock");
+                body.style.top = "-" + pageLockY + "px";
+                window.addEventListener("wheel", stopPageScroll, { passive: false, capture: true });
+                window.addEventListener("touchmove", stopPageTouch, { passive: false, capture: true });
+            } else if (pageLocked) {
+                pageLocked = false;
+                html.classList.remove("suzu-page-lock");
+                body.classList.remove("suzu-page-lock");
+                body.style.top = "";
+                window.removeEventListener("wheel", stopPageScroll, true);
+                window.removeEventListener("touchmove", stopPageTouch, true);
+                try { window.scrollTo(0, pageLockY); } catch (err) {}
+            }
+        }
+        function openPanel() {
+            panel.classList.add("is-open");
+            panel.setAttribute("aria-hidden", "false");
+            document.body.classList.add("suzu-panel-open");
+            lockPage(true);
+            hideDock();
+            applyDockScale();
+            if (thread) {
+                if (empty && empty.style.display !== "none") {
+                    thread.scrollTop = 0;
+                } else if (followTurn && turnAnchorEl) {
+                    pinTurnToTop("auto");
+                }
+            }
+            fitSheetToViewport();
+            var wait = isDesktop() ? 280 : 420;
+            window.setTimeout(function () {
+                if (panelInput && draft && panelInput.value !== draft) panelInput.value = draft;
+                if (panelInput && (isDesktop() || draft)) focusPanelInput();
+                [heroInput, dockInput].forEach(function (el) {
+                    if (el) el.value = "";
+                });
+                fitSheetToViewport();
+                keepPinnedAfterLayout();
+            }, wait);
+        }
+        function closePanel() {
+            panel.classList.remove("is-open");
+            panel.classList.remove("is-chats");
+            panel.classList.remove("is-sheet-dragging");
+            panel.setAttribute("aria-hidden", "true");
+            document.body.classList.remove("suzu-panel-open");
+            lockPage(false);
+            var dimEl = panel.querySelector(".suzu-panel__dim");
+            if (sheetEl) sheetEl.style.removeProperty("--suzu-sheet-drag");
+            if (dimEl) dimEl.style.opacity = "";
+            resetSheetBox();
+            clearDockScale();
+            syncDock();
+        }
+        function clearLaunchers() {
+            [heroInput, dockInput].forEach(function (el) {
+                if (el) el.value = "";
+            });
+        }
+        function sendFrom(text) {
+            var value = (text || "").replace(/\s+/g, " ").trim();
+            if (chat && chat.busy()) return;
+            openPanel();
+            clearLaunchers();
+            draft = "";
+            if (panelInput) panelInput.value = "";
+            if (!value) return;
+            replyTo(value);
+        }
+        var handingOff = false;
+        function transferToPanel(fromInput) {
+            var text = fromInput.value;
+            draft = text;
+            handingOff = true;
+            if (panelInput) panelInput.value = text;
+            clearLaunchers();
+            openPanel();
+            window.setTimeout(function () { handingOff = false; }, 360);
+        }
+        document.addEventListener("input", function (e) {
+            var el = e.target;
+            if (!el || !el.getAttribute || el.getAttribute("data-suzu-draft") === null) return;
+            if (el === panelInput) {
+                draft = el.value;
+                return;
+            }
+            if (handingOff) {
+                if (el.value) {
+                    draft += el.value;
+                    if (panelInput) panelInput.value = draft;
+                    el.value = "";
+                }
+                return;
+            }
+            if (!el.value.length) return;
+            transferToPanel(el);
+        });
+        [dockForm, heroForm, panelForm].forEach(function (form) {
+            if (!form) return;
+            form.addEventListener("submit", function (e) {
+                e.preventDefault();
+                e.stopPropagation();
+                var input = form.querySelector("[data-suzu-draft]");
+                sendFrom(input && input.value);
+            });
+        });
+        if (dockInput) {
+            dockInput.addEventListener("focus", function () { dock.classList.add("is-focused"); });
+            dockInput.addEventListener("blur", function () {
+                setTimeout(function () { dock.classList.remove("is-focused"); }, 180);
+            });
+        }
+        document.querySelectorAll(".suzu-chips button").forEach(function (btn) {
+            btn.addEventListener("mousedown", function (e) { e.preventDefault(); });
+            btn.addEventListener("click", function (e) {
+                e.preventDefault();
+                sendFrom(btn.textContent);
+            });
+        });
+        panel.querySelectorAll("[data-suzu-panel-close]").forEach(function (el) {
+            el.addEventListener("click", closePanel);
+        });
+        panel.querySelectorAll("[data-suzu-chats-open]").forEach(function (el) {
+            el.addEventListener("click", openChats);
+        });
+        panel.querySelectorAll("[data-suzu-chats-close]").forEach(function (el) {
+            el.addEventListener("click", closeChats);
+        });
+        document.addEventListener("keydown", function (e) {
+            if (e.key !== "Escape" || !panel.classList.contains("is-open")) return;
+            if (productBox && !productBox.hidden) {
+                closeProduct();
+                return;
+            }
+            if (panel.classList.contains("is-chats")) closeChats();
+            else closePanel();
+        });
+        var layoutRaf = 0;
+        function scheduleChromeLayout() {
+            if (layoutRaf) return;
+            layoutRaf = requestAnimationFrame(function () {
+                layoutRaf = 0;
+                applyDockScale();
+                fitSheetToViewport();
+                if (panel.classList.contains("is-open")) {
+                    if (isDesktop()) lockPage(false);
+                    else lockPage(true);
+                }
+            });
+        }
+        window.addEventListener("resize", scheduleChromeLayout);
+        if (window.visualViewport) {
+            window.visualViewport.addEventListener("resize", scheduleChromeLayout);
+            window.visualViewport.addEventListener("scroll", function () {
+                if (layoutRaf) return;
+                layoutRaf = requestAnimationFrame(function () {
+                    layoutRaf = 0;
+                    fitSheetToViewport();
+                });
+            });
+        }
+        if (panelInput) {
+            panelInput.addEventListener("focus", function () {
+                window.setTimeout(function () {
+                    fitSheetToViewport();
+                    keepPinnedAfterLayout();
+                }, 50);
+                window.setTimeout(function () {
+                    fitSheetToViewport();
+                    keepPinnedAfterLayout();
+                }, 320);
+            });
+            panelInput.addEventListener("blur", function () {
+                window.setTimeout(function () {
+                    fitSheetToViewport();
+                    keepPinnedAfterLayout();
+                }, 80);
+            });
+        }
+
+        (function bindSheetSwipe() {
+            var sheetEl = panel.querySelector(".suzu-panel__sheet");
+            var dimEl = panel.querySelector(".suzu-panel__dim");
+            if (!sheetEl) return;
+            var startY = 0;
+            var startX = 0;
+            var dragY = 0;
+            var dragging = false;
+            var pendingSwipe = false;
+            var fromGrab = false;
+            var startAt = 0;
+            var didDrag = false;
+
+            function resetDrag() {
+                dragging = false;
+                pendingSwipe = false;
+                didDrag = false;
+                dragY = 0;
+                panel.classList.remove("is-sheet-dragging");
+                sheetEl.style.removeProperty("--suzu-sheet-drag");
+                if (dimEl) dimEl.style.opacity = "";
+            }
+
+            function canStart(e) {
+                if (isDesktop() || !panel.classList.contains("is-open")) return false;
+                if (e.pointerType === "mouse" && e.button !== 0) return false;
+                var t = e.target;
+                if (!(t instanceof Element)) return false;
+                if (t.closest("input, textarea, button, a, .suzu-glow, .suzu-panel__chats")) return false;
+                // Horizontal product ribbon / detail must keep native pan — never steal it.
+                if (t.closest(".suzu-panel__ribbon, .suzu-panel__card, .suzu-product, .suzu-panel__search, .suzu-panel__pills, .suzu-panel__thread")) return false;
+                if (t.closest(".suzu-panel__grab, .suzu-panel__bar")) return true;
+                return false;
+            }
+
+            sheetEl.addEventListener("pointerdown", function (e) {
+                if (!canStart(e)) return;
+                dragging = false;
+                didDrag = false;
+                fromGrab = !!e.target.closest(".suzu-panel__grab, .suzu-panel__bar");
+                startX = e.clientX;
+                startY = e.clientY;
+                dragY = 0;
+                startAt = Date.now();
+                pendingSwipe = true;
+            });
+            sheetEl.addEventListener("pointermove", function (e) {
+                if (!pendingSwipe && !dragging) return;
+                var dx = e.clientX - startX;
+                var dy = e.clientY - startY;
+                if (!dragging) {
+                    // Horizontal intent → abort (cards / accidental side swipe).
+                    if (Math.abs(dx) > 8 && Math.abs(dx) >= Math.abs(dy)) {
+                        pendingSwipe = false;
+                        return;
+                    }
+                    if (!fromGrab && dy < 0) return;
+                    if (dy < 8) return;
+                    dragging = true;
+                    pendingSwipe = false;
+                    try { sheetEl.setPointerCapture(e.pointerId); } catch (err) {}
+                }
+                dy = Math.max(0, e.clientY - startY);
+                if (dy < 6) return;
+                didDrag = true;
+                dragY = dy;
+                panel.classList.add("is-sheet-dragging");
+                sheetEl.style.setProperty("--suzu-sheet-drag", dragY + "px");
+                if (dimEl) dimEl.style.opacity = String(Math.max(0, 1 - dragY / 320));
+            });
+            function endSheetDrag() {
+                pendingSwipe = false;
+                if (!dragging && !didDrag) {
+                    dragging = false;
+                    return;
+                }
+                if (!dragging) return;
+                dragging = false;
+                panel.classList.remove("is-sheet-dragging");
+                var elapsed = Math.max(1, Date.now() - startAt);
+                var velocity = dragY / elapsed;
+                if (dragY > 96 || velocity > 0.55) {
+                    resetDrag();
+                    closePanel();
+                    return;
+                }
+                sheetEl.style.setProperty("--suzu-sheet-drag", "0px");
+                if (dimEl) dimEl.style.opacity = "";
+                dragY = 0;
+                window.setTimeout(function () {
+                    if (!panel.classList.contains("is-sheet-dragging")) {
+                        sheetEl.style.removeProperty("--suzu-sheet-drag");
+                    }
+                }, 400);
+            }
+            sheetEl.addEventListener("pointerup", endSheetDrag);
+            sheetEl.addEventListener("pointercancel", endSheetDrag);
+            sheetEl.addEventListener("click", function (e) {
+                if (!didDrag) return;
+                e.preventDefault();
+                e.stopPropagation();
+                didDrag = false;
+            }, true);
+        })();
+
+        if (handle) {
+            handle.addEventListener("wheel", function (e) {
+                if (!thread) return;
+                releasePinFollow();
+                thread.scrollTop += e.deltaY;
+                e.preventDefault();
+            }, { passive: false });
+            handle.addEventListener("pointerdown", function (e) {
+                if (!isDesktop() || !panel.classList.contains("is-open")) return;
+                resizing = true;
+                resizeStartX = e.clientX;
+                resizeStartW = assistW;
+                panel.classList.add("is-resizing");
+                document.body.style.cursor = "col-resize";
+                document.body.style.userSelect = "none";
+                try { handle.setPointerCapture(e.pointerId); } catch (err) {}
+            });
+            function endResize() {
+                if (!resizing) return;
+                resizing = false;
+                panel.classList.remove("is-resizing");
+                document.body.style.removeProperty("cursor");
+                document.body.style.removeProperty("user-select");
+                applyDockScale();
+            }
+            handle.addEventListener("pointermove", function (e) {
+                if (!resizing) return;
+                assistW = Math.max(300, Math.min(620, resizeStartW + (e.clientX - resizeStartX)));
+                applyDockScale();
+            });
+            handle.addEventListener("pointerup", endResize);
+            handle.addEventListener("pointercancel", endResize);
+        }
+        window.SuzuPanelController = {
+            open: openPanel,
+            close: closePanel,
+            send: sendFrom,
+            reset: resetConversation
+        };
+    })();
+
+}