@helpway/react 0.17.0 → 0.17.2

package/dist/index.js

@@ -55,7 +55,11 @@ function createWidgetClient(config) {
         headers() {
           return {
             "X-Public-Key": config.apiKey,
-            "X-Visitor-Id": getOrCreateVisitorId(config.apiKey)
+            "X-Visitor-Id": getOrCreateVisitorId(config.apiKey),
+            /* Only when it is not the default. A header on every web
+               request to say "web" is a byte per call to tell the server
+               what it already assumes. */
+            ...config.surface === "mobile" ? { "X-Visitor-Surface": "mobile" } : {}
           };
         },
         fetch(url, options) {
@@ -66,6 +70,17 @@ function createWidgetClient(config) {
   });
 }
 
+// ../types/src/enums.ts
+var MemberRole = {
+  Owner: "owner",
+  Admin: "admin",
+  Agent: "agent",
+  Member: "member"
+};
+
+// ../types/src/visitor.ts
+var ONLINE_WINDOW_MS = 5 * 6e4;
+
 // ../types/src/model-registry.ts
 var AI_MODELS = {
   "openai/gpt-5.5": {
@@ -373,8 +388,31 @@ var DOC_NAV_ICON_MAP = Object.fromEntries(
   DOC_NAV_ICONS.map((i) => [i.name, i])
 );
 
+// ../types/src/upload.ts
+var ALLOWED_MIME_TYPES = /* @__PURE__ */ new Set([
+  // Images — the only kind anyone has sent in volume.
+  "image/png",
+  "image/jpeg",
+  "image/gif",
+  "image/webp",
+  // Documents
+  "application/pdf",
+  // Text — inert by definition.
+  "text/plain",
+  "text/csv"
+]);
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_BASE64_LENGTH = Math.ceil(MAX_FILE_SIZE * 1.37);
+function acceptAttribute() {
+  return [...ALLOWED_MIME_TYPES].sort().join(",");
+}
+
+// ../types/src/member-roles.ts
+var MEMBER_ROLES = [MemberRole.Owner, MemberRole.Admin, MemberRole.Member];
+var ASSIGNABLE_ROLES = [MemberRole.Admin, MemberRole.Member];
+
 // ../widget-core/src/version.ts
-var SDK_VERSION = "0.17.0".length > 0 ? "0.17.0" : "dev";
+var SDK_VERSION = "0.17.2".length > 0 ? "0.17.2" : "dev";
 
 // ../widget-core/src/ws.ts
 var WebSocketManager = class {
@@ -386,7 +424,17 @@ var WebSocketManager = class {
   reconnectTimer = null;
   pingTimer = null;
   isDestroyed = false;
+  /* What the "Reconnecting…" notice needs and `isConnected` cannot say: a
+     socket that has never been open is CONNECTING, not reconnecting, and one
+     nobody has asked to connect yet is neither (connection-notice.ts). */
+  openedOnce = false;
+  firstConnectAt = null;
   visibilityHandler = null;
+  /* The retry budget is spent and nothing is scheduled. Until this existed the
+     manager simply went quiet after its tenth attempt, and the widget kept
+     saying "Reconnecting…" about a socket nobody was reconnecting. */
+  gaveUp = false;
+  onlineHandler = null;
   constructor(config) {
     this.config = config;
     this.setupVisibilityListener();
@@ -403,6 +451,15 @@ var WebSocketManager = class {
     };
     document.addEventListener("visibilitychange", this.visibilityHandler);
   }
+  /* The browser saying the network is back is the best moment to try again,
+     and after giving up it is the only automatic one. */
+  setupOnlineListener() {
+    if (typeof window === "undefined" || this.onlineHandler) return;
+    this.onlineHandler = () => {
+      if (!this.isDestroyed && !this.isConnected) this.retryNow();
+    };
+    window.addEventListener("online", this.onlineHandler);
+  }
   /** Update connection parameters (call before connect) */
   configure(params) {
     Object.assign(this.config, params);
@@ -411,6 +468,8 @@ var WebSocketManager = class {
   connect() {
     if (this.ws?.readyState === WebSocket.OPEN) return;
     this.isDestroyed = false;
+    if (this.firstConnectAt === null) this.firstConnectAt = Date.now();
+    this.setupOnlineListener();
     const protocol = this.config.apiUrl.startsWith("https") ? "wss" : "ws";
     const base = this.config.apiUrl.replace(/^https?/, protocol);
     const params = new URLSearchParams({
@@ -424,6 +483,8 @@ var WebSocketManager = class {
     const ws = new WebSocket(`${base}/ws?${params}`);
     ws.onopen = () => {
       this.reconnectAttempts = 0;
+      this.openedOnce = true;
+      this.gaveUp = false;
       if (typeof document === "undefined" || document.visibilityState === "visible") {
         this.startPing();
       }
@@ -463,6 +524,10 @@ var WebSocketManager = class {
       document.removeEventListener("visibilitychange", this.visibilityHandler);
       this.visibilityHandler = null;
     }
+    if (this.onlineHandler && typeof window !== "undefined") {
+      window.removeEventListener("online", this.onlineHandler);
+      this.onlineHandler = null;
+    }
     if (this.ws) {
       this.ws.close(1e3, "Client disconnect");
       this.ws = null;
@@ -489,9 +554,39 @@ var WebSocketManager = class {
   get isConnected() {
     return this.ws?.readyState === WebSocket.OPEN;
   }
+  /** True once the socket has been open at least once. */
+  get hasOpened() {
+    return this.openedOnce;
+  }
+  /** When `connect()` was first called (ms epoch); null before that. */
+  get connectStartedAt() {
+    return this.firstConnectAt;
+  }
+  /** True once every automatic retry has failed and none is scheduled. */
+  get hasGivenUp() {
+    return this.gaveUp;
+  }
+  /**
+   * Start over with a full retry budget: the visitor pressed "Retry", or the
+   * browser came back online. Safe to call at any time; a no-op while
+   * connected or after `disconnect()`.
+   */
+  retryNow() {
+    if (this.isDestroyed || this.isConnected) return;
+    if (this.reconnectTimer) {
+      clearTimeout(this.reconnectTimer);
+      this.reconnectTimer = null;
+    }
+    this.reconnectAttempts = 0;
+    this.gaveUp = false;
+    this.connect();
+  }
   // ── Private ──────────────────────────────────────────
   scheduleReconnect() {
-    if (this.reconnectAttempts >= this.maxReconnectAttempts) return;
+    if (this.reconnectAttempts >= this.maxReconnectAttempts) {
+      this.gaveUp = true;
+      return;
+    }
     const delay = Math.min(1e3 * 2 ** this.reconnectAttempts, 3e4);
     this.reconnectAttempts++;
     this.reconnectTimer = setTimeout(() => {
@@ -512,6 +607,100 @@ var WebSocketManager = class {
   }
 };
 
+// ../widget-core/src/dock-ink.ts
+var WHITE = [255, 255, 255];
+var NEAR_BLACK = [5, 5, 7];
+var BLACK = [0, 0, 0];
+var clamp = (n) => Math.min(255, Math.max(0, Math.round(n)));
+function fromHsl(h, s, l) {
+  const a = s * Math.min(l, 1 - l);
+  const f = (n) => {
+    const k = (n + h / 30) % 12;
+    return clamp(255 * (l - a * Math.max(-1, Math.min(k - 3, 9 - k, 1))));
+  };
+  return [f(0), f(8), f(4)];
+}
+function parseColor(input) {
+  if (!input) return null;
+  const v = input.trim().toLowerCase();
+  if (v.startsWith("#")) {
+    const short = /^#([0-9a-f])([0-9a-f])([0-9a-f])[0-9a-f]?$/.exec(v);
+    const long = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(v);
+    const [, r, g, b] = short ?? long ?? [];
+    if (r === void 0 || g === void 0 || b === void 0) return null;
+    const channel = (digits) => Number.parseInt(short ? digits + digits : digits, 16);
+    return [channel(r), channel(g), channel(b)];
+  }
+  const [, kind, body] = /^(rgb|hsl)a?\(([^)]+)\)$/.exec(v) ?? [];
+  if (kind === void 0 || body === void 0) return null;
+  const [p0, p1, p2] = body.split(/[\s,/]+/).filter(Boolean);
+  if (p0 === void 0 || p1 === void 0 || p2 === void 0) return null;
+  const n0 = Number.parseFloat(p0);
+  const n1 = Number.parseFloat(p1);
+  const n2 = Number.parseFloat(p2);
+  if (Number.isNaN(n0) || Number.isNaN(n1) || Number.isNaN(n2)) return null;
+  if (kind === "rgb") {
+    const channel = (part, n) => clamp(part.endsWith("%") ? n * 2.55 : n);
+    return [channel(p0, n0), channel(p1, n1), channel(p2, n2)];
+  }
+  return fromHsl((n0 % 360 + 360) % 360, n1 / 100, n2 / 100);
+}
+function luminance([r, g, b]) {
+  const f = (c) => {
+    const s = c / 255;
+    return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
+  };
+  return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);
+}
+function contrast(a, b) {
+  const la = luminance(a);
+  const lb = luminance(b);
+  return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
+}
+function mix(a, b, amount) {
+  const channel = (x, y) => clamp(x * amount + y * (1 - amount));
+  return [channel(a[0], b[0]), channel(a[1], b[1]), channel(a[2], b[2])];
+}
+var toHex = (c) => `#${c.map((n) => n.toString(16).padStart(2, "0")).join("")}`;
+function quiet(ink, tint, from, floor) {
+  for (let amount = from; amount < 1; amount += 0.02) {
+    const c = mix(ink, tint, amount);
+    if (contrast(c, tint) >= floor) return c;
+  }
+  return ink;
+}
+function dockInk(primaryColor) {
+  const tint = parseColor(primaryColor);
+  if (!tint) return null;
+  const onLight = contrast(WHITE, tint);
+  const useLight = onLight >= 4.5 || onLight >= contrast(NEAR_BLACK, tint);
+  const ink = useLight ? WHITE : NEAR_BLACK;
+  const shade = useLight ? BLACK : WHITE;
+  return {
+    tint: toHex(tint),
+    ink: toHex(ink),
+    shade: toHex(shade),
+    wash: toHex(contrast(ink, tint) >= 7 ? ink : shade),
+    ink2: toHex(quiet(ink, tint, 0.8, 4.5)),
+    ink3: toHex(quiet(ink, tint, 0.68, 4.5)),
+    ink4: toHex(quiet(ink, tint, 0.5, 3))
+  };
+}
+
+// ../widget-core/src/connection-notice.ts
+var RECONNECT_GRACE_MS = 2e3;
+var FIRST_CONNECT_GRACE_MS = 8e3;
+function connectionNotice(s) {
+  if (s.connected) return "none";
+  if (s.gaveUp) return "lost";
+  return showReconnecting(s) ? "reconnecting" : "none";
+}
+function showReconnecting(s) {
+  if (s.connected || s.startedAt === null) return false;
+  if (!s.hasOpened) return s.now - s.startedAt >= FIRST_CONNECT_GRACE_MS;
+  return s.downSince !== null && s.now - s.downSince >= RECONNECT_GRACE_MS;
+}
+
 // ../widget-core/src/store.ts
 import { createStore } from "zustand/vanilla";
 
@@ -544,10 +733,12 @@ var en = {
   // Composer
   "widget.placeholder": "Send a message...",
   "widget.placeholder_new": "How can we help?",
+  "widget.placeholder_resolved": "Reply to reopen this conversation\u2026",
   "widget.drop_files": "Drop files here",
   // CSAT
   "widget.csat_label": "How was your experience?",
   "widget.csat_thanks": "Thanks for your feedback!",
+  "widget.csat_error": "Couldn't save your rating. Please try again.",
   // Inline email collection (after AI reply)
   "widget.email_title": "Don't miss our reply",
   "widget.email_subtitle": "We'll email you when we respond",
@@ -560,6 +751,7 @@ var en = {
   "widget.error_desc": "Failed to load. Please try again.",
   "widget.retry": "Retry",
   "widget.reconnecting": "Reconnecting...",
+  "widget.connection_lost": "Connection lost",
   "widget.send_error": "Message not sent",
   // Date separators (today is implicit — never rendered)
   "widget.yesterday": "Yesterday",
@@ -581,6 +773,13 @@ var en = {
   // Copy
   "widget.copy": "Copy message",
   "widget.copied": "Copied",
+  /* The code-block button is its own three strings, not a reuse of the pair
+     above: that one copies a whole message and reads "Copy message", this one
+     sits inside a fenced block where the label has to stay one short word
+     (helpway#88). */
+  "widget.code_copy": "Copy",
+  "widget.code_copy_aria": "Copy code",
+  "widget.code_copy_failed": "Failed",
   // File upload
   "widget.file_too_large": "File too large (max 10 MB)",
   "widget.click_to_open": "Click to open",
@@ -859,6 +1058,7 @@ function latestAssignee(items) {
   return null;
 }
 var AI_INDICATOR_MAX_MS = 45e3;
+var TYPING_IDLE_MS = 5e3;
 function createWidgetStore() {
   const indicatorWatchdogs = /* @__PURE__ */ new Map();
   const clearWatchdog = (conversationId) => {
@@ -868,6 +1068,14 @@ function createWidgetStore() {
       indicatorWatchdogs.delete(conversationId);
     }
   };
+  const typingTimers = /* @__PURE__ */ new Map();
+  const clearTypingTimer = (conversationId) => {
+    const timer = typingTimers.get(conversationId);
+    if (timer !== void 0) {
+      clearTimeout(timer);
+      typingTimers.delete(conversationId);
+    }
+  };
   const store = createStore((set, get) => ({
     // Initial state
     isReady: false,
@@ -1027,6 +1235,7 @@ function createWidgetStore() {
       });
     },
     remapConversationId(oldId, newId) {
+      clearTypingTimer(oldId);
       if (indicatorWatchdogs.has(oldId)) {
         clearWatchdog(oldId);
         indicatorWatchdogs.set(
@@ -1044,12 +1253,12 @@ function createWidgetStore() {
         const existingItems = nextMessages.get(newId) ?? [];
         const tempRewritten = tempItems.map((m) => ({ ...m, conversationId: newId }));
         const isAgentMsg = (m) => !!m.aiAgentId && !m.visitorId && !m.userId;
-        const seen = /* @__PURE__ */ new Set();
+        const seen2 = /* @__PURE__ */ new Set();
         const merged = [];
         let keptAgentWelcome = false;
         for (const m of tempRewritten) {
-          if (seen.has(m.id)) continue;
-          seen.add(m.id);
+          if (seen2.has(m.id)) continue;
+          seen2.add(m.id);
           merged.push(m);
           if (isAgentMsg(m) && merged.length === 1) keptAgentWelcome = true;
         }
@@ -1063,7 +1272,7 @@ function createWidgetStore() {
         });
         let graftedWelcome = false;
         for (const m of existingItems) {
-          if (seen.has(m.id)) continue;
+          if (seen2.has(m.id)) continue;
           if (isVisitorMsg(m) && typeof m.text === "string" && pendingVisitor.has(m.text)) {
             const idx = pendingVisitor.get(m.text);
             pendingVisitor.delete(m.text);
@@ -1072,7 +1281,7 @@ function createWidgetStore() {
               ...m,
               _stableKey: optimistic ? optimistic._stableKey ?? optimistic.id : m.id
             };
-            seen.add(m.id);
+            seen2.add(m.id);
             continue;
           }
           const isWelcomeEcho = isAgentMsg(m) && keptAgentWelcome && !graftedWelcome && (!serverVisitorTs || m.createdAt <= serverVisitorTs);
@@ -1082,11 +1291,11 @@ function createWidgetStore() {
               ...m,
               _stableKey: seed ? seed._stableKey ?? seed.id : m.id
             };
-            seen.add(m.id);
+            seen2.add(m.id);
             graftedWelcome = true;
             continue;
           }
-          seen.add(m.id);
+          seen2.add(m.id);
           merged.push(m);
         }
         nextMessages.delete(oldId);
@@ -1233,7 +1442,11 @@ function createWidgetStore() {
     },
     // ── Content Cache ────────────────────────────────
     setContentCache(key, data) {
-      get().contentCache.set(key, { data, ts: Date.now() });
+      set((s) => {
+        const next = new Map(s.contentCache);
+        next.set(key, { data, ts: Date.now() });
+        return { contentCache: next };
+      });
     },
     // ── Realtime Event Handler ───────────────────────
     handleRealtimeEvent(event) {
@@ -1309,10 +1522,15 @@ function createWidgetStore() {
         case WsEventType.ConversationTyping: {
           if (!event.visitorId) {
             state.setTyping(event.conversationId, event.isTyping);
+            clearTypingTimer(event.conversationId);
             if (event.isTyping) {
-              setTimeout(() => {
-                state.setTyping(event.conversationId, false);
-              }, 5e3);
+              typingTimers.set(
+                event.conversationId,
+                setTimeout(() => {
+                  typingTimers.delete(event.conversationId);
+                  state.setTyping(event.conversationId, false);
+                }, TYPING_IDLE_MS)
+              );
             }
           }
           break;
@@ -1396,7 +1614,7 @@ function installCallable(methods) {
   return callable;
 }
 function createHelpwayAPI(deps) {
-  const { store, emitter, identify, apiKey } = deps;
+  const { store, emitter, identify, apiKey, apiUrl } = deps;
   return {
     open() {
       store.getState().setOpen(true);
@@ -1431,6 +1649,14 @@ function createHelpwayAPI(deps) {
       if (typeof document !== "undefined") {
         document.cookie = "hw_visitor=; Path=/; Max-Age=0";
       }
+      if (apiUrl && typeof fetch !== "undefined") {
+        void fetch(`${apiUrl.replace(/\/+$/, "")}/widget/reset-visitor`, {
+          method: "POST",
+          credentials: "include",
+          headers: { "x-public-key": apiKey }
+        }).catch(() => {
+        });
+      }
     },
     identify,
     newConversation(prefill) {
@@ -1503,6 +1729,21 @@ function applyTheme(host, theme) {
     host.style.removeProperty("--hw-window-left");
   }
   if (theme.placement) host.dataset.hwPlacement = theme.placement;
+  if (theme.dockSurface === "brand") {
+    host.dataset.hwDockSurface = "brand";
+    const ink = dockInk(theme.primaryColor);
+    if (ink) {
+      setVar(host, "--hw-dock-tint", ink.tint);
+      setVar(host, "--hw-dock-ink", ink.ink);
+      setVar(host, "--hw-dock-shade", ink.shade);
+      setVar(host, "--hw-dock-wash", ink.wash);
+      setVar(host, "--hw-dock-ink-2", ink.ink2);
+      setVar(host, "--hw-dock-ink-3", ink.ink3);
+      setVar(host, "--hw-dock-ink-4", ink.ink4);
+    }
+  } else if (theme.dockSurface === "glass") {
+    delete host.dataset.hwDockSurface;
+  }
   if (theme.colorScheme === "light" || theme.colorScheme === "dark") {
     host.dataset.theme = theme.colorScheme;
   } else if (theme.colorScheme === "system") {
@@ -1626,6 +1867,43 @@ import {
   useState
 } from "react";
 import { useStore } from "zustand";
+
+// src/map-conversation.ts
+function mapConversation(c) {
+  return {
+    id: c.id,
+    title: c.title,
+    status: c.status,
+    lastMessageText: c.lastMessageText,
+    lastMessageAt: c.lastMessageAt,
+    lastMessageSenderType: c.lastMessageSenderType,
+    lastMessageSenderName: c.lastMessageSenderName,
+    lastMessageSenderImage: c.lastMessageSenderImage,
+    /* The server's count, not a zero.
+    
+    		   This was the literal `0`, which meant `useUnread()` answered 0 on every
+    		   page load however many replies were waiting — the value described
+    		   "messages that arrived while this tab has been open", not "unread". A
+    		   badge shipped against the hook downstream never rendered once, with an
+    		   unanswered agent message on screen.
+    
+    		   Still defaulted, because a widget on an older API build gets a payload
+    		   without the field, and 0 is the honest answer there — the socket path
+    		   raises it from there as messages land. */
+    unreadCount: c.unreadCount ?? 0,
+    /* `?? null`, not left undefined: the store type says `string | null`, and
+       undefined would satisfy it structurally while meaning something else to
+       every reader downstream. */
+    assigneeName: c.assigneeName ?? null,
+    assigneeImage: c.assigneeImage ?? null,
+    /* The visitor's own answer. Without it the resolved block asked "How was
+       your experience?" again on every page load, to someone who had already
+       said, and the server then refused the second answer. */
+    csatRating: c.csatRating ?? null
+  };
+}
+
+// src/provider.tsx
 import { jsx } from "react/jsx-runtime";
 var WidgetContext = createContext(null);
 function useWidgetContext() {
@@ -1650,6 +1928,7 @@ function useWidgetClient() {
 function SupportProvider({
   apiKey,
   apiUrl,
+  surface,
   locale,
   initialConversationId,
   deepLinkToken,
@@ -1664,6 +1943,7 @@ function SupportProvider({
   const initRef = useRef(null);
   const [hasBootstrapError, setHasBootstrapError] = useState(false);
   const [wsDisconnected, setWsDisconnected] = useState(false);
+  const [wsLost, setWsLost] = useState(false);
   const [bootstrapAttempt, setBootstrapAttempt] = useState(0);
   const sourceLocaleRef = useRef(locale);
   const getSourceLocale = useCallback(() => sourceLocaleRef.current, []);
@@ -1671,7 +1951,8 @@ function SupportProvider({
     const resolvedApiUrl = apiUrl ?? inferApiUrl();
     const client2 = createWidgetClient({
       apiUrl: resolvedApiUrl,
-      apiKey
+      apiKey,
+      surface
     });
     const store2 = createWidgetStore();
     const emitter2 = new WidgetEventEmitter();
@@ -1700,7 +1981,7 @@ function SupportProvider({
         console.error("[Helpway] identify failed:", err);
       }
     };
-    const api2 = createHelpwayAPI({ store: store2, emitter: emitter2, identify: identify2, apiKey });
+    const api2 = createHelpwayAPI({ store: store2, emitter: emitter2, identify: identify2, apiKey, apiUrl: resolvedApiUrl });
     initRef.current = { client: client2, store: store2, ws: ws2, identify: identify2, api: api2, emitter: emitter2 };
   }
   const { client, store, ws, identify, api, emitter } = initRef.current;
@@ -1726,28 +2007,6 @@ function SupportProvider({
         }
         const convData = await client.widget.listConversations.query();
         if (cancelled) return;
-        const mapConversation = (c) => ({
-          id: c.id,
-          title: c.title,
-          status: c.status,
-          lastMessageText: c.lastMessageText,
-          lastMessageAt: c.lastMessageAt,
-          lastMessageSenderType: c.lastMessageSenderType,
-          lastMessageSenderName: c.lastMessageSenderName,
-          lastMessageSenderImage: c.lastMessageSenderImage,
-          /* The server's count, not a zero.
-          
-          					   This was the literal `0`, which meant `useUnread()` answered 0 on
-          					   every page load however many replies were waiting — the value
-          					   described "messages that arrived while this tab has been open",
-          					   not "unread". A badge shipped against the hook downstream never
-          					   rendered once, with an unanswered agent message on screen.
-          
-          					   Still defaulted, because a widget on an older API build gets a
-          					   payload without the field, and 0 is the honest answer there — the
-          					   socket path raises it from there as messages land. */
-          unreadCount: c.unreadCount ?? 0
-        });
         store.getState().setConversations(convData.conversations.map(mapConversation));
         if (data.website?.id && data.visitor?.id) {
           ws.configure({ websiteId: data.website.id, visitorId: data.visitor.id });
@@ -1882,16 +2141,21 @@ function SupportProvider({
         if (isViewing) scheduleMarkSeen(event.conversationId);
       }
     });
-    const DOWN_GRACE_MS = 2e3;
     let downSince = null;
     const wsCheck = setInterval(() => {
-      if (ws.isConnected) {
-        downSince = null;
-        setWsDisconnected(false);
-        return;
-      }
-      if (downSince === null) downSince = Date.now();
-      setWsDisconnected(Date.now() - downSince >= DOWN_GRACE_MS);
+      const connected = ws.isConnected;
+      if (connected) downSince = null;
+      else if (downSince === null) downSince = Date.now();
+      const notice = connectionNotice({
+        connected,
+        hasOpened: ws.hasOpened ?? false,
+        startedAt: ws.connectStartedAt ?? null,
+        downSince,
+        now: Date.now(),
+        gaveUp: ws.hasGivenUp ?? false
+      });
+      setWsDisconnected(notice === "reconnecting");
+      setWsLost(notice === "lost");
     }, 1e3);
     return () => {
       cancelled = true;
@@ -1982,6 +2246,14 @@ function SupportProvider({
     emitter,
     hasBootstrapError,
     wsDisconnected,
+    wsLost,
+    /* Answer the press on screen at once: the strip goes back to
+       "Reconnecting…" now, not at the next one-second sample. */
+    retryConnection: () => {
+      ws.retryNow?.();
+      setWsLost(false);
+      setWsDisconnected(true);
+    },
     retryBootstrap,
     getSourceLocale
   };
@@ -2083,7 +2355,7 @@ function inferApiUrl() {
 }
 
 // src/themed/default-widget.tsx
-import { createContext as createContext2, useCallback as useCallback13, useContext as useContext2, useEffect as useEffect15, useRef as useRef15, useState as useState15 } from "react";
+import { createContext as createContext2, useCallback as useCallback14, useContext as useContext2, useEffect as useEffect16, useRef as useRef17, useState as useState17 } from "react";
 
 // src/hooks/use-announcements.ts
 import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2 } from "react";
@@ -2108,22 +2380,22 @@ function getSeenSlugs(websiteId, visitorId) {
 }
 function addSeenSlug(websiteId, visitorId, slug) {
   try {
-    const seen = getSeenSlugs(websiteId, visitorId);
-    seen.add(slug);
-    localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen]));
+    const seen2 = getSeenSlugs(websiteId, visitorId);
+    seen2.add(slug);
+    localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen2]));
   } catch {
   }
 }
 function addSeenSlugs(websiteId, visitorId, slugs) {
   try {
-    const seen = getSeenSlugs(websiteId, visitorId);
-    for (const s of slugs) seen.add(s);
-    localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen]));
+    const seen2 = getSeenSlugs(websiteId, visitorId);
+    for (const s of slugs) seen2.add(s);
+    localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen2]));
   } catch {
   }
 }
-function filterUnseen(entries, seen) {
-  return entries.filter((e) => !seen.has(e.slug));
+function filterUnseen(entries, seen2) {
+  return entries.filter((e) => !seen2.has(e.slug));
 }
 var EMPTY_TABS = [];
 function useAnnouncements() {
@@ -2149,8 +2421,8 @@ function useAnnouncements() {
     function onTabDone(entries, tab) {
       allSlugs.push(...entries.map((e) => e.slug));
       if (!(isFirstVisit && !isAnonymous) && entries.length > 0) {
-        const seen = getSeenSlugs(websiteId, visitorId);
-        const unseen = filterUnseen(entries, seen);
+        const seen2 = getSeenSlugs(websiteId, visitorId);
+        const unseen = filterUnseen(entries, seen2);
         totalUnseen += unseen.length;
         const newest = unseen[0];
         if (newest && !store.getState().isOpen) {
@@ -2196,13 +2468,13 @@ function useAnnouncements() {
     (slug) => {
       if (!websiteId || !visitorId || announcementTabs.length === 0) return;
       addSeenSlug(websiteId, visitorId, slug);
-      const seen = getSeenSlugs(websiteId, visitorId);
+      const seen2 = getSeenSlugs(websiteId, visitorId);
       let total = 0;
       for (const tab of announcementTabs) {
         const cacheKey = `announcements:${tab.id}:${getLocale()}`;
         const cached = store.getState().contentCache.get(cacheKey);
         if (cached) {
-          total += filterUnseen(cached.data, seen).length;
+          total += filterUnseen(cached.data, seen2).length;
         }
       }
       store.getState().setUnseenAnnouncementCount(total);
@@ -2225,13 +2497,13 @@ function useAnnouncements() {
   }, [websiteId, visitorId, announcementTabs, store]);
   const getUnseenEntries = useCallback2(() => {
     if (announcementTabs.length === 0 || !websiteId || !visitorId) return [];
-    const seen = getSeenSlugs(websiteId, visitorId);
+    const seen2 = getSeenSlugs(websiteId, visitorId);
     const result = [];
     for (const tab of announcementTabs) {
       const cacheKey = `announcements:${tab.id}:${getLocale()}`;
       const cached = store.getState().contentCache.get(cacheKey);
       if (cached) {
-        for (const entry of filterUnseen(cached.data, seen)) {
+        for (const entry of filterUnseen(cached.data, seen2)) {
           result.push({ ...entry, tabId: tab.id });
         }
       }
@@ -2252,7 +2524,7 @@ function useAwaitingReply() {
 }
 
 // src/hooks/use-composer.ts
-import { useCallback as useCallback3, useState as useState2 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3, useState as useState2 } from "react";
 function currentPagePayload() {
   if (typeof window === "undefined") return {};
   const url = window.location.href;
@@ -2260,28 +2532,27 @@ function currentPagePayload() {
   return { page: { url, title: document.title || window.location.pathname } };
 }
 var MAX_ATTACHMENTS = 10;
-var MAX_FILE_SIZE = 10 * 1024 * 1024;
-var ACCEPTED_TYPES = [
-  "image/png",
-  "image/jpeg",
-  "image/gif",
-  "image/webp",
-  "image/svg+xml",
-  "application/pdf",
-  "text/plain",
-  "text/csv",
-  "application/zip",
-  "application/msword",
-  "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
-  "application/vnd.ms-excel",
-  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
-].join(",");
+var MAX_FILE_SIZE2 = 10 * 1024 * 1024;
+var ACCEPTED_TYPES = acceptAttribute();
 function useComposer(boundConversationId) {
   const { client, ws, store, getSourceLocale } = useWidgetContext();
   const conversationId = boundConversationId;
   const [text, setText] = useState2("");
   const [isSubmitting, setIsSubmitting] = useState2(false);
   const [attachments, setAttachments] = useState2([]);
+  const liveUrls = useRef3(/* @__PURE__ */ new Set());
+  useEffect3(() => {
+    const urls = liveUrls.current;
+    return () => {
+      for (const url of urls) URL.revokeObjectURL(url);
+      urls.clear();
+    };
+  }, []);
+  const revoke = useCallback3((url) => {
+    if (!url) return;
+    URL.revokeObjectURL(url);
+    liveUrls.current.delete(url);
+  }, []);
   const [sendError, setSendError] = useState2(null);
   const [emailGateConvId, setEmailGateConvId] = useState2(null);
   const addFiles = useCallback3(
@@ -2290,10 +2561,15 @@ function useComposer(boundConversationId) {
       const remaining = MAX_ATTACHMENTS - attachments.length;
       const toAdd = files.slice(0, remaining);
       if (toAdd.length === 0) return;
+      const makePreviewUrl = (file) => {
+        const url = URL.createObjectURL(file);
+        liveUrls.current.add(url);
+        return url;
+      };
       const pending = toAdd.map((file) => ({
         id: `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
         file,
-        previewUrl: file.type.startsWith("image/") ? URL.createObjectURL(file) : null,
+        previewUrl: file.type.startsWith("image/") ? makePreviewUrl(file) : null,
         isUploading: true,
         error: null,
         part: null
@@ -2301,7 +2577,7 @@ function useComposer(boundConversationId) {
       setAttachments((prev) => [...prev, ...pending]);
       for (const item of pending) {
         try {
-          if (item.file.size > MAX_FILE_SIZE) {
+          if (item.file.size > MAX_FILE_SIZE2) {
             throw new Error(t("widget.file_too_large"));
           }
           const base64 = await fileToBase64(item.file);
@@ -2327,13 +2603,13 @@ function useComposer(boundConversationId) {
     },
     [conversationId, attachments.length, client]
   );
-  const removeAttachment = useCallback3((id) => {
-    setAttachments((prev) => {
-      const item = prev.find((a) => a.id === id);
-      if (item?.previewUrl) URL.revokeObjectURL(item.previewUrl);
-      return prev.filter((a) => a.id !== id);
-    });
-  }, []);
+  const removeAttachment = useCallback3(
+    (id) => {
+      revoke(attachments.find((a) => a.id === id)?.previewUrl);
+      setAttachments((prev) => prev.filter((a) => a.id !== id));
+    },
+    [attachments, revoke]
+  );
   const submit = useCallback3(
     async (override) => {
       const conversationId2 = override?.conversationId ?? boundConversationId;
@@ -2432,9 +2708,7 @@ function useComposer(boundConversationId) {
           });
           store.getState().replaceMessage(conversationId2, optimisticId, result.item);
         }
-        for (const a of attachmentsSnapshot) {
-          if (a.previewUrl) URL.revokeObjectURL(a.previewUrl);
-        }
+        for (const a of attachmentsSnapshot) revoke(a.previewUrl);
       } catch (err) {
         console.error("[useComposer] Send failed:", err);
         store.getState().removeMessage(conversationId2, optimisticId);
@@ -2478,16 +2752,16 @@ function fileToBase64(file) {
 }
 
 // src/hooks/use-conversations.ts
-import { useCallback as useCallback4, useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect4, useRef as useRef4, useState as useState3 } from "react";
 function useConversations() {
   const { client, store, getSourceLocale } = useWidgetContext();
   const conversations = useWidgetStore((s) => s.conversations);
   const setActiveConversation = useWidgetStore((s) => s.setActiveConversation);
   const [isCreating, setIsCreating] = useState3(false);
-  const clientRef = useRef3(client);
-  const storeRef = useRef3(store);
-  const getSourceLocaleRef = useRef3(getSourceLocale);
-  useEffect3(() => {
+  const clientRef = useRef4(client);
+  const storeRef = useRef4(store);
+  const getSourceLocaleRef = useRef4(getSourceLocale);
+  useEffect4(() => {
     clientRef.current = client;
     storeRef.current = store;
     getSourceLocaleRef.current = getSourceLocale;
@@ -2588,10 +2862,10 @@ function useHeaderIdentity() {
 }
 
 // src/hooks/use-i18n.ts
-import { useEffect as useEffect4, useState as useState4 } from "react";
+import { useEffect as useEffect5, useState as useState4 } from "react";
 function useI18n() {
   const [rev, setRev] = useState4(() => getI18nRevision());
-  useEffect4(() => {
+  useEffect5(() => {
     return onLocaleChange(() => {
       setRev(getI18nRevision());
     });
@@ -2600,7 +2874,7 @@ function useI18n() {
 }
 
 // src/hooks/use-presence.ts
-import { useCallback as useCallback5, useRef as useRef4 } from "react";
+import { useCallback as useCallback5, useRef as useRef5 } from "react";
 function usePresence(conversationId) {
   const { ws } = useWidgetContext();
   const isTyping = useWidgetStore(
@@ -2609,8 +2883,8 @@ function usePresence(conversationId) {
   const isAiProcessing = useWidgetStore(
     (s) => conversationId ? s.aiProcessing.get(conversationId) ?? false : false
   );
-  const typingTimer = useRef4(null);
-  const isSendingTyping = useRef4(false);
+  const typingTimer = useRef5(null);
+  const isSendingTyping = useRef5(false);
   const setTyping = useCallback5(
     (typing) => {
       if (!conversationId) return;
@@ -2637,7 +2911,7 @@ function usePresence(conversationId) {
 }
 
 // src/hooks/use-timeline.ts
-import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef5, useState as useState5 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect6, useRef as useRef6, useState as useState5 } from "react";
 var EMPTY_ITEMS = [];
 function useTimeline(conversationId) {
   const { client, store } = useWidgetContext();
@@ -2646,14 +2920,14 @@ function useTimeline(conversationId) {
   );
   const [isLoading, setIsLoading] = useState5(false);
   const [hasMore, setHasMore] = useState5(false);
-  const cursorRef = useRef5(void 0);
-  const clientRef = useRef5(client);
-  const storeRef = useRef5(store);
-  useEffect5(() => {
+  const cursorRef = useRef6(void 0);
+  const clientRef = useRef6(client);
+  const storeRef = useRef6(store);
+  useEffect6(() => {
     clientRef.current = client;
     storeRef.current = store;
   });
-  useEffect5(() => {
+  useEffect6(() => {
     if (!conversationId) return;
     if (conversationId.startsWith("temp-")) return;
     let cancelled = false;
@@ -2737,10 +3011,10 @@ function useWidget() {
 }
 
 // src/shell/docked-bar.tsx
-import { useCallback as useCallback8, useEffect as useEffect6, useRef as useRef7, useState as useState7 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
 
 // src/themed/composer.tsx
-import { useCallback as useCallback7, useRef as useRef6, useState as useState6 } from "react";
+import { useCallback as useCallback7, useRef as useRef7, useState as useState6 } from "react";
 
 // src/themed/icons.tsx
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
@@ -2964,22 +3238,48 @@ function StarIcon({ size = 24, ...props }) {
     }
   );
 }
-function DotsIcon({ size = 24, ...props }) {
-  return /* @__PURE__ */ jsxs(
+function CheckCircleIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsx2(
     "svg",
     {
-      width: size,
-      height: size,
+      width: typeof size === "number" ? `${size}px` : size,
+      height: typeof size === "number" ? `${size}px` : size,
       viewBox: "0 0 24 24",
       fill: "none",
+      "aria-hidden": true,
       xmlns: "http://www.w3.org/2000/svg",
-      "aria-hidden": "true",
       ...props,
-      children: [
-        /* @__PURE__ */ jsx2("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
-        /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
-        /* @__PURE__ */ jsx2("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
-      ]
+      children: /* @__PURE__ */ jsx2("path", { d: "M15 9.5L10.5 15L8.5 13M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
+    }
+  );
+}
+function ThumbsUpIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsx2(
+    "svg",
+    {
+      width: typeof size === "number" ? `${size}px` : size,
+      height: typeof size === "number" ? `${size}px` : size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      "aria-hidden": true,
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx2("path", { d: "M7 11H4C3.44772 11 3 11.4477 3 12V19C3 19.5523 3.44772 20 4 20H7M7 11V20M7 11L11 3H11.6156C12.843 3 13.7808 4.09535 13.5917 5.3081L13.0161 9H18.0631C19.8811 9 21.2813 10.6041 21.0356 12.4053L20.3538 17.4053C20.1511 18.8918 18.8815 20 17.3813 20H7", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" })
+    }
+  );
+}
+function ThumbsDownIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsx2(
+    "svg",
+    {
+      width: typeof size === "number" ? `${size}px` : size,
+      height: typeof size === "number" ? `${size}px` : size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      "aria-hidden": true,
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx2("path", { d: "M17 13H20C20.5523 13 21 12.5523 21 12L21 5C21 4.44772 20.5523 4 20 4H17M17 13L17 4M17 13L13.301 20.4505C13.1339 20.7871 12.7905 21 12.4147 21V21C11.1917 21 10.2572 19.9046 10.4456 18.6919L11.0192 15L5.98994 15C4.17839 15 2.78316 13.3959 3.02793 11.5947L3.70735 6.59466C3.90933 5.1082 5.17443 4 6.66936 4H17", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" })
     }
   );
 }
@@ -3001,9 +3301,9 @@ function Composer({
   onRemoveAttachment,
   disabled
 }) {
-  const ref = useRef6(null);
-  const fileInputRef = useRef6(null);
-  const supportsFieldSizing = useRef6(
+  const ref = useRef7(null);
+  const fileInputRef = useRef7(null);
+  const supportsFieldSizing = useRef7(
     typeof CSS !== "undefined" && CSS.supports?.("field-sizing", "content")
   );
   const handleKeyDown = useCallback7(
@@ -3043,7 +3343,7 @@ function Composer({
     [onAddFiles]
   );
   const [isDragging, setIsDragging] = useState6(false);
-  const dragCountRef = useRef6(0);
+  const dragCountRef = useRef7(0);
   const handleDragEnter = useCallback7((e) => {
     e.preventDefault();
     dragCountRef.current++;
@@ -3209,13 +3509,13 @@ function recognitionCtor() {
 }
 function useDictation(onText) {
   const [listening, setListening] = useState7(false);
-  const recRef = useRef7(null);
-  const onTextRef = useRef7(onText);
-  useEffect6(() => {
+  const recRef = useRef8(null);
+  const onTextRef = useRef8(onText);
+  useEffect7(() => {
     onTextRef.current = onText;
   }, [onText]);
   const [supported] = useState7(() => recognitionCtor() !== null);
-  useEffect6(
+  useEffect7(
     () => () => {
       recRef.current?.stop();
       recRef.current = null;
@@ -3284,9 +3584,9 @@ function DockedBar({
   leading
 }) {
   const [focused, setFocused] = useState7(false);
-  const inputRef = useRef7(null);
-  const boxRef = useRef7(null);
-  const fileInputRef = useRef7(null);
+  const inputRef = useRef8(null);
+  const boxRef = useRef8(null);
+  const fileInputRef = useRef8(null);
   const { questions: visibleQuestions, dismiss: dismissOffer } = useDismissableOffer(suggestions);
   const dictation = useDictation((chunk) => {
     const current = inputRef.current?.value ?? value;
@@ -3302,7 +3602,7 @@ function DockedBar({
     el.style.height = `${next}px`;
     box.dataset.grown = next > GROWN_AT ? "true" : "false";
   }, []);
-  useEffect6(grow, [grow, value]);
+  useEffect7(grow, [grow, value]);
   const handleKeyDown = useCallback8(
     (event) => {
       if (event.key !== "Enter" || event.shiftKey) return;
@@ -3599,11 +3899,50 @@ function AnnouncementPreviewItem({
   );
 }
 
+// src/themed/connection-strip.tsx
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function ConnectionStrip({
+  reconnecting,
+  lost,
+  onRetry
+}) {
+  if (lost) {
+    return (
+      // biome-ignore lint/a11y/useSemanticElements: <output> is a form element and is styled by host pages; a div with the role is announced the same
+      /* @__PURE__ */ jsxs5("div", { className: "hw-disconnect", role: "status", children: [
+        /* @__PURE__ */ jsx6("span", { children: t("widget.connection_lost") }),
+        /* @__PURE__ */ jsx6("button", { type: "button", className: "hw-disconnect-retry", onClick: onRetry, children: t("widget.retry") })
+      ] })
+    );
+  }
+  if (reconnecting) {
+    return /* @__PURE__ */ jsxs5("div", { className: "hw-disconnect", children: [
+      /* @__PURE__ */ jsx6("div", { className: "hw-disconnect-spinner" }),
+      t("widget.reconnecting")
+    ] });
+  }
+  return null;
+}
+
 // src/themed/content/content-tab-view.tsx
-import { useCallback as useCallback12, useEffect as useEffect10 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect11 } from "react";
+
+// src/hooks/use-content-tab.ts
+import { useCallback as useCallback10, useEffect as useEffect8, useState as useState10 } from "react";
+
+// src/hooks/use-mirrored-state.ts
+import { useCallback as useCallback9, useRef as useRef9, useState as useState9 } from "react";
+function useMirroredState(initial) {
+  const [value, setValue] = useState9(initial);
+  const ref = useRef9(value);
+  const set = useCallback9((next) => {
+    ref.current = next;
+    setValue(next);
+  }, []);
+  return [value, set, ref];
+}
 
 // src/hooks/use-content-tab.ts
-import { useCallback as useCallback9, useEffect as useEffect7, useState as useState9 } from "react";
 var EMPTY_TABS2 = [];
 function listKey(tabId, lang) {
   return `flat:${tabId}:${lang}:list`;
@@ -3623,22 +3962,22 @@ function useContentTab(tabId) {
   const tab = contentTabs.find((t2) => t2.id === tabId) ?? null;
   const lang = getLocale();
   const cache = store.getState().contentCache;
-  const [entries, setEntries] = useState9(
+  const [entries, setEntries, entriesRef] = useMirroredState(
     () => readCache(cache, listKey(tabId, lang))?.items ?? []
   );
-  const [detail, setDetail] = useState9(null);
-  const [isLoading, setIsLoading] = useState9(false);
-  const [isLoadingDetail, setIsLoadingDetail] = useState9(false);
-  const [hasMore, setHasMore] = useState9(
+  const [detail, setDetail] = useState10(null);
+  const [isLoading, setIsLoading] = useState10(false);
+  const [isLoadingDetail, setIsLoadingDetail] = useState10(false);
+  const [hasMore, setHasMore] = useState10(
     () => readCache(cache, listKey(tabId, lang))?.hasMore ?? false
   );
-  const [total, setTotal] = useState9(
+  const [total, setTotal] = useState10(
     () => readCache(cache, listKey(tabId, lang))?.total ?? 0
   );
-  const [page, setPage] = useState9(
+  const [page, setPage] = useState10(
     () => readCache(cache, listKey(tabId, lang))?.page ?? 1
   );
-  const fetchEntries = useCallback9(
+  const fetchEntries = useCallback10(
     async (opts) => {
       if (!tab) return;
       const p = opts?.page ?? 1;
@@ -3653,18 +3992,16 @@ function useContentTab(tabId) {
           language: getLocale()
         });
         if (result.items) {
-          setEntries((prev) => {
-            const nextItems = reset ? result.items : [...prev, ...result.items];
-            if (!opts?.search) {
-              store.getState().setContentCache(listKey(tabId, getLocale()), {
-                items: nextItems,
-                total: result.total,
-                hasMore: result.hasMore,
-                page: p
-              });
-            }
-            return nextItems;
-          });
+          const nextItems = reset ? result.items : [...entriesRef.current, ...result.items];
+          setEntries(nextItems);
+          if (!opts?.search) {
+            store.getState().setContentCache(listKey(tabId, getLocale()), {
+              items: nextItems,
+              total: result.total,
+              hasMore: result.hasMore,
+              page: p
+            });
+          }
           setHasMore(result.hasMore);
           setTotal(result.total);
           setPage(p);
@@ -3675,13 +4012,13 @@ function useContentTab(tabId) {
         setIsLoading(false);
       }
     },
-    [client, tabId, tab, store]
+    [client, tabId, tab, store, setEntries, entriesRef]
   );
-  const loadMore = useCallback9(() => {
+  const loadMore = useCallback10(() => {
     if (!hasMore || isLoading) return;
     fetchEntries({ page: page + 1 });
   }, [fetchEntries, hasMore, isLoading, page]);
-  const fetchDetail = useCallback9(
+  const fetchDetail = useCallback10(
     async (slug) => {
       if (!tab) return;
       const cached = readCache(
@@ -3702,10 +4039,7 @@ function useContentTab(tabId) {
         if (result.entry) {
           const entry = result.entry;
           setDetail(entry);
-          store.getState().setContentCache(
-            detailKey(tabId, getLocale(), slug),
-            entry
-          );
+          store.getState().setContentCache(detailKey(tabId, getLocale(), slug), entry);
         }
       } catch (err) {
         console.error("[useContentTab] detail error:", err);
@@ -3715,10 +4049,10 @@ function useContentTab(tabId) {
     },
     [client, tabId, tab, store]
   );
-  const clearDetail = useCallback9(() => {
+  const clearDetail = useCallback10(() => {
     setDetail(null);
   }, []);
-  useEffect7(() => {
+  useEffect8(() => {
     if (tab && entries.length === 0) {
       fetchEntries({ page: 1, reset: true });
     }
@@ -3739,8 +4073,11 @@ function useContentTab(tabId) {
 }
 
 // src/themed/content/simple-markdown.tsx
-import { useEffect as useEffect8, useRef as useRef8 } from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { useEffect as useEffect9, useRef as useRef10 } from "react";
+import { jsx as jsx7 } from "react/jsx-runtime";
+function esc(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
 var COPY_ICON = `<svg class="hw-code-copy-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M15 9V4.25C15 3.55964 14.4404 3 13.75 3H4.25C3.55964 3 3 3.55964 3 4.25V13.75C3 14.4404 3.55964 15 4.25 15H9M10.25 9H19.75C20.4404 9 21 9.55964 21 10.25V19.75C21 20.4404 20.4404 21 19.75 21H10.25C9.55964 21 9 20.4404 9 19.75V10.25C9 9.55964 9.55964 9 10.25 9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
 var CHECK_ICON = `<svg class="hw-code-check-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M8 13L11 16L16 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
 function inferCodeLanguage(code, lang) {
@@ -3780,7 +4117,7 @@ function renderMarkdown(md) {
       const className = langLabel !== "code" ? ` class="language-${langLabel}"` : "";
       const trimmed = escaped.replace(/\n$/, "");
       codeBlocks.push(
-        `<div class="hw-code" data-hw-code="1"><div class="hw-code-header"><span class="hw-code-lang">${langLabel}</span><div class="hw-code-actions"><button type="button" class="hw-code-action hw-code-copy" aria-label="Copy code" title="Copy code">${COPY_ICON}${CHECK_ICON}<span class="hw-code-copy-label">Copy</span></button></div></div><pre><code${className}>${trimmed}</code></pre></div>`
+        `<div class="hw-code" data-hw-code="1"><div class="hw-code-header"><span class="hw-code-lang">${langLabel}</span><div class="hw-code-actions"><button type="button" class="hw-code-action hw-code-copy" aria-label="${esc(t("widget.code_copy_aria"))}" title="${esc(t("widget.code_copy_aria"))}">${COPY_ICON}${CHECK_ICON}<span class="hw-code-copy-label">${esc(t("widget.code_copy"))}</span></button></div></div><pre><code${className}>${trimmed}</code></pre></div>`
       );
       return `
 
@@ -3804,7 +4141,9 @@ ${codeBlockPlaceholder(codeBlocks.length - 1)}
     (_match, headerLine, bodyLines) => {
       const cells = (line) => line.trim().replace(/^\||\|$/g, "").split("|").map((c) => c.trim());
       const head = cells(headerLine).map((c) => `<th>${c}</th>`).join("");
-      const rows = bodyLines.trim().split("\n").map((line) => `<tr>${cells(line).map((c) => `<td>${c}</td>`).join("")}</tr>`).join("");
+      const rows = bodyLines.trim().split("\n").map(
+        (line) => `<tr>${cells(line).map((c) => `<td>${c}</td>`).join("")}</tr>`
+      ).join("");
       tables.push(
         `<div class="hw-table-wrap"><table class="hw-table"><thead><tr>${head}</tr></thead><tbody>${rows}</tbody></table></div>`
       );
@@ -3854,15 +4193,13 @@ function MarkdownContent({
   bodyMarkdown,
   className
 }) {
-  const rootRef = useRef8(null);
+  const rootRef = useRef10(null);
   const html = bodyHtml ?? (bodyMarkdown ? renderMarkdown(bodyMarkdown) : "");
-  useEffect8(() => {
+  useEffect9(() => {
     const root = rootRef.current;
     if (!root) return;
     const isWhitespaceOnly = (el) => {
-      const hasNonBrChild = Array.from(el.children).some(
-        (c) => c.tagName !== "BR"
-      );
+      const hasNonBrChild = Array.from(el.children).some((c) => c.tagName !== "BR");
       if (hasNonBrChild) return false;
       const text = el.textContent ?? "";
       return text.replace(/[\s ]/g, "") === "";
@@ -3875,7 +4212,7 @@ function MarkdownContent({
     };
     removeEmpties();
   }, [html]);
-  useEffect8(() => {
+  useEffect9(() => {
     const root = rootRef.current;
     if (!root) return;
     const handler = (e) => {
@@ -3887,7 +4224,7 @@ function MarkdownContent({
     };
   }, []);
   if (!html) return null;
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       ref: rootRef,
@@ -3899,8 +4236,8 @@ function MarkdownContent({
 function flashCopied(btn, failed = false) {
   const label = btn.querySelector(".hw-code-copy-label");
   if (!label) return;
-  const original = label.textContent ?? "Copy";
-  label.textContent = failed ? "Failed" : "Copied";
+  const original = label.textContent ?? t("widget.code_copy");
+  label.textContent = failed ? t("widget.code_copy_failed") : t("widget.copied");
   btn.classList.add(failed ? "hw-code-copy--failed" : "hw-code-copy--copied");
   setTimeout(() => {
     label.textContent = original;
@@ -3917,24 +4254,24 @@ function closeDanglingMarkdown(partial) {
 }
 
 // src/themed/content/content-detail-view.tsx
-import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 function ContentDetailView({
   entry,
   isLoading
 }) {
   if (isLoading || !entry) {
-    return /* @__PURE__ */ jsx7(ArticleSkeleton, {});
+    return /* @__PURE__ */ jsx8(ArticleSkeleton, {});
   }
   const badge = entry.customFields.version ?? entry.customFields.priority ?? entry.customFields.type ?? null;
-  return /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail", children: [
-    /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-header", children: [
-      /* @__PURE__ */ jsx7("h1", { className: "hw-content-detail-title", children: entry.title }),
-      (badge || entry.publishedAt) && /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-meta", children: [
-        badge && /* @__PURE__ */ jsx7("span", { className: "hw-content-entry-badge", children: badge }),
-        entry.publishedAt && /* @__PURE__ */ jsx7("span", { className: "hw-content-detail-date", children: formatRelativeTime(entry.publishedAt) })
+  return /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail", children: [
+    /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-header", children: [
+      /* @__PURE__ */ jsx8("h1", { className: "hw-content-detail-title", children: entry.title }),
+      (badge || entry.publishedAt) && /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-meta", children: [
+        badge && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-badge", children: badge }),
+        entry.publishedAt && /* @__PURE__ */ jsx8("span", { className: "hw-content-detail-date", children: formatRelativeTime(entry.publishedAt) })
       ] })
     ] }),
-    (entry.body || entry.bodyHtml) && /* @__PURE__ */ jsx7("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx7(MarkdownContent, { bodyHtml: entry.bodyHtml, bodyMarkdown: entry.body }) })
+    (entry.body || entry.bodyHtml) && /* @__PURE__ */ jsx8("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx8(MarkdownContent, { bodyHtml: entry.bodyHtml, bodyMarkdown: entry.body }) })
   ] });
 }
 function ArticleSkeleton() {
@@ -3955,15 +4292,15 @@ function ArticleSkeleton() {
       ]
     }
   ];
-  return /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail", children: [
-    /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-header", children: [
-      /* @__PURE__ */ jsx7("h1", { className: "hw-content-detail-title", children: /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-title" }) }),
-      /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-meta", children: [
-        /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-badge" }),
-        /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-date" })
+  return /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail", children: [
+    /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-header", children: [
+      /* @__PURE__ */ jsx8("h1", { className: "hw-content-detail-title", children: /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-title" }) }),
+      /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-meta", children: [
+        /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-badge" }),
+        /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-date" })
       ] })
     ] }),
-    /* @__PURE__ */ jsx7("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx7("div", { className: "hw-markdown", children: sections.map((s, i) => /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx8("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx8("div", { className: "hw-markdown", children: sections.map((s, i) => /* @__PURE__ */ jsx8(
       SkeletonSection,
       {
         headerWidth: s.headerWidth,
@@ -3977,23 +4314,23 @@ function SkeletonSection({
   headerWidth,
   items
 }) {
-  return /* @__PURE__ */ jsxs5(Fragment2, { children: [
-    /* @__PURE__ */ jsx7("h2", { children: /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
+    /* @__PURE__ */ jsx8("h2", { children: /* @__PURE__ */ jsx8(
       "span",
       {
         className: "hw-skeleton hw-skeleton-h2",
         style: { display: "block", width: headerWidth }
       }
     ) }),
-    items.map((item, j) => /* @__PURE__ */ jsx7("ul", { children: /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsxs5("div", { className: "hw-skeleton-bullet-lines", children: [
-      /* @__PURE__ */ jsx7(
+    items.map((item, j) => /* @__PURE__ */ jsx8("ul", { children: /* @__PURE__ */ jsx8("li", { children: /* @__PURE__ */ jsxs6("div", { className: "hw-skeleton-bullet-lines", children: [
+      /* @__PURE__ */ jsx8(
         "span",
         {
           className: "hw-skeleton hw-skeleton-bullet-line",
           style: { display: "block", width: item.l1 }
         }
       ),
-      /* @__PURE__ */ jsx7(
+      /* @__PURE__ */ jsx8(
         "span",
         {
           className: "hw-skeleton hw-skeleton-bullet-line",
@@ -4005,8 +4342,8 @@ function SkeletonSection({
 }
 
 // src/themed/content/content-list-view.tsx
-import { useCallback as useCallback10, useRef as useRef9, useState as useState10 } from "react";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useCallback as useCallback11, useRef as useRef11, useState as useState11 } from "react";
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 function ContentListView({
   entries,
   isLoading,
@@ -4017,9 +4354,9 @@ function ContentListView({
   searchPlaceholder,
   display
 }) {
-  const [searchText, setSearchText] = useState10("");
-  const debounceRef = useRef9(void 0);
-  const handleSearch = useCallback10(
+  const [searchText, setSearchText] = useState11("");
+  const debounceRef = useRef11(void 0);
+  const handleSearch = useCallback11(
     (value) => {
       setSearchText(value);
       if (!onSearch) return;
@@ -4030,13 +4367,13 @@ function ContentListView({
     },
     [onSearch]
   );
-  return /* @__PURE__ */ jsxs6("div", { className: "hw-content-list", children: [
-    onSearch && /* @__PURE__ */ jsx8("div", { className: "hw-content-search", children: /* @__PURE__ */ jsxs6("div", { className: "hw-content-search-box", children: [
-      /* @__PURE__ */ jsxs6("svg", { className: "hw-content-search-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-        /* @__PURE__ */ jsx8("circle", { cx: "11", cy: "11", r: "8" }),
-        /* @__PURE__ */ jsx8("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
+  return /* @__PURE__ */ jsxs7("div", { className: "hw-content-list", children: [
+    onSearch && /* @__PURE__ */ jsx9("div", { className: "hw-content-search", children: /* @__PURE__ */ jsxs7("div", { className: "hw-content-search-box", children: [
+      /* @__PURE__ */ jsxs7("svg", { className: "hw-content-search-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+        /* @__PURE__ */ jsx9("circle", { cx: "11", cy: "11", r: "8" }),
+        /* @__PURE__ */ jsx9("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
       ] }),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9(
         "input",
         {
           type: "text",
@@ -4047,18 +4384,18 @@ function ContentListView({
         }
       )
     ] }) }),
-    isLoading && entries.length === 0 && /* @__PURE__ */ jsx8("div", { className: "hw-skeleton-content", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs6("div", { className: "hw-skeleton-content-item", children: [
-      /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "70%", height: 14 } }),
-      /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "90%", height: 12 } }),
-      /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "40%", height: 10 } })
+    isLoading && entries.length === 0 && /* @__PURE__ */ jsx9("div", { className: "hw-skeleton-content", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs7("div", { className: "hw-skeleton-content-item", children: [
+      /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "70%", height: 14 } }),
+      /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "90%", height: 12 } }),
+      /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "40%", height: 10 } })
     ] }, i)) }),
-    !isLoading && entries.length === 0 && /* @__PURE__ */ jsxs6("div", { className: "hw-content-empty", children: [
-      /* @__PURE__ */ jsx8("div", { className: "hw-content-empty-title", children: searchText ? t("widget.no_results") : t("widget.nothing_yet") }),
-      /* @__PURE__ */ jsx8("div", { className: "hw-content-empty-desc", children: searchText ? t("widget.try_different") : t("widget.check_back") })
+    !isLoading && entries.length === 0 && /* @__PURE__ */ jsxs7("div", { className: "hw-content-empty", children: [
+      /* @__PURE__ */ jsx9("div", { className: "hw-content-empty-title", children: searchText ? t("widget.no_results") : t("widget.nothing_yet") }),
+      /* @__PURE__ */ jsx9("div", { className: "hw-content-empty-desc", children: searchText ? t("widget.try_different") : t("widget.check_back") })
     ] }),
-    entries.length > 0 && /* @__PURE__ */ jsxs6("div", { className: "hw-content-entries", children: [
-      entries.map((entry) => /* @__PURE__ */ jsx8(ContentEntryCard, { entry, onSelect, display }, entry.slug)),
-      hasMore && /* @__PURE__ */ jsx8(
+    entries.length > 0 && /* @__PURE__ */ jsxs7("div", { className: "hw-content-entries", children: [
+      entries.map((entry) => /* @__PURE__ */ jsx9(ContentEntryCard, { entry, onSelect, display }, entry.slug)),
+      hasMore && /* @__PURE__ */ jsx9(
         "button",
         {
           type: "button",
@@ -4085,24 +4422,24 @@ function ContentEntryCard({
   const badge = display?.badgeField ? customFields[display.badgeField] ?? null : customFields.version ?? customFields.priority ?? customFields.type ?? null;
   const subtitleValue = display?.subtitleField ? (display.subtitleField === "body" ? entry.body : customFields[display.subtitleField]) ?? null : customFields.excerpt ?? customFields.summary ?? customFields.description ?? null;
   const preview = subtitleValue ? truncateText(subtitleValue) : truncateText(entry.body);
-  return /* @__PURE__ */ jsx8("button", { type: "button", className: "hw-content-entry", onClick: () => onSelect(entry.slug), children: /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-main", children: [
-    /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-text", children: [
-      /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-title", children: entry.title }),
-      preview && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-desc", children: preview }),
-      (badge || entry.publishedAt) && /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-meta", children: [
-        badge && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-badge", children: badge }),
-        entry.publishedAt && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-date", children: formatRelativeTime(entry.publishedAt) })
+  return /* @__PURE__ */ jsx9("button", { type: "button", className: "hw-content-entry", onClick: () => onSelect(entry.slug), children: /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-main", children: [
+    /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-text", children: [
+      /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-title", children: entry.title }),
+      preview && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-desc", children: preview }),
+      (badge || entry.publishedAt) && /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-meta", children: [
+        badge && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-badge", children: badge }),
+        entry.publishedAt && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-date", children: formatRelativeTime(entry.publishedAt) })
       ] })
     ] }),
-    /* @__PURE__ */ jsx8("svg", { className: "hw-content-entry-chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx8("polyline", { points: "9 18 15 12 9 6" }) })
+    /* @__PURE__ */ jsx9("svg", { className: "hw-content-entry-chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx9("polyline", { points: "9 18 15 12 9 6" }) })
   ] }) });
 }
 
 // src/themed/content/grouped-content-tab-view.tsx
-import { useEffect as useEffect9, useRef as useRef11 } from "react";
+import { useEffect as useEffect10, useRef as useRef13 } from "react";
 
 // src/hooks/use-grouped-content-tab.ts
-import { useCallback as useCallback11, useRef as useRef10, useState as useState11 } from "react";
+import { useCallback as useCallback12, useRef as useRef12, useState as useState12 } from "react";
 var EMPTY_TABS3 = [];
 function categoriesKey(tabId, lang) {
   return `grouped:${tabId}:${lang}:categories`;
@@ -4126,17 +4463,17 @@ function useGroupedContentTab(tabId) {
   const lang = getLocale();
   const cache = store.getState().contentCache;
   const cachedCategories = readCache2(cache, categoriesKey(tabId, lang));
-  const [categories, setCategories] = useState11(cachedCategories ?? []);
-  const [isCategoriesLoading, setIsCategoriesLoading] = useState11(false);
-  const [items, setItems] = useState11([]);
-  const [isItemsLoading, setIsItemsLoading] = useState11(false);
-  const [itemsHasMore, setItemsHasMore] = useState11(false);
-  const itemsPageRef = useRef10(1);
-  const [detail, setDetail] = useState11(null);
-  const [isLoadingDetail, setIsLoadingDetail] = useState11(false);
-  const [activeCategory, setActiveCategory] = useState11(null);
-  const allCategoriesRef = useRef10(cachedCategories ?? []);
-  const fetchCategories = useCallback11(async () => {
+  const [categories, setCategories] = useState12(cachedCategories ?? []);
+  const [isCategoriesLoading, setIsCategoriesLoading] = useState12(false);
+  const [items, setItems, itemsRef] = useMirroredState([]);
+  const [isItemsLoading, setIsItemsLoading] = useState12(false);
+  const [itemsHasMore, setItemsHasMore] = useState12(false);
+  const itemsPageRef = useRef12(1);
+  const [detail, setDetail] = useState12(null);
+  const [isLoadingDetail, setIsLoadingDetail] = useState12(false);
+  const [activeCategory, setActiveCategory] = useState12(null);
+  const allCategoriesRef = useRef12(cachedCategories ?? []);
+  const fetchCategories = useCallback12(async () => {
     if (!tab) return;
     setIsCategoriesLoading(true);
     try {
@@ -4157,12 +4494,12 @@ function useGroupedContentTab(tabId) {
       setIsCategoriesLoading(false);
     }
   }, [client, tabId, tab, store]);
-  const initFetch = useCallback11(() => {
+  const initFetch = useCallback12(() => {
     if (tab && categories.length === 0) {
       fetchCategories();
     }
   }, [fetchCategories, tab, categories.length]);
-  const fetchItems = useCallback11(
+  const fetchItems = useCallback12(
     async (opts) => {
       if (!tab?.itemsModelSlug) return;
       const p = opts?.page ?? 1;
@@ -4179,16 +4516,15 @@ function useGroupedContentTab(tabId) {
           language: getLocale()
         });
         if (result.items) {
-          setItems((prev) => {
-            const nextItems = reset ? result.items : [...prev, ...result.items];
-            if (!opts?.search && opts?.groupSlug) {
-              store.getState().setContentCache(
-                itemsKey(tabId, getLocale(), opts.groupSlug),
-                { items: nextItems, hasMore: result.hasMore, page: p }
-              );
-            }
-            return nextItems;
-          });
+          const nextItems = reset ? result.items : [...itemsRef.current, ...result.items];
+          setItems(nextItems);
+          if (!opts?.search && opts?.groupSlug) {
+            store.getState().setContentCache(itemsKey(tabId, getLocale(), opts.groupSlug), {
+              items: nextItems,
+              hasMore: result.hasMore,
+              page: p
+            });
+          }
           setItemsHasMore(result.hasMore);
           itemsPageRef.current = p;
         }
@@ -4198,9 +4534,9 @@ function useGroupedContentTab(tabId) {
         setIsItemsLoading(false);
       }
     },
-    [client, tabId, tab, store]
+    [client, tabId, tab, store, setItems, itemsRef]
   );
-  const selectCategory = useCallback11(
+  const selectCategory = useCallback12(
     (category) => {
       setActiveCategory(category);
       setDetail(null);
@@ -4217,16 +4553,16 @@ function useGroupedContentTab(tabId) {
       setItems([]);
       fetchItems({ page: 1, reset: true, groupSlug: category.slug });
     },
-    [fetchItems, store, tabId]
+    [fetchItems, store, tabId, setItems]
   );
-  const loadMoreItems = useCallback11(() => {
+  const loadMoreItems = useCallback12(() => {
     if (!itemsHasMore || isItemsLoading || !activeCategory) return;
     fetchItems({
       page: itemsPageRef.current + 1,
       groupSlug: activeCategory.slug
     });
   }, [fetchItems, itemsHasMore, isItemsLoading, activeCategory]);
-  const searchItems = useCallback11(
+  const searchItems = useCallback12(
     (query) => {
       setItems([]);
       fetchItems({
@@ -4236,9 +4572,9 @@ function useGroupedContentTab(tabId) {
         groupSlug: query ? void 0 : activeCategory?.slug
       });
     },
-    [fetchItems, activeCategory]
+    [fetchItems, activeCategory, setItems]
   );
-  const fetchDetail = useCallback11(
+  const fetchDetail = useCallback12(
     async (slug) => {
       if (!tab?.itemsModelSlug) return;
       const cached = readCache2(
@@ -4260,10 +4596,7 @@ function useGroupedContentTab(tabId) {
         if (result.entry) {
           const entry = result.entry;
           setDetail(entry);
-          store.getState().setContentCache(
-            detailKey2(tabId, getLocale(), slug),
-            entry
-          );
+          store.getState().setContentCache(detailKey2(tabId, getLocale(), slug), entry);
         }
       } catch (err) {
         console.error("[useGroupedContentTab] detail error:", err);
@@ -4273,29 +4606,26 @@ function useGroupedContentTab(tabId) {
     },
     [client, tabId, tab, store]
   );
-  const searchCategories = useCallback11(
-    (query) => {
-      if (!query.trim()) {
-        setCategories(allCategoriesRef.current);
-        return;
-      }
-      const q = query.toLowerCase();
-      setCategories(
-        allCategoriesRef.current.filter(
-          (cat) => cat.title.toLowerCase().includes(q) || (cat.customFields.description ?? "").toLowerCase().includes(q)
-        )
-      );
-    },
-    []
-  );
-  const clearDetail = useCallback11(() => {
+  const searchCategories = useCallback12((query) => {
+    if (!query.trim()) {
+      setCategories(allCategoriesRef.current);
+      return;
+    }
+    const q = query.toLowerCase();
+    setCategories(
+      allCategoriesRef.current.filter(
+        (cat) => cat.title.toLowerCase().includes(q) || (cat.customFields.description ?? "").toLowerCase().includes(q)
+      )
+    );
+  }, []);
+  const clearDetail = useCallback12(() => {
     setDetail(null);
   }, []);
-  const clearCategory = useCallback11(() => {
+  const clearCategory = useCallback12(() => {
     setActiveCategory(null);
     setItems([]);
     setDetail(null);
-  }, []);
+  }, [setItems]);
   return {
     tab,
     categories,
@@ -4318,7 +4648,7 @@ function useGroupedContentTab(tabId) {
 }
 
 // src/themed/content/grouped-content-tab-view.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function GroupedContentTabView({
   tab,
   subView,
@@ -4343,26 +4673,26 @@ function GroupedContentTabView({
     fetchDetail,
     clearCategory
   } = useGroupedContentTab(tab.id);
-  useEffect9(() => {
+  useEffect10(() => {
     initFetch();
   }, [initFetch]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (detailSlug && subView === "content-detail") {
       fetchDetail(detailSlug);
     }
   }, [detailSlug, subView, fetchDetail]);
-  const prevSubView = useRef11(subView);
-  useEffect9(() => {
+  const prevSubView = useRef13(subView);
+  useEffect10(() => {
     if (prevSubView.current === "content-category" && subView === null) {
       clearCategory();
     }
     prevSubView.current = subView;
   }, [subView, clearCategory]);
   if (subView === "content-detail" && detailSlug) {
-    return /* @__PURE__ */ jsx9(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
+    return /* @__PURE__ */ jsx10(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
   }
   if (subView === "content-category" && activeCategory) {
-    return /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx10(
       ContentListView,
       {
         entries: items,
@@ -4376,7 +4706,7 @@ function GroupedContentTabView({
       }
     );
   }
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     ContentListView,
     {
       entries: categories,
@@ -4398,7 +4728,7 @@ function GroupedContentTabView({
 }
 
 // src/themed/content/content-tab-view.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function ContentTabView({
   tab,
   showDetail,
@@ -4408,7 +4738,7 @@ function ContentTabView({
   onSelectCategory
 }) {
   if (tab.tabType === "grouped" && tab.itemsModelSlug) {
-    return /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx11(
       GroupedContentTabView,
       {
         tab,
@@ -4420,7 +4750,7 @@ function ContentTabView({
       }
     );
   }
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     FlatContentTabView,
     {
       tab,
@@ -4446,19 +4776,19 @@ function FlatContentTabView({
     loadMore,
     fetchDetail
   } = useContentTab(tab.id);
-  useEffect10(() => {
+  useEffect11(() => {
     if (detailSlug) fetchDetail(detailSlug);
   }, [detailSlug, fetchDetail]);
-  const handleSearch = useCallback12(
+  const handleSearch = useCallback13(
     (query) => {
       fetchEntries({ page: 1, search: query || void 0, reset: true });
     },
     [fetchEntries]
   );
   if (showDetail && detailSlug) {
-    return /* @__PURE__ */ jsx10(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
+    return /* @__PURE__ */ jsx11(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
   }
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     ContentListView,
     {
       entries,
@@ -4474,7 +4804,7 @@ function FlatContentTabView({
 }
 
 // src/themed/content/tab-icon.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var ICON_MAP = {
   book: BookIcon,
   megaphone: MegaphoneIcon,
@@ -4485,12 +4815,12 @@ var ICON_MAP = {
 };
 function ContentTabIconComponent({ icon }) {
   const Icon = ICON_MAP[icon] ?? BookIcon;
-  return /* @__PURE__ */ jsx11(Icon, {});
+  return /* @__PURE__ */ jsx12(Icon, {});
 }
 
 // src/themed/debug-overlay.tsx
-import { useEffect as useEffect11, useMemo as useMemo2, useRef as useRef12, useState as useState12 } from "react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { useEffect as useEffect12, useMemo as useMemo2, useRef as useRef14, useState as useState13 } from "react";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
 var MAX_EVENTS = 60;
 function isDebugEnabled() {
   if (typeof window === "undefined") return false;
@@ -4507,16 +4837,16 @@ function senderOf(item) {
   return item.type;
 }
 function WidgetDebugOverlay() {
-  const [enabled, setEnabled] = useState12(false);
-  const [open, setOpen] = useState12(true);
-  const [events, setEvents] = useState12([]);
-  const eventsRef = useRef12([]);
+  const [enabled, setEnabled] = useState13(false);
+  const [open, setOpen] = useState13(true);
+  const [events, setEvents] = useState13([]);
+  const eventsRef = useRef14([]);
   const activeId = useWidgetStore((s) => s.activeConversationId);
   const messagesMap = useWidgetStore((s) => s.messages);
   const typingUsers = useWidgetStore((s) => s.typingUsers);
   const aiProcessingMap = useWidgetStore((s) => s.aiProcessing);
   const { store } = useWidgetContext();
-  useEffect11(() => {
+  useEffect12(() => {
     setEnabled(isDebugEnabled());
   }, []);
   const pushEvent = useMemo2(
@@ -4531,7 +4861,7 @@ function WidgetDebugOverlay() {
     },
     []
   );
-  useEffect11(() => {
+  useEffect12(() => {
     if (!enabled) return;
     if (typeof window === "undefined" || typeof window.fetch !== "function") return;
     const originalFetch = window.fetch.bind(window);
@@ -4563,7 +4893,7 @@ function WidgetDebugOverlay() {
       window.fetch = originalFetch;
     };
   }, [enabled, pushEvent]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!enabled) return;
     const original = store.getState().handleRealtimeEvent;
     store.setState({
@@ -4581,8 +4911,8 @@ function WidgetDebugOverlay() {
     () => activeMessages.map((m) => `${m.id}:${senderOf(m)}:${m.createdAt}`).join("|"),
     [activeMessages]
   );
-  const prevSigRef = useRef12(lastMsgSignature);
-  useEffect11(() => {
+  const prevSigRef = useRef14(lastMsgSignature);
+  useEffect12(() => {
     if (!enabled) return;
     if (prevSigRef.current !== lastMsgSignature) {
       prevSigRef.current = lastMsgSignature;
@@ -4596,10 +4926,10 @@ function WidgetDebugOverlay() {
   if (!enabled) return null;
   const isTyping = activeId ? typingUsers.get(activeId) : false;
   const isAi = activeId ? aiProcessingMap.get(activeId) : false;
-  return /* @__PURE__ */ jsxs7("div", { style: styles.wrap, children: [
-    /* @__PURE__ */ jsxs7("div", { style: styles.header, children: [
-      /* @__PURE__ */ jsx12("strong", { children: "hw debug" }),
-      /* @__PURE__ */ jsxs7("span", { style: styles.meta, children: [
+  return /* @__PURE__ */ jsxs8("div", { style: styles.wrap, children: [
+    /* @__PURE__ */ jsxs8("div", { style: styles.header, children: [
+      /* @__PURE__ */ jsx13("strong", { children: "hw debug" }),
+      /* @__PURE__ */ jsxs8("span", { style: styles.meta, children: [
         " ",
         "\xB7 conv ",
         activeId ? activeId.slice(0, 10) : "\u2014",
@@ -4610,29 +4940,29 @@ function WidgetDebugOverlay() {
         " \xB7 ai ",
         isAi ? "Y" : "n"
       ] }),
-      /* @__PURE__ */ jsx12("button", { type: "button", style: styles.btn, onClick: () => setOpen((v) => !v), children: open ? "hide" : "show" }),
-      /* @__PURE__ */ jsx12("button", { type: "button", style: styles.btn, onClick: () => {
+      /* @__PURE__ */ jsx13("button", { type: "button", style: styles.btn, onClick: () => setOpen((v) => !v), children: open ? "hide" : "show" }),
+      /* @__PURE__ */ jsx13("button", { type: "button", style: styles.btn, onClick: () => {
         eventsRef.current = [];
         setEvents([]);
       }, children: "clear" })
     ] }),
-    open && /* @__PURE__ */ jsxs7("div", { style: styles.body, children: [
-      /* @__PURE__ */ jsxs7("div", { style: styles.section, children: [
-        /* @__PURE__ */ jsx12("div", { style: styles.sectionTitle, children: "messages (active)" }),
-        activeMessages.length === 0 ? /* @__PURE__ */ jsx12("div", { style: styles.empty, children: "empty" }) : activeMessages.map((m, i) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsx12("span", { style: { ...styles.badge, background: colorFor(senderOf(m)) }, children: i }),
-          /* @__PURE__ */ jsx12("span", { style: styles.sender, children: senderOf(m) }),
-          /* @__PURE__ */ jsx12("span", { style: styles.ts, children: m.createdAt.slice(11, 23) }),
-          /* @__PURE__ */ jsx12("span", { style: styles.text, children: (m.text ?? "").slice(0, 60) })
+    open && /* @__PURE__ */ jsxs8("div", { style: styles.body, children: [
+      /* @__PURE__ */ jsxs8("div", { style: styles.section, children: [
+        /* @__PURE__ */ jsx13("div", { style: styles.sectionTitle, children: "messages (active)" }),
+        activeMessages.length === 0 ? /* @__PURE__ */ jsx13("div", { style: styles.empty, children: "empty" }) : activeMessages.map((m, i) => /* @__PURE__ */ jsxs8("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsx13("span", { style: { ...styles.badge, background: colorFor(senderOf(m)) }, children: i }),
+          /* @__PURE__ */ jsx13("span", { style: styles.sender, children: senderOf(m) }),
+          /* @__PURE__ */ jsx13("span", { style: styles.ts, children: m.createdAt.slice(11, 23) }),
+          /* @__PURE__ */ jsx13("span", { style: styles.text, children: (m.text ?? "").slice(0, 60) })
         ] }, m.id))
       ] }),
-      /* @__PURE__ */ jsxs7("div", { style: styles.section, children: [
-        /* @__PURE__ */ jsx12("div", { style: styles.sectionTitle, children: "events" }),
-        events.length === 0 ? /* @__PURE__ */ jsx12("div", { style: styles.empty, children: "no events yet \u2014 send a message" }) : events.map((e) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsx12("span", { style: { ...styles.badge, background: kindColor(e.kind) }, children: e.kind }),
-          /* @__PURE__ */ jsx12("span", { style: styles.ts, children: new Date(e.t).toISOString().slice(11, 23) }),
-          /* @__PURE__ */ jsx12("span", { style: styles.evLabel, children: e.label }),
-          e.detail && /* @__PURE__ */ jsx12("span", { style: styles.detail, children: e.detail })
+      /* @__PURE__ */ jsxs8("div", { style: styles.section, children: [
+        /* @__PURE__ */ jsx13("div", { style: styles.sectionTitle, children: "events" }),
+        events.length === 0 ? /* @__PURE__ */ jsx13("div", { style: styles.empty, children: "no events yet \u2014 send a message" }) : events.map((e) => /* @__PURE__ */ jsxs8("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsx13("span", { style: { ...styles.badge, background: kindColor(e.kind) }, children: e.kind }),
+          /* @__PURE__ */ jsx13("span", { style: styles.ts, children: new Date(e.t).toISOString().slice(11, 23) }),
+          /* @__PURE__ */ jsx13("span", { style: styles.evLabel, children: e.label }),
+          e.detail && /* @__PURE__ */ jsx13("span", { style: styles.detail, children: e.detail })
         ] }, e.id))
       ] })
     ] })
@@ -4734,10 +5064,403 @@ var styles = {
   empty: { color: "#52525b", fontStyle: "italic", fontSize: 10 }
 };
 
+// src/themed/icons-local.tsx
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+function DotsIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsxs9(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx14("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
+        /* @__PURE__ */ jsx14("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
+        /* @__PURE__ */ jsx14("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
+      ]
+    }
+  );
+}
+
+// src/themed/message-bubble.tsx
+import { useEffect as useEffect13, useLayoutEffect, useRef as useRef15, useState as useState14 } from "react";
+
+// src/themed/image-fallback.ts
+function imageFileName(url) {
+  try {
+    const { pathname, host } = new URL(url);
+    const last = pathname.split("/").filter(Boolean).pop();
+    if (!last) return host;
+    try {
+      return decodeURIComponent(last);
+    } catch {
+      return last;
+    }
+  } catch {
+    return url.split(/[?#]/)[0]?.split("/").filter(Boolean).pop() ?? url;
+  }
+}
+function fileExt(name) {
+  const dot = name.lastIndexOf(".");
+  return dot > 0 ? name.slice(dot + 1).toLowerCase() : "";
+}
+
+// ../types/src/link-preview.ts
+var FILE_ENDINGS = /* @__PURE__ */ new Set([
+  "js",
+  "jsx",
+  "ts",
+  "tsx",
+  "mjs",
+  "cjs",
+  "css",
+  "scss",
+  "html",
+  "htm",
+  "json",
+  "yaml",
+  "yml",
+  "toml",
+  "xml",
+  "txt",
+  "log",
+  "csv",
+  "pdf",
+  "png",
+  "jpg",
+  "jpeg",
+  "gif",
+  "svg",
+  "webp",
+  "php",
+  "rb",
+  "cpp",
+  "exe",
+  "lock",
+  "map",
+  "env",
+  "md",
+  "gz",
+  "tar"
+]);
+var FILE_MIDDLES = /* @__PURE__ */ new Set([
+  "config",
+  "spec",
+  "test",
+  "min",
+  "d",
+  "module",
+  "stories",
+  "setup",
+  "types",
+  "bundle",
+  "schema"
+]);
+var KNOWN_NAMES = /* @__PURE__ */ new Set(["asp.net", "ado.net", "vb.net"]);
+var DOT_LETTERS = /* @__PURE__ */ new Set(["\uA4F8", "\uA78F"]);
+var make = (source, flags) => new RegExp(source, flags);
+var one = (set) => make(`^[${set}]$`, "u");
+var engine;
+function patterns() {
+  if (engine !== void 0) return engine;
+  try {
+    const lgc = "\\p{sc=Latn}\\p{sc=Grek}\\p{sc=Cyrl}\\p{sc=Zyyy}";
+    engine = {
+      /* Controls, line separators and the bidi controls: a space, not
+         nothing, because they separated something. */
+      control: make("[\\p{Cc}\\p{Zl}\\p{Zp}\\u202a-\\u202e\\u2066-\\u2069]", "gu"),
+      invisible: make("[\\p{Cf}\\p{Me}\\p{Default_Ignorable_Code_Point}]", "gu"),
+      looseMark: make(`(^|[${lgc}])\\p{Mn}+`, "gu"),
+      anyMark: make("\\p{M}", "gu"),
+      letter: one("\\p{L}"),
+      modifier: one("\\p{Lm}"),
+      digit: one("\\p{Nd}"),
+      number: one("\\p{N}"),
+      punctOrSymbol: one("\\p{P}\\p{S}"),
+      /* Dashes and quotation marks are not drawn as a dot. */
+      notAJoiner: one("\\p{Pd}\\p{Pi}\\p{Pf}"),
+      latin: one("\\p{sc=Latn}"),
+      greek: one("\\p{sc=Grek}"),
+      cyrillic: one("\\p{sc=Cyrl}"),
+      noSpace: one(
+        "\\p{sc=Hani}\\p{sc=Hira}\\p{sc=Kana}\\p{sc=Hang}\\p{sc=Bopo}\\p{sc=Thai}\\p{sc=Laoo}\\p{sc=Khmr}\\p{sc=Mymr}\\p{sc=Tibt}"
+      ),
+      common: one("\\p{sc=Zyyy}\\p{sc=Zinh}"),
+      tld: make("^\\p{L}{2,}$", "u"),
+      ipv6Bracket: make("\\[[0-9a-f:.]*:[0-9a-f:.]*\\]", "g"),
+      ipv6Bare: make("(^|[^\\p{L}\\p{N}:.])([0-9a-f:]{3,})(?![\\p{L}\\p{N}:.])", "gu")
+    };
+  } catch {
+    engine = null;
+  }
+  return engine;
+}
+function foldPreviewText(value) {
+  const rx = patterns();
+  if (!rx) throw new Error("link-preview: no Unicode property support");
+  return value.normalize("NFKC").replace(rx.control, " ").replace(rx.invisible, "").replace(rx.looseMark, "$1").replace(/\s+/g, " ").trim();
+}
+function cleanPreviewText(value, cap) {
+  if (typeof value !== "string") return null;
+  let text;
+  try {
+    text = foldPreviewText(value);
+  } catch {
+    return null;
+  }
+  if (!text) return null;
+  return text.length > cap ? `${text.slice(0, cap - 1).trimEnd()}\u2026` : text;
+}
+var BREAK = { kind: "break", script: "common" };
+var seen = /* @__PURE__ */ new Map();
+function scriptOf(ch, rx) {
+  if (rx.latin.test(ch)) return "latin";
+  if (rx.noSpace.test(ch)) return "nospace";
+  if (rx.cyrillic.test(ch)) return "cyrillic";
+  if (rx.greek.test(ch)) return "greek";
+  if (rx.common.test(ch)) return "common";
+  return "other";
+}
+function read(ch, rx) {
+  const code = ch.codePointAt(0) ?? 0;
+  if (code < 128) {
+    if (ch === ".") return { kind: "dot", script: "common" };
+    if (ch === "-" || code >= 48 && code <= 57) return { kind: "word", script: "common" };
+    if (code >= 97 && code <= 122) return { kind: "word", script: "latin" };
+    return BREAK;
+  }
+  const known = seen.get(ch);
+  if (known) return known;
+  let out = BREAK;
+  if (DOT_LETTERS.has(ch) || rx.modifier.test(ch)) out = { kind: "join", script: "common" };
+  else if (rx.letter.test(ch)) out = { kind: "word", script: scriptOf(ch, rx) };
+  else if (rx.digit.test(ch)) out = { kind: "join", script: "common" };
+  else if (rx.number.test(ch)) out = { kind: "word", script: "common" };
+  else if (rx.notAJoiner.test(ch)) out = BREAK;
+  else if (rx.punctOrSymbol.test(ch)) out = { kind: "join", script: "common" };
+  if (seen.size < 4096) seen.set(ch, out);
+  return out;
+}
+function shapeOf(checked, rx) {
+  const tokens = [];
+  let mixed = false;
+  let run = "";
+  let letters = 0;
+  let noSpaceLetters = 0;
+  let piece = /* @__PURE__ */ new Set();
+  const endPiece = () => {
+    piece.delete("nospace");
+    piece.delete("common");
+    if (piece.size > 1) mixed = true;
+    piece = /* @__PURE__ */ new Set();
+  };
+  const endRun = () => {
+    if (!run) return;
+    endPiece();
+    if (/[^-]/.test(run)) {
+      tokens.push({
+        kind: "word",
+        text: run,
+        noSpace: letters > 0 && noSpaceLetters === letters,
+        hasLetter: letters > 0
+      });
+    } else {
+      tokens.push({ kind: "break", text: run, noSpace: false, hasLetter: false });
+    }
+    run = "";
+    letters = 0;
+    noSpaceLetters = 0;
+  };
+  for (const ch of checked) {
+    const c = read(ch, rx);
+    if (c.kind === "word") {
+      run += ch;
+      if (ch === "-") endPiece();
+      else if (c.script !== "common") {
+        letters++;
+        if (c.script === "nospace") noSpaceLetters++;
+        piece.add(c.script);
+      }
+      continue;
+    }
+    endRun();
+    tokens.push({ kind: c.kind, text: ch, noSpace: false, hasLetter: false });
+  }
+  endRun();
+  return { tokens, mixed };
+}
+function hostOf(labels, rx, asAddress) {
+  const n = labels.length;
+  if (n === 4 && labels.every((l) => /^\d{1,3}$/.test(l))) return labels.join(".");
+  let end = n;
+  if (!asAddress) {
+    let file = false;
+    while (end > 1 && FILE_ENDINGS.has(labels[end - 1] ?? "")) {
+      end--;
+      file = true;
+    }
+    while (file && end > 1 && FILE_MIDDLES.has(labels[end - 1] ?? "")) end--;
+  }
+  for (let i = end - 1; i >= 1; i--) {
+    const ending = (labels[i] ?? "").split("-", 1)[0] ?? "";
+    if (!rx.tld.test(ending)) continue;
+    const host = [...labels.slice(0, i), ending].join(".");
+    return KNOWN_NAMES.has(host) ? null : host;
+  }
+  return null;
+}
+function hostsNamedIn(text) {
+  const rx = patterns();
+  if (!rx) return [""];
+  const checked = foldPreviewText(text).replace(rx.anyMark, "").toLowerCase();
+  const out = /* @__PURE__ */ new Set();
+  const { tokens, mixed } = shapeOf(checked, rx);
+  if (mixed) out.add("");
+  for (let i = 0; i < tokens.length; i++) {
+    const first = tokens[i];
+    if (!first || first.kind !== "word") continue;
+    const labels = [first.text];
+    let anyLetter = first.hasLetter;
+    let j = i;
+    for (; ; ) {
+      const sep = tokens[j + 1];
+      const next = tokens[j + 2];
+      const here = tokens[j];
+      if (!sep || !next || !here || next.kind !== "word") break;
+      if (sep.kind === "break") break;
+      if (sep.kind === "join" && here.noSpace && next.noSpace) break;
+      labels.push(next.text);
+      anyLetter ||= next.hasLetter;
+      j += 2;
+    }
+    const before = tokens[i - 1]?.text;
+    const host = labels.length > 1 ? hostOf(labels, rx, before === "@") : null;
+    if (host) out.add(host);
+    const colon = tokens[j + 1];
+    const port = tokens[j + 2];
+    if (!host && anyLetter && colon?.text === ":" && port && /^\d{1,5}$/.test(port.text)) {
+      out.add(labels.join("."));
+    }
+    i = j;
+  }
+  for (let at = checked.indexOf("://"); at !== -1; at = checked.indexOf("://", at + 3)) {
+    const rest = checked.slice(at + 3, at + 3 + 300);
+    const authority = (rest.split(/[\s/?#]/, 1)[0] ?? "").split("@").pop() ?? "";
+    const literal = /^\[[^\]]*\]/.exec(authority)?.[0];
+    out.add(literal ?? authority.replace(/:\d*$/, ""));
+  }
+  for (const m of checked.matchAll(rx.ipv6Bracket)) out.add(m[0]);
+  for (const m of checked.matchAll(rx.ipv6Bare)) {
+    const literal = m[2] ?? "";
+    const colons = literal.split(":").length - 1;
+    if (/[0-9a-f]/.test(literal) && (literal.includes("::") || colons === 7)) out.add(literal);
+  }
+  return [...out];
+}
+function bare(host) {
+  const h = host.toLowerCase();
+  const bracketed = /^\[(.*)\](?::\d+)?$/.exec(h);
+  if (bracketed) return bracketed[1] ?? "";
+  if (h.split(":").length > 2) return h;
+  return h.replace(/:\d+$/, "").replace(/\.$/, "").replace(/^www\./, "");
+}
+function sameSite(a, b) {
+  const x = bare(a);
+  const y = bare(b);
+  if (!x || !y) return false;
+  return x === y || x.endsWith(`.${y}`) || y.endsWith(`.${x}`);
+}
+function ascii(named) {
+  if (/^[\x00-\x7f]*$/.test(named)) return named;
+  try {
+    return new URL(`https://${named}`).hostname;
+  } catch {
+    return null;
+  }
+}
+function namesAnotherSite(text, realHost) {
+  let named;
+  try {
+    named = hostsNamedIn(text);
+  } catch {
+    return true;
+  }
+  for (const host of named) {
+    const form = host === "" ? null : ascii(host);
+    if (form === null || !sameSite(form, realHost)) return true;
+  }
+  return false;
+}
+var PREVIEW_HOST_CAP = 40;
+function previewHost(url) {
+  const host = url.host.replace(/^www\./, "");
+  return host.length > PREVIEW_HOST_CAP ? `\u2026${host.slice(host.length - (PREVIEW_HOST_CAP - 1))}` : host;
+}
+function previewWords(url, raw, caps = { title: 160, description: 280 }) {
+  const keep = (value, cap) => {
+    if (typeof value !== "string" || namesAnotherSite(value, url.hostname)) return null;
+    return cleanPreviewText(value, cap);
+  };
+  return {
+    title: keep(raw.title, caps.title),
+    description: keep(raw.description, caps.description)
+  };
+}
+var PREVIEW_ICON_MAX_BYTES = 32 * 1024;
+
+// src/themed/link-preview.ts
+function httpsOnly(value) {
+  if (!value) return null;
+  try {
+    const url = new URL(value);
+    return url.protocol === "https:" && !url.username && !url.password ? url.href : null;
+  } catch {
+    return null;
+  }
+}
+function pictureOnly(image, title) {
+  if (!image || !title) return image;
+  let asked;
+  try {
+    asked = new URL(image).searchParams.get("title");
+  } catch {
+    return image;
+  }
+  if (!asked) return image;
+  const fold = (v) => v.toLowerCase().replace(/\s+/g, " ").trim();
+  const a = fold(asked);
+  const t2 = fold(title);
+  return a.length >= 4 && (t2.includes(a) || a.includes(t2)) ? null : image;
+}
+function linkPreviewView(preview) {
+  let url;
+  try {
+    url = new URL(preview.url);
+  } catch {
+    return null;
+  }
+  if (url.protocol !== "http:" && url.protocol !== "https:" || url.username || url.password) {
+    return null;
+  }
+  const { title, description } = previewWords(url, preview);
+  if (!title && !description) return null;
+  return {
+    href: url.href,
+    host: previewHost(url),
+    title,
+    description,
+    image: pictureOnly(httpsOnly(preview.imageUrl), title),
+    favicon: httpsOnly(preview.favicon)
+  };
+}
+
 // src/themed/message-bubble.tsx
-import { useEffect as useEffect12, useLayoutEffect, useRef as useRef13, useState as useState13 } from "react";
 import { createPortal } from "react-dom";
-import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
 function MessageBubble({
   text,
   sender,
@@ -4750,7 +5473,7 @@ function MessageBubble({
   streaming
 }) {
   const senderClass = `hw-msg--${sender}`;
-  const bubbleRef = useRef13(null);
+  const bubbleRef = useRef15(null);
   const imageParts = parts?.filter((p) => p.type === "image") ?? [];
   const fileParts = parts?.filter((p) => p.type === "file") ?? [];
   const linkPreviews = parts?.filter(
@@ -4760,7 +5483,7 @@ function MessageBubble({
     (p) => p.type === "source"
   ) ?? [];
   const hasText = text.length > 0;
-  useEffect12(() => {
+  useEffect13(() => {
     const bubble = bubbleRef.current;
     if (!bubble || sender !== "ai" && sender !== "team") return;
     const handleClick = (event) => {
@@ -4771,23 +5494,23 @@ function MessageBubble({
       bubble.removeEventListener("click", handleClick);
     };
   }, [sender]);
-  return /* @__PURE__ */ jsx13("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs8("div", { className: "hw-msg-body", children: [
-    imageParts.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx13(PreviewableThumbnail, { src: img.url }, i)) }),
-    hasText && /* @__PURE__ */ jsxs8("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
-      sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs10("div", { className: "hw-msg-body", children: [
+    imageParts.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx15(PreviewableThumbnail, { src: img.url }, i)) }),
+    hasText && /* @__PURE__ */ jsxs10("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
+      sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx15(
         "span",
         {
           dangerouslySetInnerHTML: {
             __html: renderMarkdown(streaming ? closeDanglingMarkdown(text) : text)
           }
         }
-      ) : /* @__PURE__ */ jsx13("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
-      streaming && /* @__PURE__ */ jsx13("span", { className: "hw-streaming-cursor" })
+      ) : /* @__PURE__ */ jsx15("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
+      streaming && /* @__PURE__ */ jsx15("span", { className: "hw-streaming-cursor" })
     ] }),
-    fileParts.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx13(FileCard, { file }, i)) }),
-    linkPreviews.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx13(LinkPreviewCard, { preview: lp }, i)) }),
-    sources.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-sources", children: sources.map(
-      (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs8(
+    fileParts.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx15(FileCard, { file }, i)) }),
+    linkPreviews.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx15(LinkPreviewCard, { preview: lp }, i)) }),
+    sources.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-sources", children: sources.map(
+      (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs10(
         "a",
         {
           href: src.sourceUrl,
@@ -4796,26 +5519,26 @@ function MessageBubble({
           className: "hw-source",
           onClick: (e) => e.stopPropagation(),
           children: [
-            /* @__PURE__ */ jsx13("span", { className: "hw-source-n", children: i + 1 }),
-            /* @__PURE__ */ jsx13("span", { className: "hw-source-title", children: src.title })
+            /* @__PURE__ */ jsx15("span", { className: "hw-source-n", children: i + 1 }),
+            /* @__PURE__ */ jsx15("span", { className: "hw-source-title", children: src.title })
           ]
         },
         src.knowledgeId
-      ) : /* @__PURE__ */ jsxs8("div", { className: "hw-source", children: [
-        /* @__PURE__ */ jsx13("span", { className: "hw-source-n", children: i + 1 }),
-        /* @__PURE__ */ jsx13("span", { className: "hw-source-title", children: src.title })
+      ) : /* @__PURE__ */ jsxs10("div", { className: "hw-source", children: [
+        /* @__PURE__ */ jsx15("span", { className: "hw-source-n", children: i + 1 }),
+        /* @__PURE__ */ jsx15("span", { className: "hw-source-title", children: src.title })
       ] }, src.knowledgeId)
     ) }),
-    metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx13(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
+    metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx15(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
     (() => {
       const isVisitor = sender === "visitor";
       const lead = isVisitor ? null : senderName ?? null;
       const withLead = (showAuthor ?? !!timestamp) && !!lead;
       if (!withLead && !timestamp) return null;
-      return /* @__PURE__ */ jsxs8("div", { className: "hw-msg-meta", children: [
-        withLead && /* @__PURE__ */ jsx13("span", { className: "hw-msg-author", children: lead }),
-        withLead && timestamp && /* @__PURE__ */ jsx13("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
-        timestamp && /* @__PURE__ */ jsx13("span", { className: "hw-msg-time", children: timestamp })
+      return /* @__PURE__ */ jsxs10("div", { className: "hw-msg-meta", children: [
+        withLead && /* @__PURE__ */ jsx15("span", { className: "hw-msg-author", children: lead }),
+        withLead && timestamp && /* @__PURE__ */ jsx15("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
+        timestamp && /* @__PURE__ */ jsx15("span", { className: "hw-msg-time", children: timestamp })
       ] });
     })()
   ] }) });
@@ -4824,21 +5547,21 @@ function QuickReplyButtons({
   metadata,
   onTap
 }) {
-  const [tappedId, setTappedId] = useState13(null);
+  const [tappedId, setTappedId] = useState14(null);
   const isLocked = metadata.cancelled || tappedId !== null;
   const handleTap = (optionId) => {
     if (isLocked) return;
     setTappedId(optionId);
     onTap?.(optionId, metadata.stepId);
   };
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     "div",
     {
       className: "hw-quick-replies",
       "data-cancelled": metadata.cancelled ? "true" : void 0,
       children: metadata.options.map((opt) => {
         const isTapped = tappedId === opt.id;
-        return /* @__PURE__ */ jsx13(
+        return /* @__PURE__ */ jsx15(
           "button",
           {
             type: "button",
@@ -4855,10 +5578,18 @@ function QuickReplyButtons({
   );
 }
 function PreviewableThumbnail({ src }) {
-  const [hover, setHover] = useState13(false);
-  const ref = useRef13(null);
-  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
-    /* @__PURE__ */ jsx13(
+  const [hover, setHover] = useState14(false);
+  const [broken, setBroken] = useState14(false);
+  const ref = useRef15(null);
+  if (broken) {
+    const name = imageFileName(src);
+    return /* @__PURE__ */ jsxs10("a", { href: src, target: "_blank", rel: "noopener noreferrer", className: "hw-msg-file", children: [
+      /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext: fileExt(name) }) }),
+      /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-info", children: /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-name", children: name }) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs10(Fragment3, { children: [
+    /* @__PURE__ */ jsx15(
       "a",
       {
         ref,
@@ -4869,21 +5600,21 @@ function PreviewableThumbnail({ src }) {
         "aria-label": t("widget.aria_open_image"),
         onMouseEnter: () => setHover(true),
         onMouseLeave: () => setHover(false),
-        children: /* @__PURE__ */ jsx13("img", { src, alt: "", className: "hw-msg-image", loading: "lazy" })
+        children: /* @__PURE__ */ jsx15("img", { src, alt: "", className: "hw-msg-image", loading: "lazy", onError: () => setBroken(true) })
       }
     ),
-    hover && /* @__PURE__ */ jsx13(AnchoredPreview, { src, anchorRef: ref, href: src })
+    hover && /* @__PURE__ */ jsx15(AnchoredPreview, { src, anchorRef: ref, href: src })
   ] });
 }
 var PREVIEWABLE_EXTS = /* @__PURE__ */ new Set(["pdf", "csv", "png", "jpg", "jpeg", "gif", "webp", "svg"]);
 function FileCard({ file }) {
-  const [hover, setHover] = useState13(false);
-  const ref = useRef13(null);
+  const [hover, setHover] = useState14(false);
+  const ref = useRef15(null);
   const ext = file.fileName.split(".").pop()?.toLowerCase() ?? "";
   const isPreviewable = PREVIEWABLE_EXTS.has(ext);
   const isImage = file.mimeType.startsWith("image/");
-  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs10(Fragment3, { children: [
+    /* @__PURE__ */ jsxs10(
       "a",
       {
         ref,
@@ -4894,15 +5625,15 @@ function FileCard({ file }) {
         onMouseEnter: () => isPreviewable && setHover(true),
         onMouseLeave: () => setHover(false),
         children: [
-          /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx13(FileTypeIcon, { ext }) }),
-          /* @__PURE__ */ jsxs8("span", { className: "hw-msg-file-info", children: [
-            /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-name", children: file.fileName }),
-            /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
+          /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext }) }),
+          /* @__PURE__ */ jsxs10("span", { className: "hw-msg-file-info", children: [
+            /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-name", children: file.fileName }),
+            /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
           ] })
         ]
       }
     ),
-    hover && isPreviewable && (isImage ? /* @__PURE__ */ jsx13(AnchoredPreview, { src: file.url, anchorRef: ref, href: file.url }) : /* @__PURE__ */ jsx13(AnchoredDocPreview, { fileName: file.fileName, ext, anchorRef: ref, href: file.url }))
+    hover && isPreviewable && (isImage ? /* @__PURE__ */ jsx15(AnchoredPreview, { src: file.url, anchorRef: ref, href: file.url }) : /* @__PURE__ */ jsx15(AnchoredDocPreview, { fileName: file.fileName, ext, anchorRef: ref, href: file.url }))
   ] });
 }
 function AnchoredPreview({
@@ -4911,8 +5642,8 @@ function AnchoredPreview({
   href,
   onOpen
 }) {
-  const [style, setStyle] = useState13({ opacity: 0 });
-  const [portalTarget, setPortalTarget] = useState13(null);
+  const [style, setStyle] = useState14({ opacity: 0 });
+  const [portalTarget, setPortalTarget] = useState14(null);
   useLayoutEffect(() => {
     const anchor = anchorRef.current;
     if (!anchor) return;
@@ -4936,7 +5667,7 @@ function AnchoredPreview({
   };
   if (!portalTarget) return null;
   return createPortal(
-    /* @__PURE__ */ jsx13("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx13("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
+    /* @__PURE__ */ jsx15("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx15("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
     portalTarget
   );
 }
@@ -4946,8 +5677,8 @@ function AnchoredDocPreview({
   anchorRef,
   href
 }) {
-  const [style, setStyle] = useState13({ opacity: 0 });
-  const [portalTarget, setPortalTarget] = useState13(null);
+  const [style, setStyle] = useState14({ opacity: 0 });
+  const [portalTarget, setPortalTarget] = useState14(null);
   useLayoutEffect(() => {
     const anchor = anchorRef.current;
     if (!anchor) return;
@@ -4967,17 +5698,17 @@ function AnchoredDocPreview({
   }, [anchorRef]);
   if (!portalTarget) return null;
   return createPortal(
-    /* @__PURE__ */ jsxs8(
+    /* @__PURE__ */ jsxs10(
       "div",
       {
         className: "hw-hover-preview hw-hover-preview--doc",
         style,
         onClick: () => window.open(href, "_blank", "noopener,noreferrer"),
         children: [
-          /* @__PURE__ */ jsx13("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx13(FileTypeIcon, { ext }) }),
-          /* @__PURE__ */ jsxs8("div", { className: "hw-hover-preview-doc-info", children: [
-            /* @__PURE__ */ jsx13("span", { className: "hw-hover-preview-doc-name", children: fileName }),
-            /* @__PURE__ */ jsx13("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
+          /* @__PURE__ */ jsx15("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext }) }),
+          /* @__PURE__ */ jsxs10("div", { className: "hw-hover-preview-doc-info", children: [
+            /* @__PURE__ */ jsx15("span", { className: "hw-hover-preview-doc-name", children: fileName }),
+            /* @__PURE__ */ jsx15("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
           ] })
         ]
       }
@@ -5002,7 +5733,7 @@ var FILE_TYPE_COLORS = {
 };
 function FileTypeIcon({ ext }) {
   const color = FILE_TYPE_COLORS[ext] ?? "currentColor";
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs10(
     "svg",
     {
       viewBox: "0 0 24 24",
@@ -5012,60 +5743,60 @@ function FileTypeIcon({ ext }) {
       strokeLinecap: "round",
       strokeLinejoin: "round",
       children: [
-        /* @__PURE__ */ jsx13("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
-        /* @__PURE__ */ jsx13("polyline", { points: "14 2 14 8 20 8" }),
-        ext === "pdf" && /* @__PURE__ */ jsx13("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
-        ext === "csv" && /* @__PURE__ */ jsx13("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
+        /* @__PURE__ */ jsx15("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
+        /* @__PURE__ */ jsx15("polyline", { points: "14 2 14 8 20 8" }),
+        ext === "pdf" && /* @__PURE__ */ jsx15("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
+        ext === "csv" && /* @__PURE__ */ jsx15("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
       ]
     }
   );
 }
 function LinkPreviewCard({ preview }) {
-  const hostname = (() => {
-    try {
-      return new URL(preview.url).hostname;
-    } catch {
-      return preview.url;
-    }
-  })();
-  return /* @__PURE__ */ jsxs8(
+  const view = linkPreviewView(preview);
+  const [imageFailed, setImageFailed] = useState14(false);
+  const [faviconFailed, setFaviconFailed] = useState14(false);
+  if (!view) return null;
+  return /* @__PURE__ */ jsxs10(
     "a",
     {
-      href: preview.url,
+      href: view.href,
       target: "_blank",
       rel: "noopener noreferrer",
       className: "hw-link-preview",
       onClick: (e) => e.stopPropagation(),
       children: [
-        preview.imageUrl && /* @__PURE__ */ jsx13(
+        view.image && !imageFailed && /* @__PURE__ */ jsx15(
           "img",
           {
-            src: preview.imageUrl,
+            src: view.image,
             alt: "",
             className: "hw-link-preview-img",
             loading: "lazy",
-            onError: (e) => {
-              e.target.style.display = "none";
-            }
+            decoding: "async",
+            referrerPolicy: "no-referrer",
+            onError: () => setImageFailed(true)
           }
         ),
-        /* @__PURE__ */ jsxs8("div", { className: "hw-link-preview-body", children: [
-          preview.favicon && /* @__PURE__ */ jsx13(
-            "img",
-            {
-              src: preview.favicon,
-              alt: "",
-              className: "hw-link-preview-favicon",
-              width: 16,
-              height: 16,
-              onError: (e) => {
-                e.target.style.display = "none";
+        /* @__PURE__ */ jsxs10("div", { className: "hw-link-preview-body", children: [
+          /* @__PURE__ */ jsxs10("div", { className: "hw-link-preview-url", children: [
+            view.favicon && !faviconFailed && /* @__PURE__ */ jsx15(
+              "img",
+              {
+                src: view.favicon,
+                alt: "",
+                className: "hw-link-preview-favicon",
+                width: 14,
+                height: 14,
+                loading: "lazy",
+                decoding: "async",
+                referrerPolicy: "no-referrer",
+                onError: () => setFaviconFailed(true)
               }
-            }
-          ),
-          preview.title && /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-title", children: preview.title }),
-          preview.description && /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-desc", children: preview.description.slice(0, 120) }),
-          /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-url", children: hostname })
+            ),
+            /* @__PURE__ */ jsx15("span", { className: "hw-link-preview-host", children: view.host })
+          ] }),
+          view.title && /* @__PURE__ */ jsx15("div", { className: "hw-link-preview-title", dir: "auto", children: view.title }),
+          view.description && /* @__PURE__ */ jsx15("div", { className: "hw-link-preview-desc", dir: "auto", children: view.description })
         ] })
       ]
     }
@@ -5073,8 +5804,8 @@ function LinkPreviewCard({ preview }) {
 }
 
 // src/themed/message-list.tsx
-import React, { useEffect as useEffect13, useRef as useRef14 } from "react";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import React, { useEffect as useEffect14, useRef as useRef16 } from "react";
+import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 function parseParts(raw) {
   if (!raw) return null;
   if (Array.isArray(raw)) return raw;
@@ -5108,12 +5839,12 @@ function MessageList({
   onLoadMore,
   renderAfterMessages
 }) {
-  const bottomRef = useRef14(null);
-  const topRef = useRef14(null);
-  const containerRef = useRef14(null);
-  const prevItemCountRef = useRef14(items.length);
-  const isInitialLoadRef = useRef14(true);
-  const hadStreamRef = useRef14(false);
+  const bottomRef = useRef16(null);
+  const topRef = useRef16(null);
+  const containerRef = useRef16(null);
+  const prevItemCountRef = useRef16(items.length);
+  const isInitialLoadRef = useRef16(true);
+  const hadStreamRef = useRef16(false);
   const client = useWidgetClient();
   const activeConversationId = useWidgetStore((s) => s.activeConversationId);
   const handleQuickReplyTap = React.useCallback(
@@ -5125,7 +5856,7 @@ function MessageList({
     },
     [client, activeConversationId]
   );
-  useEffect13(() => {
+  useEffect14(() => {
     const prevCount = prevItemCountRef.current;
     const newCount = items.length;
     prevItemCountRef.current = newCount;
@@ -5141,18 +5872,18 @@ function MessageList({
       isInitialLoadRef.current = false;
     }
   }, [items]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (streamingText) {
       bottomRef.current?.scrollIntoView({ behavior: "instant" });
     }
     hadStreamRef.current = !!streamingText;
   }, [streamingText]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (isTyping || isAiProcessing) {
       bottomRef.current?.scrollIntoView({ behavior: "smooth" });
     }
   }, [isTyping, isAiProcessing]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (!hasMore || !onLoadMore || !topRef.current) return;
     const observer = new IntersectionObserver(
       (entries) => {
@@ -5175,16 +5906,16 @@ function MessageList({
     return () => observer.disconnect();
   }, [hasMore, onLoadMore, isLoadingMore]);
   if (items.length === 0) {
-    return /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsx16(
       "div",
       {
         className: "hw-messages",
         role: "log",
         "aria-label": t("widget.aria_messages"),
         "aria-live": "polite",
-        children: /* @__PURE__ */ jsxs9("div", { className: "hw-empty", children: [
-          /* @__PURE__ */ jsx14("div", { className: "hw-empty-icon", children: /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ jsx14("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }) }),
-          /* @__PURE__ */ jsx14("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
+        children: /* @__PURE__ */ jsxs11("div", { className: "hw-empty", children: [
+          /* @__PURE__ */ jsx16("div", { className: "hw-empty-icon", children: /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ jsx16("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }) }),
+          /* @__PURE__ */ jsx16("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
         ] })
       }
     );
@@ -5194,7 +5925,7 @@ function MessageList({
   const yesterday = /* @__PURE__ */ new Date();
   yesterday.setDate(yesterday.getDate() - 1);
   const yesterdayKey = DATE_KEY_FMT.format(yesterday);
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs11(
     "div",
     {
       ref: containerRef,
@@ -5203,15 +5934,15 @@ function MessageList({
       "aria-label": t("widget.aria_messages"),
       "aria-live": "polite",
       children: [
-        /* @__PURE__ */ jsx14("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs9("div", { className: "hw-load-more-spinner", children: [
-          /* @__PURE__ */ jsx14("div", {}),
-          /* @__PURE__ */ jsx14("div", {}),
-          /* @__PURE__ */ jsx14("div", {})
+        /* @__PURE__ */ jsx16("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs11("div", { className: "hw-load-more-spinner", children: [
+          /* @__PURE__ */ jsx16("div", {}),
+          /* @__PURE__ */ jsx16("div", {}),
+          /* @__PURE__ */ jsx16("div", {})
         ] }) }),
         [
           ...items.map((item) => {
             if (item.type === "event") {
-              return /* @__PURE__ */ jsx14(
+              return /* @__PURE__ */ jsx16(
                 EventCard,
                 {
                   text: item.text ?? ""
@@ -5226,16 +5957,16 @@ function MessageList({
             const showDateSep = isNewBucket && dateKey !== todayKey;
             const dateLabel = dateKey === yesterdayKey ? t("widget.yesterday") : displayDateFormatter(getLocale()).format(itemDate);
             const sender = item.visitorId ? "visitor" : item.aiAgentId ? "ai" : "team";
-            return /* @__PURE__ */ jsxs9(
+            return /* @__PURE__ */ jsxs11(
               React.Fragment,
               {
                 children: [
-                  showDateSep && /* @__PURE__ */ jsxs9("div", { className: "hw-date-sep", children: [
-                    /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-line" }),
-                    /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-text", children: dateLabel }),
-                    /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-line" })
+                  showDateSep && /* @__PURE__ */ jsxs11("div", { className: "hw-date-sep", children: [
+                    /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-line" }),
+                    /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-text", children: dateLabel }),
+                    /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-line" })
                   ] }),
-                  /* @__PURE__ */ jsx14(
+                  /* @__PURE__ */ jsx16(
                     MessageBubble,
                     {
                       text: item.text ?? "",
@@ -5267,19 +5998,19 @@ function MessageList({
           				   its place, .hw-msg replayed hw-msg-appear (styles.css:1326), and the
           				   answer visibly animated in a second time just as it finished. */
           ...streamingText && activeConversationId ? [
-            /* @__PURE__ */ jsxs9(React.Fragment, { children: [
+            /* @__PURE__ */ jsxs11(React.Fragment, { children: [
               null,
-              /* @__PURE__ */ jsx14(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
+              /* @__PURE__ */ jsx16(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
             ] }, streamingKeyFor(activeConversationId))
           ] : []
         ],
         renderAfterMessages,
-        (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx14("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs9("div", { className: "hw-typing-dots", children: [
-          /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" }),
-          /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" }),
-          /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" })
+        (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx16("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs11("div", { className: "hw-typing-dots", children: [
+          /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" }),
+          /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" }),
+          /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" })
         ] }) }),
-        /* @__PURE__ */ jsx14("div", { ref: bottomRef })
+        /* @__PURE__ */ jsx16("div", { ref: bottomRef })
       ]
     }
   );
@@ -5297,8 +6028,8 @@ function EventCard({ text }) {
   const data = parseEventData(text);
   if (data) {
     const message = data.action === "joined" ? t("widget.joined") : t("widget.left");
-    return /* @__PURE__ */ jsxs9("div", { className: "hw-event hw-event--card", children: [
-      /* @__PURE__ */ jsx14("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsxs11("div", { className: "hw-event hw-event--card", children: [
+      /* @__PURE__ */ jsx16("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx16(
         "img",
         {
           src: data.image,
@@ -5306,20 +6037,20 @@ function EventCard({ text }) {
           className: "hw-event-avatar-img",
           referrerPolicy: "no-referrer"
         }
-      ) : /* @__PURE__ */ jsx14("span", { children: getInitials(data.name) }) }),
-      /* @__PURE__ */ jsxs9("div", { className: "hw-event-body", children: [
-        /* @__PURE__ */ jsx14("span", { className: "hw-event-name", children: data.name }),
+      ) : /* @__PURE__ */ jsx16("span", { children: getInitials(data.name) }) }),
+      /* @__PURE__ */ jsxs11("div", { className: "hw-event-body", children: [
+        /* @__PURE__ */ jsx16("span", { className: "hw-event-name", children: data.name }),
         " ",
-        /* @__PURE__ */ jsx14("span", { className: "hw-event-action", children: message })
+        /* @__PURE__ */ jsx16("span", { className: "hw-event-action", children: message })
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsx14("div", { className: "hw-event", children: /* @__PURE__ */ jsx14("div", { className: "hw-event-text", children: text }) });
+  return /* @__PURE__ */ jsx16("div", { className: "hw-event", children: /* @__PURE__ */ jsx16("div", { className: "hw-event-text", children: text }) });
 }
 
 // src/themed/message-preview.tsx
-import { useEffect as useEffect14, useState as useState14 } from "react";
-import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useEffect as useEffect15, useState as useState15 } from "react";
+import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 function MessagePreview({
   onOpen,
   avatar,
@@ -5334,8 +6065,8 @@ function MessagePreview({
   const client = useWidgetClient();
   const senderName = preview?.senderName || agentName;
   const senderImage = preview?.senderImage || null;
-  const [closing, setClosing] = useState14(false);
-  useEffect14(() => {
+  const [closing, setClosing] = useState15(false);
+  useEffect15(() => {
     if (!preview || preview.quickReplies) return;
     if (autoDismissMs == null || autoDismissMs <= 0) return;
     const timer = setTimeout(() => {
@@ -5376,7 +6107,7 @@ function MessagePreview({
   );
   const qr = preview.quickReplies && preview.quickReplies.options.length > 0 ? preview.quickReplies : null;
   const placementClass = placement === "anchored" ? "hw-preview--anchored " : "";
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs12(
     "div",
     {
       className: `hw-preview ${placementClass}${closing ? "hw-preview--closing" : ""}`,
@@ -5390,17 +6121,17 @@ function MessagePreview({
       role: "button",
       tabIndex: 0,
       children: [
-        /* @__PURE__ */ jsxs10("div", { className: "hw-preview-header", children: [
-          /* @__PURE__ */ jsx15("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx15("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
-          /* @__PURE__ */ jsx15("div", { className: "hw-preview-name", children: senderName }),
-          /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsxs12("div", { className: "hw-preview-header", children: [
+          /* @__PURE__ */ jsx17("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx17("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
+          /* @__PURE__ */ jsx17("div", { className: "hw-preview-name", children: senderName }),
+          /* @__PURE__ */ jsx17(
             "button",
             {
               type: "button",
               className: "hw-preview-close",
               onClick: handleClose,
               "aria-label": t("widget.aria_dismiss"),
-              children: /* @__PURE__ */ jsx15(XIcon, { size: 20 })
+              children: /* @__PURE__ */ jsx17(XIcon, { size: 20 })
             }
           )
         ] }),
@@ -5409,11 +6140,11 @@ function MessagePreview({
              consecutive messages, so two identical ones would already be a bug
              upstream, and an index key hands React the wrong bubble to reuse the
              moment a new message lands mid-animation. */
-          /* @__PURE__ */ jsx15("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
+          /* @__PURE__ */ jsx17("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
         )),
-        qr && /* @__PURE__ */ jsxs10(Fragment4, { children: [
-          qr.prompt && /* @__PURE__ */ jsx15("div", { className: "hw-preview-body", children: qr.prompt }),
-          /* @__PURE__ */ jsx15("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx15(
+        qr && /* @__PURE__ */ jsxs12(Fragment4, { children: [
+          qr.prompt && /* @__PURE__ */ jsx17("div", { className: "hw-preview-body", children: qr.prompt }),
+          /* @__PURE__ */ jsx17("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx17(
             "button",
             {
               type: "button",
@@ -5427,14 +6158,92 @@ function MessagePreview({
             opt.id
           )) })
         ] }),
-        footer != null && footer !== false && /* @__PURE__ */ jsx15("div", { className: "hw-preview-footer", children: footer })
+        footer != null && footer !== false && /* @__PURE__ */ jsx17("div", { className: "hw-preview-footer", children: footer })
       ]
     }
   );
 }
 
+// src/themed/resolved-banner.tsx
+import { useId, useState as useState16 } from "react";
+
+// src/themed/resolved-rating.ts
+function asCsatRating(value) {
+  return value === "good" || value === "bad" ? value : null;
+}
+async function saveRating(client, store, conversationId, rating) {
+  try {
+    await client.widget.sendCsat.mutate({ conversationId, rating });
+  } catch {
+    return false;
+  }
+  store.setState((s) => ({
+    conversations: s.conversations.map(
+      (c) => c.id === conversationId ? { ...c, csatRating: rating } : c
+    )
+  }));
+  return true;
+}
+
+// src/themed/resolved-banner.tsx
+import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+var OPTIONS = [
+  { value: "good", labelKey: "widget.aria_good", Icon: ThumbsUpIcon },
+  { value: "bad", labelKey: "widget.aria_bad", Icon: ThumbsDownIcon }
+];
+function ResolvedBlock({
+  rating,
+  failed = false,
+  onRate
+}) {
+  const labelId = useId();
+  return /* @__PURE__ */ jsxs13("div", { className: "hw-resolved", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "hw-resolved-status", role: "status", children: [
+      /* @__PURE__ */ jsx18(CheckCircleIcon, { size: 16 }),
+      /* @__PURE__ */ jsx18("span", { children: t("widget.resolved_text") })
+    ] }),
+    /* @__PURE__ */ jsxs13("div", { className: "hw-csat", role: "group", "aria-labelledby": labelId, children: [
+      /* @__PURE__ */ jsx18("span", { className: "hw-csat-label", id: labelId, children: rating ? t("widget.csat_thanks") : t("widget.csat_label") }),
+      /* @__PURE__ */ jsx18("span", { className: "hw-csat-buttons", children: OPTIONS.filter((o) => !rating || o.value === rating).map(({ value, labelKey, Icon }) => /* @__PURE__ */ jsxs13(
+        "button",
+        {
+          type: "button",
+          className: "hw-csat-btn",
+          "aria-pressed": rating === value,
+          "aria-disabled": rating ? true : void 0,
+          onClick: rating ? void 0 : () => onRate(value),
+          children: [
+            /* @__PURE__ */ jsx18(Icon, { size: 14 }),
+            t(labelKey)
+          ]
+        },
+        value
+      )) })
+    ] }),
+    failed && !rating && /* @__PURE__ */ jsx18("div", { className: "hw-csat-error", role: "alert", children: t("widget.csat_error") })
+  ] });
+}
+function ResolvedBanner({ conversationId }) {
+  const { client, store } = useWidgetContext();
+  const saved = useWidgetStore(
+    (s) => asCsatRating(s.conversations.find((c) => c.id === conversationId)?.csatRating)
+  );
+  const [pending, setPending] = useState16(null);
+  const [failed, setFailed] = useState16(false);
+  const rate = (rating) => {
+    setPending(rating);
+    setFailed(false);
+    void saveRating(client, store, conversationId, rating).then((ok) => {
+      if (ok) return;
+      setPending(null);
+      setFailed(true);
+    });
+  };
+  return /* @__PURE__ */ jsx18(ResolvedBlock, { rating: saved ?? pending, failed, onRate: rate });
+}
+
 // src/themed/default-widget.tsx
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 function resolveLabel2(label) {
   if (!label.startsWith("widget.")) return label;
   const resolved = t(label);
@@ -5446,7 +6255,7 @@ var EMPTY_CONTENT_TABS = [];
 var DEFAULT_EN_WELCOME = "Hi there \u{1F44B}\nHow can we help?";
 var DEFAULT_EN_SUBTITLE = "Usually replies in minutes";
 function HelpwayMark({ className }) {
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx19(
     "svg",
     {
       className,
@@ -5456,7 +6265,7 @@ function HelpwayMark({ className }) {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx16(
+      children: /* @__PURE__ */ jsx19(
         "path",
         {
           d: "M28.7 0H12.8L0 12.8V28.7L12.8 41.5H28.7L41.5 28.7V12.8L28.7 0ZM15 28.9L6.80002 20.7L15 12.5C18.1 9.4 23.2 9.4 26.3 12.5L34.5 20.7L26.3 28.9C23.2 32 18.2 32 15 28.9Z",
@@ -5483,7 +6292,7 @@ function WidgetLogo({
   });
   const logoClass = forceAgent ? "hw-agent-img--logo" : "";
   if (!forceAgent && activeId && assignee?.assigneeImage) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "img",
       {
         src: assignee.assigneeImage,
@@ -5494,7 +6303,7 @@ function WidgetLogo({
     );
   }
   if (customAvatar) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "span",
       {
         className: `hw-agent-icon hw-agent-custom ${className ?? ""}`,
@@ -5504,7 +6313,7 @@ function WidgetLogo({
     );
   }
   if (agentConfig?.avatarUrl) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "img",
       {
         src: agentConfig.avatarUrl,
@@ -5514,7 +6323,7 @@ function WidgetLogo({
     );
   }
   if (agentConfig?.avatarPreset) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "div",
       {
         className: `hw-agent-icon ${className ?? ""}`,
@@ -5525,20 +6334,20 @@ function WidgetLogo({
           justifyContent: "center",
           borderRadius: 8
         },
-        children: /* @__PURE__ */ jsx16(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
+        children: /* @__PURE__ */ jsx19(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
       }
     );
   }
   if (logoUrl) {
-    return /* @__PURE__ */ jsx16("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
+    return /* @__PURE__ */ jsx19("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
   }
-  return /* @__PURE__ */ jsx16(HelpwayMark, { className });
+  return /* @__PURE__ */ jsx19(HelpwayMark, { className });
 }
 function LauncherIcon({ className }) {
   const agentConfig = useWidgetStore((s) => s.agentConfig);
-  const [imgLoaded, setImgLoaded] = useState15(false);
+  const [imgLoaded, setImgLoaded] = useState17(false);
   const imgSrc = agentConfig?.launcherIconUrl ?? null;
-  useEffect15(() => {
+  useEffect16(() => {
     if (!imgSrc) return;
     setImgLoaded(false);
     const img = new Image();
@@ -5551,7 +6360,7 @@ function LauncherIcon({ className }) {
     img.onerror = () => setImgLoaded(true);
   }, [imgSrc]);
   if (imgSrc) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "img",
       {
         src: imgSrc,
@@ -5561,7 +6370,7 @@ function LauncherIcon({ className }) {
       }
     );
   }
-  return /* @__PURE__ */ jsx16(WidgetLogo, { className, forceAgent: true });
+  return /* @__PURE__ */ jsx19(WidgetLogo, { className, forceAgent: true });
 }
 var PRESET_SVG = {
   // Helpway brand mark — octagonal chamfer with stylized "W" inside.
@@ -5620,7 +6429,7 @@ function AgentPresetIcon({ presetId }) {
   const svgContent = PRESET_SVG[presetId] ?? PRESET_SVG.sparkle;
   return (
     // biome-ignore lint: trusted static SVG content from our icon library
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx19(
       "svg",
       {
         viewBox: "0 0 24 24",
@@ -5633,8 +6442,8 @@ function AgentPresetIcon({ presetId }) {
   );
 }
 function CloseGlyph({ docked }) {
-  if (!docked) return /* @__PURE__ */ jsx16(XIcon, { size: 20 });
-  return /* @__PURE__ */ jsx16(
+  if (!docked) return /* @__PURE__ */ jsx19(XIcon, { size: 20 });
+  return /* @__PURE__ */ jsx19(
     "svg",
     {
       width: "20",
@@ -5646,7 +6455,7 @@ function CloseGlyph({ docked }) {
       strokeLinecap: "round",
       strokeLinejoin: "round",
       "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx16("path", { d: "M6 9.5 12 15.5 18 9.5" })
+      children: /* @__PURE__ */ jsx19("path", { d: "M6 9.5 12 15.5 18 9.5" })
     }
   );
 }
@@ -5659,7 +6468,15 @@ function DefaultWidget({
   const { isReady, website, agentConfig } = useWidget();
   const customAvatar = useContext2(AgentAvatarContext);
   useI18n();
-  const { client, store, hasBootstrapError, wsDisconnected, retryBootstrap } = useWidgetContext();
+  const {
+    client,
+    store,
+    hasBootstrapError,
+    wsDisconnected,
+    wsLost,
+    retryConnection,
+    retryBootstrap
+  } = useWidgetContext();
   const { conversations, create, isCreating, setActiveConversation } = useConversations();
   const activeId = useWidgetStore((s) => s.activeConversationId);
   const isDismissed = useWidgetStore((s) => s.isDismissed);
@@ -5678,22 +6495,22 @@ function DefaultWidget({
     });
   }
   const storeIsOpen = useWidgetStore((s) => s.isOpen);
-  const [isClosing, setIsClosing] = useState15(false);
+  const [isClosing, setIsClosing] = useState17(false);
   const isOpen = storeIsOpen || isClosing;
-  const [activeTab, setActiveTab] = useState15("home");
-  const [subView, setSubView] = useState15(null);
-  const [newText, setNewText] = useState15("");
-  const [contentDetailSlug, setContentDetailSlug] = useState15(null);
-  const [contentCategoryName, setContentCategoryName] = useState15(null);
-  const prevActiveIdRef = useRef15(activeId);
-  useEffect15(() => {
+  const [activeTab, setActiveTab] = useState17("home");
+  const [subView, setSubView] = useState17(null);
+  const [newText, setNewText] = useState17("");
+  const [contentDetailSlug, setContentDetailSlug] = useState17(null);
+  const [contentCategoryName, setContentCategoryName] = useState17(null);
+  const prevActiveIdRef = useRef17(activeId);
+  useEffect16(() => {
     if (activeId && activeId !== prevActiveIdRef.current && subView !== "conversation") {
       setSubView("conversation");
     }
     prevActiveIdRef.current = activeId;
   }, [activeId, subView]);
   const prefill = useWidgetStore((s) => s.newConversationPrefill);
-  useEffect15(() => {
+  useEffect16(() => {
     if (prefill !== null) {
       if (prefill.length > 0) setNewText(prefill);
       setSubView("new");
@@ -5701,18 +6518,18 @@ function DefaultWidget({
       store.getState().setNewConversationPrefill(null);
     }
   }, [prefill, store]);
-  const closeTimerRef = useRef15(void 0);
+  const closeTimerRef = useRef17(void 0);
   const welcomeMsgRaw = agentConfig?.welcomeMessage;
   const welcomeIsFactoryDefault = !welcomeMsgRaw || welcomeMsgRaw === DEFAULT_EN_WELCOME;
   const welcomeMessage = welcomeMsgRaw?.startsWith("widget.") ? t(welcomeMsgRaw) : welcomeIsFactoryDefault ? t("widget.welcome_message") : welcomeMsgRaw;
-  const openConversation = useCallback13(
+  const openConversation = useCallback14(
     (id) => {
       setActiveConversation(id);
       setSubView("conversation");
     },
     [setActiveConversation]
   );
-  const openNewConversation = useCallback13(() => {
+  const openNewConversation = useCallback14(() => {
     const agentId = agentConfig?.id;
     if (!agentId) {
       setSubView("new");
@@ -5738,8 +6555,8 @@ function DefaultWidget({
     setActiveConversation(tempId);
     setSubView("conversation");
   }, [agentConfig?.id, store, setActiveConversation, welcomeMessage]);
-  const didAutoOpenRef = useRef15(false);
-  useEffect15(() => {
+  const didAutoOpenRef = useRef17(false);
+  useEffect16(() => {
     if (!isOpen) {
       didAutoOpenRef.current = false;
       return;
@@ -5752,19 +6569,19 @@ function DefaultWidget({
     else openNewConversation();
   }, [isOpen, isReady, subView, conversations, openConversation, openNewConversation]);
   const dockComposer = useComposer(activeId);
-  const dockRef = useRef15(dockComposer);
-  useEffect15(() => {
+  const dockRef = useRef17(dockComposer);
+  useEffect16(() => {
     dockRef.current = dockComposer;
   });
-  const pendingDockText = useRef15(null);
-  const reopenFromDock = useCallback13(() => {
+  const pendingDockText = useRef17(null);
+  const reopenFromDock = useCallback14(() => {
     const state = store.getState();
     if (state.isOpen) return;
     const resumable = state.conversations.some((conv) => !conv.id.startsWith("temp-"));
     if (!resumable) return;
     state.setOpen(true);
   }, [store]);
-  const submitFromDock = useCallback13(
+  const submitFromDock = useCallback14(
     (override) => {
       const text = (override ?? dockRef.current.text).trim();
       const stagedAttachment = dockRef.current.attachments.some((a) => a.part !== null);
@@ -5786,14 +6603,14 @@ function DefaultWidget({
     },
     [activeId, openNewConversation, store]
   );
-  useEffect15(() => {
+  useEffect16(() => {
     if (!activeId || pendingDockText.current == null) return;
     const text = pendingDockText.current;
     pendingDockText.current = null;
     void dockRef.current.submit({ text, conversationId: activeId });
   }, [activeId]);
-  const [menuOpen, setMenuOpen] = useState15(false);
-  useEffect15(() => {
+  const [menuOpen, setMenuOpen] = useState17(false);
+  useEffect16(() => {
     if (!menuOpen) return;
     const close = () => setMenuOpen(false);
     const onKey = (event) => {
@@ -5806,7 +6623,7 @@ function DefaultWidget({
       document.removeEventListener("keydown", onKey);
     };
   }, [menuOpen]);
-  const goBack = useCallback13(() => {
+  const goBack = useCallback14(() => {
     if (subView === "content-detail") {
       const tabId = activeTab.startsWith("content:") ? activeTab.slice(8) : null;
       const activeContentTab = tabId ? contentTabs.find((t2) => t2.id === tabId) : null;
@@ -5833,7 +6650,7 @@ function DefaultWidget({
     setActiveConversation(null);
     setSubView(null);
   }, [setActiveConversation, subView, activeTab, contentTabs, contentCategoryName, client, store]);
-  const switchTab = useCallback13(
+  const switchTab = useCallback14(
     (tab) => {
       tabStateRef.current[activeTab] = { subView, activeId };
       const saved = tabStateRef.current[tab];
@@ -5848,7 +6665,7 @@ function DefaultWidget({
     [activeTab, subView, activeId, setActiveConversation]
   );
   const pendingContentDetail = useWidgetStore((s) => s.pendingContentDetail);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!pendingContentDetail) return;
     const { slug, tabId } = pendingContentDetail;
     markEntrySeen(slug);
@@ -5858,7 +6675,7 @@ function DefaultWidget({
     store.getState().setPendingContentDetail(null);
   }, [pendingContentDetail, markEntrySeen, switchTab, store]);
   const setStoreOpen = useWidgetStore((s) => s.setOpen);
-  const handleBubbleClick = useCallback13(() => {
+  const handleBubbleClick = useCallback14(() => {
     if (storeIsOpen) {
       const leavingId = store.getState().activeConversationId;
       if (leavingId && !leavingId.startsWith("temp-")) {
@@ -5878,7 +6695,7 @@ function DefaultWidget({
       setStoreOpen(true);
     }
   }, [storeIsOpen, setStoreOpen, client, store]);
-  const handleClose = useCallback13(() => {
+  const handleClose = useCallback14(() => {
     const leavingId = store.getState().activeConversationId;
     if (leavingId && !leavingId.startsWith("temp-")) {
       store.getState().clearUnread(leavingId);
@@ -5891,7 +6708,7 @@ function DefaultWidget({
       setStoreOpen(false);
     }, 200);
   }, [setStoreOpen, client, store]);
-  const handleNewConversation = useCallback13(async () => {
+  const handleNewConversation = useCallback14(async () => {
     const trimmed = newText.trim();
     if (!trimmed || isCreating) return;
     const conv = await create(trimmed);
@@ -5900,16 +6717,16 @@ function DefaultWidget({
       setSubView("conversation");
     }
   }, [newText, isCreating, create]);
-  const windowRef = useRef15(null);
-  const bubbleRef = useRef15(null);
-  const tabStateRef = useRef15({});
-  const touchStartY = useRef15(0);
-  const touchDeltaY = useRef15(0);
-  const handleTouchStart = useCallback13((e) => {
+  const windowRef = useRef17(null);
+  const bubbleRef = useRef17(null);
+  const tabStateRef = useRef17({});
+  const touchStartY = useRef17(0);
+  const touchDeltaY = useRef17(0);
+  const handleTouchStart = useCallback14((e) => {
     touchStartY.current = e.touches[0]?.clientY ?? 0;
     touchDeltaY.current = 0;
   }, []);
-  const handleTouchMove = useCallback13((e) => {
+  const handleTouchMove = useCallback14((e) => {
     const delta = (e.touches[0]?.clientY ?? 0) - touchStartY.current;
     touchDeltaY.current = delta;
     if (delta > 0 && windowRef.current) {
@@ -5917,7 +6734,7 @@ function DefaultWidget({
       windowRef.current.style.opacity = `${Math.max(1 - delta / 400, 0.5)}`;
     }
   }, []);
-  const handleTouchEnd = useCallback13(() => {
+  const handleTouchEnd = useCallback14(() => {
     if (windowRef.current) {
       windowRef.current.style.transform = "";
       windowRef.current.style.opacity = "";
@@ -5926,13 +6743,14 @@ function DefaultWidget({
       handleClose();
     }
   }, [handleClose]);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!isOpen || !windowRef.current) return;
     const vv = window.visualViewport;
     if (!vv) return;
     const win = windowRef.current;
     const applyHeight = () => {
       win.style.setProperty("--hw-visible-height", `${vv.height}px`);
+      win.toggleAttribute("data-hw-keyboard", window.innerHeight - vv.height > 120);
     };
     applyHeight();
     vv.addEventListener("resize", applyHeight);
@@ -5941,9 +6759,10 @@ function DefaultWidget({
       vv.removeEventListener("resize", applyHeight);
       vv.removeEventListener("scroll", applyHeight);
       win.style.removeProperty("--hw-visible-height");
+      win.removeAttribute("data-hw-keyboard");
     };
   }, [isOpen]);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!isOpen || !windowRef.current) return;
     const win = windowRef.current;
     const handleKeyDown = (e) => {
@@ -5959,7 +6778,7 @@ function DefaultWidget({
     win.addEventListener("keydown", handleKeyDown);
     return () => win.removeEventListener("keydown", handleKeyDown);
   }, [isOpen, subView, handleClose, goBack]);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!isOpen || !windowRef.current || hideLauncher) return;
     const win = windowRef.current;
     const getFocusable = () => win.querySelectorAll(
@@ -6002,7 +6821,7 @@ function DefaultWidget({
   const launcherStyle = agentConfig?.launcherStyle ?? "icon";
   const bubbleStyle = agentConfig?.bubbleStyle ?? "rounded";
   const hasUploadedAvatar = !!agentConfig?.avatarUrl;
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "hw-widget",
@@ -6018,7 +6837,7 @@ function DefaultWidget({
         "--hw-window-left": widgetPosition === "bottom-left" ? "0" : "auto"
       },
       children: [
-        placement === "docked" && isReady && /* @__PURE__ */ jsx16(
+        placement === "docked" && isReady && /* @__PURE__ */ jsx19(
           DockedBar,
           {
             value: dockComposer.text,
@@ -6033,19 +6852,20 @@ function DefaultWidget({
             onReopen: reopenFromDock,
             sendError: dockComposer.sendError,
             onClearSendError: dockComposer.clearSendError,
-            leading: customAvatar
+            leading: customAvatar,
+            placeholder: conversations.find((c) => c.id === activeId)?.status === "resolved" ? t("widget.placeholder_resolved") : void 0
           }
         ),
-        isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx16("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-loading", children: [
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
+        isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx19("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-loading", children: [
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
         ] }) }),
-        isOpen && hasBootstrapError && /* @__PURE__ */ jsx16("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs11("div", { className: "hw-bootstrap-error", children: [
-          /* @__PURE__ */ jsx16("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
-          /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
+        isOpen && hasBootstrapError && /* @__PURE__ */ jsx19("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs14("div", { className: "hw-bootstrap-error", children: [
+          /* @__PURE__ */ jsx19("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
+          /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
         ] }) }),
-        isOpen && isReady && /* @__PURE__ */ jsxs11(
+        isOpen && isReady && /* @__PURE__ */ jsxs14(
           "div",
           {
             ref: windowRef,
@@ -6057,24 +6877,28 @@ function DefaultWidget({
             onTouchMove: handleTouchMove,
             onTouchEnd: handleTouchEnd,
             children: [
-              /* @__PURE__ */ jsx16("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx16("div", { className: "hw-drag-handle-pill" }) }),
-              wsDisconnected && /* @__PURE__ */ jsxs11("div", { className: "hw-disconnect", children: [
-                /* @__PURE__ */ jsx16("div", { className: "hw-disconnect-spinner" }),
-                t("widget.reconnecting")
-              ] }),
+              /* @__PURE__ */ jsx19("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx19("div", { className: "hw-drag-handle-pill" }) }),
+              /* @__PURE__ */ jsx19(
+                ConnectionStrip,
+                {
+                  reconnecting: wsDisconnected,
+                  lost: wsLost,
+                  onRetry: retryConnection
+                }
+              ),
               (subView === "content-detail" || subView === "content-category") && (() => {
                 const tabId = activeTab.replace("content:", "");
                 const contentTab = contentTabs.find((t2) => t2.id === tabId);
                 const headerTitle = subView === "content-category" && contentCategoryName ? contentCategoryName : contentTab?.label ? resolveLabel2(contentTab.label) : t("widget.content");
-                return /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
-                  /* @__PURE__ */ jsx16(
+                return /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
+                  /* @__PURE__ */ jsx19(
                     "button",
                     {
                       type: "button",
                       className: "hw-header-back",
                       onClick: goBack,
                       "aria-label": t("widget.aria_back"),
-                      children: /* @__PURE__ */ jsx16(
+                      children: /* @__PURE__ */ jsx19(
                         "svg",
                         {
                           viewBox: "0 0 24 24",
@@ -6083,33 +6907,33 @@ function DefaultWidget({
                           strokeWidth: 2,
                           strokeLinecap: "round",
                           strokeLinejoin: "round",
-                          children: /* @__PURE__ */ jsx16("path", { d: "M15 18l-6-6 6-6" })
+                          children: /* @__PURE__ */ jsx19("path", { d: "M15 18l-6-6 6-6" })
                         }
                       )
                     }
                   ),
-                  /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: headerTitle }),
-                  /* @__PURE__ */ jsx16(
+                  /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: headerTitle }),
+                  /* @__PURE__ */ jsx19(
                     "button",
                     {
                       type: "button",
                       className: "hw-header-close",
                       onClick: handleClose,
                       "aria-label": t("widget.aria_close"),
-                      children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
+                      children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
                     }
                   )
                 ] });
               })(),
-              subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--sub", children: [
-                /* @__PURE__ */ jsx16(
+              subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--sub", children: [
+                /* @__PURE__ */ jsx19(
                   "button",
                   {
                     type: "button",
                     className: "hw-header-back",
                     onClick: goBack,
                     "aria-label": t("widget.aria_back"),
-                    children: /* @__PURE__ */ jsx16(
+                    children: /* @__PURE__ */ jsx19(
                       "svg",
                       {
                         viewBox: "0 0 24 24",
@@ -6118,26 +6942,34 @@ function DefaultWidget({
                         strokeWidth: 2,
                         strokeLinecap: "round",
                         strokeLinejoin: "round",
-                        children: /* @__PURE__ */ jsx16("path", { d: "M15 18l-6-6 6-6" })
+                        children: /* @__PURE__ */ jsx19("path", { d: "M15 18l-6-6 6-6" })
                       }
                     )
                   }
                 ),
-                /* @__PURE__ */ jsxs11("div", { className: "hw-header-identity", children: [
-                  /* @__PURE__ */ jsx16(
+                /* @__PURE__ */ jsxs14("div", { className: "hw-header-identity", children: [
+                  /* @__PURE__ */ jsx19(
                     "div",
                     {
                       className: `hw-header-bot-icon${hasTeamAgent ? " hw-header-bot-icon--team" : ""}`,
-                      children: hasTeamAgent && humanImage ? /* @__PURE__ */ jsx16("img", { src: humanImage, alt: headerName, className: "hw-header-agent-img", referrerPolicy: "no-referrer" }) : hasTeamAgent ? /* @__PURE__ */ jsx16("span", { className: "hw-header-agent-initials", children: headerName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx16(WidgetLogo, {})
+                      children: hasTeamAgent && humanImage ? /* @__PURE__ */ jsx19(
+                        "img",
+                        {
+                          src: humanImage,
+                          alt: headerName,
+                          className: "hw-header-agent-img",
+                          referrerPolicy: "no-referrer"
+                        }
+                      ) : hasTeamAgent ? /* @__PURE__ */ jsx19("span", { className: "hw-header-agent-initials", children: headerName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx19(WidgetLogo, {})
                     }
                   ),
-                  /* @__PURE__ */ jsxs11("div", { className: "hw-header-info", children: [
-                    /* @__PURE__ */ jsx16("div", { className: "hw-header-name", children: headerName }),
-                    /* @__PURE__ */ jsx16("div", { className: "hw-header-status", children: subtitleText })
+                  /* @__PURE__ */ jsxs14("div", { className: "hw-header-info", children: [
+                    /* @__PURE__ */ jsx19("div", { className: "hw-header-name", children: headerName }),
+                    /* @__PURE__ */ jsx19("div", { className: "hw-header-status", children: subtitleText })
                   ] })
                 ] }),
-                /* @__PURE__ */ jsxs11("div", { className: "hw-header-actions", children: [
-                  /* @__PURE__ */ jsx16(
+                /* @__PURE__ */ jsxs14("div", { className: "hw-header-actions", children: [
+                  /* @__PURE__ */ jsx19(
                     "button",
                     {
                       type: "button",
@@ -6149,21 +6981,21 @@ function DefaultWidget({
                         event.stopPropagation();
                         setMenuOpen((open) => !open);
                       },
-                      children: /* @__PURE__ */ jsx16(DotsIcon, { size: 18 })
+                      children: /* @__PURE__ */ jsx19(DotsIcon, { size: 18 })
                     }
                   ),
-                  /* @__PURE__ */ jsx16(
+                  /* @__PURE__ */ jsx19(
                     "button",
                     {
                       type: "button",
                       className: "hw-header-close",
                       onClick: handleClose,
                       "aria-label": t("widget.aria_close"),
-                      children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
+                      children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
                     }
                   ),
-                  menuOpen && /* @__PURE__ */ jsxs11("div", { className: "hw-header-menu", role: "menu", children: [
-                    conversations.length > 0 && /* @__PURE__ */ jsx16("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs11(
+                  menuOpen && /* @__PURE__ */ jsxs14("div", { className: "hw-header-menu", role: "menu", children: [
+                    conversations.length > 0 && /* @__PURE__ */ jsx19("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs14(
                       "button",
                       {
                         type: "button",
@@ -6175,16 +7007,16 @@ function DefaultWidget({
                           openConversation(conv.id);
                         },
                         children: [
-                          /* @__PURE__ */ jsxs11("span", { className: "hw-header-menu-conv-top", children: [
-                            /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
-                            conv.lastMessageAt && /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
+                          /* @__PURE__ */ jsxs14("span", { className: "hw-header-menu-conv-top", children: [
+                            /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
+                            conv.lastMessageAt && /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
                           ] }),
-                          /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
+                          /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
                         ]
                       },
                       conv.id
                     )) }),
-                    /* @__PURE__ */ jsxs11(
+                    /* @__PURE__ */ jsxs14(
                       "button",
                       {
                         type: "button",
@@ -6194,7 +7026,7 @@ function DefaultWidget({
                           openNewConversation();
                         },
                         children: [
-                          /* @__PURE__ */ jsx16(NewChatIcon, { size: 16 }),
+                          /* @__PURE__ */ jsx19(NewChatIcon, { size: 16 }),
                           t("widget.new_conversation")
                         ]
                       }
@@ -6202,43 +7034,43 @@ function DefaultWidget({
                   ] })
                 ] })
               ] }),
-              subView === null && activeTab === "home" && /* @__PURE__ */ jsxs11(Fragment5, { children: [
-                /* @__PURE__ */ jsxs11("div", { className: "hw-hero", children: [
-                  /* @__PURE__ */ jsxs11("div", { className: "hw-hero-top", children: [
-                    /* @__PURE__ */ jsx16("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx16(WidgetLogo, {}) }),
-                    /* @__PURE__ */ jsx16(
+              subView === null && activeTab === "home" && /* @__PURE__ */ jsxs14(Fragment5, { children: [
+                /* @__PURE__ */ jsxs14("div", { className: "hw-hero", children: [
+                  /* @__PURE__ */ jsxs14("div", { className: "hw-hero-top", children: [
+                    /* @__PURE__ */ jsx19("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx19(WidgetLogo, {}) }),
+                    /* @__PURE__ */ jsx19(
                       "button",
                       {
                         type: "button",
                         className: "hw-hero-close",
                         onClick: handleClose,
                         "aria-label": t("widget.aria_close"),
-                        children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
+                        children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsx16("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs11(
+                  /* @__PURE__ */ jsx19("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs14(
                     "span",
                     {
                       className: i === 0 ? "hw-hero-greeting-name" : "hw-hero-greeting-question",
                       children: [
-                        i > 0 && /* @__PURE__ */ jsx16("br", {}),
+                        i > 0 && /* @__PURE__ */ jsx19("br", {}),
                         line
                       ]
                     },
                     i
                   )) }),
-                  /* @__PURE__ */ jsx16("div", { className: "hw-hero-subtitle", children: subtitleText })
+                  /* @__PURE__ */ jsx19("div", { className: "hw-hero-subtitle", children: subtitleText })
                 ] }),
-                /* @__PURE__ */ jsx16("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs11("div", { className: "hw-sheet-inner", children: [
-                  /* @__PURE__ */ jsxs11("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
-                    /* @__PURE__ */ jsxs11("div", { className: "hw-card-body", children: [
-                      /* @__PURE__ */ jsx16("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
-                      /* @__PURE__ */ jsx16("div", { className: "hw-card-meta", children: t("widget.reply_time") })
+                /* @__PURE__ */ jsx19("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs14("div", { className: "hw-sheet-inner", children: [
+                  /* @__PURE__ */ jsxs14("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
+                    /* @__PURE__ */ jsxs14("div", { className: "hw-card-body", children: [
+                      /* @__PURE__ */ jsx19("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
+                      /* @__PURE__ */ jsx19("div", { className: "hw-card-meta", children: t("widget.reply_time") })
                     ] }),
-                    /* @__PURE__ */ jsx16("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx16(SendIcon, {}) })
+                    /* @__PURE__ */ jsx19("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx19(SendIcon, {}) })
                   ] }),
-                  announcementTabs.length > 0 && /* @__PURE__ */ jsx16(
+                  announcementTabs.length > 0 && /* @__PURE__ */ jsx19(
                     WhatsNewCard,
                     {
                       getUnseenEntries,
@@ -6254,7 +7086,7 @@ function DefaultWidget({
                       }
                     }
                   ),
-                  /* @__PURE__ */ jsx16(
+                  /* @__PURE__ */ jsx19(
                     HomeView,
                     {
                       conversations,
@@ -6264,17 +7096,17 @@ function DefaultWidget({
                   )
                 ] }) })
               ] }),
-              subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
-                /* @__PURE__ */ jsx16("div", { className: "hw-header-spacer" }),
-                /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: t("widget.messages") }),
-                /* @__PURE__ */ jsx16(
+              subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
+                /* @__PURE__ */ jsx19("div", { className: "hw-header-spacer" }),
+                /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: t("widget.messages") }),
+                /* @__PURE__ */ jsx19(
                   "button",
                   {
                     type: "button",
                     className: "hw-header-close",
                     onClick: handleClose,
                     "aria-label": t("widget.aria_close"),
-                    children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
+                    children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
                   }
                 )
               ] }),
@@ -6282,23 +7114,23 @@ function DefaultWidget({
                 const tabId = activeTab.replace("content:", "");
                 const contentTab = contentTabs.find((t2) => t2.id === tabId);
                 if (!contentTab) return null;
-                return /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
-                  /* @__PURE__ */ jsx16("div", { className: "hw-header-spacer" }),
-                  /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
-                  /* @__PURE__ */ jsx16(
+                return /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
+                  /* @__PURE__ */ jsx19("div", { className: "hw-header-spacer" }),
+                  /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
+                  /* @__PURE__ */ jsx19(
                     "button",
                     {
                       type: "button",
                       className: "hw-header-close",
                       onClick: handleClose,
                       "aria-label": t("widget.aria_close"),
-                      children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
+                      children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
                     }
                   )
                 ] });
               })(),
-              (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs11("div", { className: "hw-content", children: [
-                subView === null && activeTab === "messages" && /* @__PURE__ */ jsx16(
+              (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs14("div", { className: "hw-content", children: [
+                subView === null && activeTab === "messages" && /* @__PURE__ */ jsx19(
                   MessagesView,
                   {
                     conversations,
@@ -6306,7 +7138,7 @@ function DefaultWidget({
                     onNewClick: openNewConversation
                   }
                 ),
-                subView === "new" && /* @__PURE__ */ jsx16(
+                subView === "new" && /* @__PURE__ */ jsx19(
                   NewConversationView,
                   {
                     text: newText,
@@ -6316,12 +7148,12 @@ function DefaultWidget({
                     welcomeMessage
                   }
                 ),
-                subView === "conversation" && activeId && /* @__PURE__ */ jsx16(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
+                subView === "conversation" && activeId && /* @__PURE__ */ jsx19(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
                 activeTab.startsWith("content:") && (() => {
                   const tabId = activeTab.replace("content:", "");
                   const contentTab = contentTabs.find((t2) => t2.id === tabId);
                   if (!contentTab) return null;
-                  return /* @__PURE__ */ jsx16(
+                  return /* @__PURE__ */ jsx19(
                     ContentTabView,
                     {
                       tab: contentTab,
@@ -6341,7 +7173,7 @@ function DefaultWidget({
                   );
                 })()
               ] }),
-              showTabBar && /* @__PURE__ */ jsx16(
+              showTabBar && /* @__PURE__ */ jsx19(
                 TabBar,
                 {
                   activeTab,
@@ -6352,20 +7184,20 @@ function DefaultWidget({
                   unseenAnnouncementCount
                 }
               ),
-              /* @__PURE__ */ jsxs11("div", { className: "hw-powered", children: [
+              /* @__PURE__ */ jsxs14("div", { className: "hw-powered", children: [
                 t("widget.powered_by"),
                 " ",
-                /* @__PURE__ */ jsx16("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
+                /* @__PURE__ */ jsx19("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
               ] })
             ]
           }
         ),
-        isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs11("div", { className: "hw-preview-dock", children: [
-          /* @__PURE__ */ jsx16(
+        isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs14("div", { className: "hw-preview-dock", children: [
+          /* @__PURE__ */ jsx19(
             AnnouncementPreviews,
             {
               maxVisible: incomingPreview ? 1 : 2,
-              avatar: /* @__PURE__ */ jsx16(WidgetLogo, {}),
+              avatar: /* @__PURE__ */ jsx19(WidgetLogo, {}),
               onOpen: (slug, tabId) => {
                 markEntrySeen(slug);
                 handleBubbleClick();
@@ -6377,10 +7209,10 @@ function DefaultWidget({
               }
             }
           ),
-          /* @__PURE__ */ jsx16(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx16(WidgetLogo, {}), autoDismissMs: null })
+          /* @__PURE__ */ jsx19(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx19(WidgetLogo, {}), autoDismissMs: null })
         ] }),
-        /* @__PURE__ */ jsx16(WidgetDebugOverlay, {}),
-        isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs11(
+        /* @__PURE__ */ jsx19(WidgetDebugOverlay, {}),
+        isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs14(
           "button",
           {
             ref: bubbleRef,
@@ -6397,24 +7229,24 @@ function DefaultWidget({
             "aria-expanded": isOpen,
             "aria-haspopup": "dialog",
             children: [
-              /* @__PURE__ */ jsx16(
+              /* @__PURE__ */ jsx19(
                 "span",
                 {
                   className: `hw-bubble-icon hw-bubble-icon--bot ${isOpen ? "hw-bubble-icon--hidden" : ""}`,
-                  children: /* @__PURE__ */ jsx16(LauncherIcon, {})
+                  children: /* @__PURE__ */ jsx19(LauncherIcon, {})
                 }
               ),
-              /* @__PURE__ */ jsx16(
+              /* @__PURE__ */ jsx19(
                 "span",
                 {
                   className: `hw-bubble-icon hw-bubble-icon--close ${!isOpen ? "hw-bubble-icon--hidden" : ""}`,
-                  children: /* @__PURE__ */ jsx16(XIcon, { size: 24 })
+                  children: /* @__PURE__ */ jsx19(XIcon, { size: 24 })
                 }
               ),
-              launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx16("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
-              !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs11("div", { className: "hw-bubble-badge", children: [
+              launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx19("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
+              !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs14("div", { className: "hw-bubble-badge", children: [
                 totalUnread > 0 ? totalUnread : "",
-                totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx16("span", { className: "hw-bubble-badge-dot" })
+                totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx19("span", { className: "hw-bubble-badge-dot" })
               ] })
             ]
           }
@@ -6431,8 +7263,8 @@ function TabBar({
   showMessagesTab = true,
   unseenAnnouncementCount = 0
 }) {
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-tabs", role: "tablist", children: [
-    /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs14("div", { className: "hw-tabs", role: "tablist", children: [
+    /* @__PURE__ */ jsxs14(
       "button",
       {
         type: "button",
@@ -6441,12 +7273,12 @@ function TabBar({
         role: "tab",
         "aria-selected": activeTab === "home",
         children: [
-          /* @__PURE__ */ jsx16(HomeIcon, {}),
-          /* @__PURE__ */ jsx16("span", { children: t("widget.home") })
+          /* @__PURE__ */ jsx19(HomeIcon, {}),
+          /* @__PURE__ */ jsx19("span", { children: t("widget.home") })
         ]
       }
     ),
-    showMessagesTab && /* @__PURE__ */ jsxs11(
+    showMessagesTab && /* @__PURE__ */ jsxs14(
       "button",
       {
         type: "button",
@@ -6455,15 +7287,15 @@ function TabBar({
         role: "tab",
         "aria-selected": activeTab === "messages",
         children: [
-          /* @__PURE__ */ jsxs11("span", { className: "hw-tabs-icon-wrap", children: [
-            /* @__PURE__ */ jsx16(MessagesIcon, {}),
-            unreadCount > 0 && /* @__PURE__ */ jsx16("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
+          /* @__PURE__ */ jsxs14("span", { className: "hw-tabs-icon-wrap", children: [
+            /* @__PURE__ */ jsx19(MessagesIcon, {}),
+            unreadCount > 0 && /* @__PURE__ */ jsx19("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
           ] }),
-          /* @__PURE__ */ jsx16("span", { children: t("widget.messages") })
+          /* @__PURE__ */ jsx19("span", { children: t("widget.messages") })
         ]
       }
     ),
-    contentTabs.map((tab) => /* @__PURE__ */ jsxs11(
+    contentTabs.map((tab) => /* @__PURE__ */ jsxs14(
       "button",
       {
         type: "button",
@@ -6472,11 +7304,11 @@ function TabBar({
         role: "tab",
         "aria-selected": activeTab === `content:${tab.id}`,
         children: [
-          /* @__PURE__ */ jsxs11("span", { className: "hw-tabs-icon-wrap", children: [
-            /* @__PURE__ */ jsx16(ContentTabIconComponent, { icon: tab.icon }),
-            tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx16("span", { className: "hw-tabs-dot" })
+          /* @__PURE__ */ jsxs14("span", { className: "hw-tabs-icon-wrap", children: [
+            /* @__PURE__ */ jsx19(ContentTabIconComponent, { icon: tab.icon }),
+            tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx19("span", { className: "hw-tabs-dot" })
           ] }),
-          /* @__PURE__ */ jsx16("span", { children: resolveLabel2(tab.label) })
+          /* @__PURE__ */ jsx19("span", { children: resolveLabel2(tab.label) })
         ]
       },
       tab.id
@@ -6490,9 +7322,9 @@ function HomeView({
 }) {
   const recent = conversations.slice(0, 3);
   if (recent.length === 0) return null;
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-recent-card", children: [
-    /* @__PURE__ */ jsx16("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
-    recent.map((conv, i) => /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs14("div", { className: "hw-recent-card", children: [
+    /* @__PURE__ */ jsx19("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
+    recent.map((conv, i) => /* @__PURE__ */ jsx19(
       ConversationRow,
       {
         conversation: conv,
@@ -6501,7 +7333,7 @@ function HomeView({
       },
       conv.id
     )),
-    conversations.length > 3 && /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
+    conversations.length > 3 && /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
   ] });
 }
 function MessagesView({
@@ -6510,14 +7342,14 @@ function MessagesView({
   onNewClick
 }) {
   if (conversations.length === 0) {
-    return /* @__PURE__ */ jsxs11("div", { className: "hw-empty-state", children: [
-      /* @__PURE__ */ jsx16("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx16(MessagesIcon, {}) }),
-      /* @__PURE__ */ jsx16("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
-      /* @__PURE__ */ jsx16("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
-      /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
+    return /* @__PURE__ */ jsxs14("div", { className: "hw-empty-state", children: [
+      /* @__PURE__ */ jsx19("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx19(MessagesIcon, {}) }),
+      /* @__PURE__ */ jsx19("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
+      /* @__PURE__ */ jsx19("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
+      /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
     ] });
   }
-  return /* @__PURE__ */ jsx16("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx16(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
+  return /* @__PURE__ */ jsx19("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx19(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
 }
 function ConvCardBody({ conv }) {
   const agentName = useWidgetStore((s) => s.agentConfig?.name) ?? "Support";
@@ -6525,14 +7357,22 @@ function ConvCardBody({ conv }) {
   const isTeam = !!humanName;
   const displayName = humanName ?? agentName;
   const preview = conv.lastMessageText ?? t("widget.no_preview");
-  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
-    /* @__PURE__ */ jsx16("div", { className: `hw-conv-card-avatar${isTeam ? " hw-conv-card-avatar--team" : ""}`, children: isTeam ? humanImage ? /* @__PURE__ */ jsx16("img", { src: humanImage, alt: displayName, className: "hw-conv-card-avatar-img", referrerPolicy: "no-referrer" }) : /* @__PURE__ */ jsx16("span", { className: "hw-conv-card-avatar-initials", children: displayName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx16(WidgetLogo, {}) }),
-    /* @__PURE__ */ jsxs11("div", { className: "hw-conv-card-content", children: [
-      /* @__PURE__ */ jsxs11("div", { className: "hw-conv-card-top", children: [
-        /* @__PURE__ */ jsx16("span", { className: "hw-conv-card-name", children: displayName }),
-        conv.lastMessageAt && /* @__PURE__ */ jsx16("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
+  return /* @__PURE__ */ jsxs14(Fragment5, { children: [
+    /* @__PURE__ */ jsx19("div", { className: `hw-conv-card-avatar${isTeam ? " hw-conv-card-avatar--team" : ""}`, children: isTeam ? humanImage ? /* @__PURE__ */ jsx19(
+      "img",
+      {
+        src: humanImage,
+        alt: displayName,
+        className: "hw-conv-card-avatar-img",
+        referrerPolicy: "no-referrer"
+      }
+    ) : /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-avatar-initials", children: displayName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx19(WidgetLogo, {}) }),
+    /* @__PURE__ */ jsxs14("div", { className: "hw-conv-card-content", children: [
+      /* @__PURE__ */ jsxs14("div", { className: "hw-conv-card-top", children: [
+        /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-name", children: displayName }),
+        conv.lastMessageAt && /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
       ] }),
-      /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-preview", children: preview })
+      /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-preview", children: preview })
     ] })
   ] });
 }
@@ -6542,16 +7382,16 @@ function ConversationCard({
 }) {
   const hasUnread = conv.unreadCount > 0;
   const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs14(
     "button",
     {
       type: "button",
       className: `hw-conv-card ${hasUnread ? "hw-conv-card--unread" : ""}`,
       onClick: () => onSelect(conv.id),
       children: [
-        /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx16(ConvCardBody, { conv }) }),
-        hasUnread && /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
-        awaiting && /* @__PURE__ */ jsx16("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
+        /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx19(ConvCardBody, { conv }) }),
+        hasUnread && /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
+        awaiting && /* @__PURE__ */ jsx19("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
       ]
     }
   );
@@ -6563,16 +7403,16 @@ function ConversationRow({
 }) {
   const hasUnread = conv.unreadCount > 0;
   const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs14(
     "button",
     {
       type: "button",
       className: `hw-recent-row ${hasUnread ? "hw-recent-row--unread" : ""} ${isLast ? "hw-recent-row--last" : ""}`,
       onClick: () => onSelect(conv.id),
       children: [
-        /* @__PURE__ */ jsx16(ConvCardBody, { conv }),
-        hasUnread && /* @__PURE__ */ jsx16("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
-        awaiting && /* @__PURE__ */ jsx16("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
+        /* @__PURE__ */ jsx19(ConvCardBody, { conv }),
+        hasUnread && /* @__PURE__ */ jsx19("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
+        awaiting && /* @__PURE__ */ jsx19("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
       ]
     }
   );
@@ -6580,10 +7420,10 @@ function ConversationRow({
 function InlineEmailPrompt({ conversationId }) {
   const { client, store } = useWidgetContext();
   const updateContact = useWidgetStore((s) => s.updateVisitorContact);
-  const [email, setEmail] = useState15("");
-  const [isSubmitting, setIsSubmitting] = useState15(false);
-  const [isSuccess, setIsSuccess] = useState15(false);
-  const [hasError, setHasError] = useState15(false);
+  const [email, setEmail] = useState17("");
+  const [isSubmitting, setIsSubmitting] = useState17(false);
+  const [isSuccess, setIsSuccess] = useState17(false);
+  const [hasError, setHasError] = useState17(false);
   const handleSubmit = async () => {
     const trimmed = email.trim();
     if (!trimmed || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) {
@@ -6624,8 +7464,8 @@ function InlineEmailPrompt({ conversationId }) {
     }
   };
   if (isSuccess) {
-    return /* @__PURE__ */ jsxs11("div", { className: "hw-email-card hw-email-card--success", children: [
-      /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsxs14("div", { className: "hw-email-card hw-email-card--success", children: [
+      /* @__PURE__ */ jsx19(
         "svg",
         {
           width: "15",
@@ -6636,17 +7476,17 @@ function InlineEmailPrompt({ conversationId }) {
           strokeWidth: 2.5,
           strokeLinecap: "round",
           strokeLinejoin: "round",
-          children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" })
+          children: /* @__PURE__ */ jsx19("polyline", { points: "20 6 9 17 4 12" })
         }
       ),
       t("widget.email_saved")
     ] });
   }
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-email-card", children: [
-    /* @__PURE__ */ jsx16("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
-    /* @__PURE__ */ jsx16("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
-    /* @__PURE__ */ jsxs11("div", { className: "hw-email-card-row", children: [
-      /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs14("div", { className: "hw-email-card", children: [
+    /* @__PURE__ */ jsx19("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
+    /* @__PURE__ */ jsx19("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
+    /* @__PURE__ */ jsxs14("div", { className: "hw-email-card-row", children: [
+      /* @__PURE__ */ jsx19(
         "input",
         {
           type: "email",
@@ -6662,7 +7502,7 @@ function InlineEmailPrompt({ conversationId }) {
           placeholder: t("widget.email_placeholder")
         }
       ),
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx19(
         "button",
         {
           type: "button",
@@ -6670,7 +7510,7 @@ function InlineEmailPrompt({ conversationId }) {
           onClick: handleSubmit,
           disabled: isSubmitting || !email.trim(),
           "aria-label": t("widget.email_continue"),
-          children: isSubmitting ? /* @__PURE__ */ jsx16(
+          children: isSubmitting ? /* @__PURE__ */ jsx19(
             "svg",
             {
               width: "14",
@@ -6680,7 +7520,7 @@ function InlineEmailPrompt({ conversationId }) {
               stroke: "currentColor",
               strokeWidth: 2,
               "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx16("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx16(
+              children: /* @__PURE__ */ jsx19("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx19(
                 "animate",
                 {
                   attributeName: "stroke-dashoffset",
@@ -6690,7 +7530,7 @@ function InlineEmailPrompt({ conversationId }) {
                 }
               ) })
             }
-          ) : /* @__PURE__ */ jsx16(
+          ) : /* @__PURE__ */ jsx19(
             "svg",
             {
               width: "15",
@@ -6702,7 +7542,7 @@ function InlineEmailPrompt({ conversationId }) {
               strokeLinecap: "round",
               strokeLinejoin: "round",
               "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx16("path", { d: "M5 12h13M12 5l7 7-7 7" })
+              children: /* @__PURE__ */ jsx19("path", { d: "M5 12h13M12 5l7 7-7 7" })
             }
           )
         }
@@ -6717,9 +7557,9 @@ function NewConversationView({
   isSubmitting,
   welcomeMessage
 }) {
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-new", children: [
-    /* @__PURE__ */ jsx16("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx16(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs14("div", { className: "hw-new", children: [
+    /* @__PURE__ */ jsx19("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx19(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
+    /* @__PURE__ */ jsx19(
       Composer,
       {
         text,
@@ -6768,27 +7608,27 @@ function ConversationView({
   const needsEmailPostReply = !!agentConfig?.requireVisitorEmail && !hasEmail && visitorMessageCount >= 2 && hasAiReply;
   const needsEmail = needsEmailPostReply || !!emailGateConvId;
   if (isLoading && items.length === 0) {
-    return /* @__PURE__ */ jsx16("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-messages", children: [
-      /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-msg", children: [
-        /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-avatar" }),
-        /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-bubble", children: [
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
+    return /* @__PURE__ */ jsx19("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-messages", children: [
+      /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-msg", children: [
+        /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-avatar" }),
+        /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-bubble", children: [
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
         ] })
       ] }),
-      /* @__PURE__ */ jsx16("div", { className: "hw-skeleton-msg hw-skeleton-msg--right", children: /* @__PURE__ */ jsx16("div", { className: "hw-skeleton-bubble", style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } }) }) }),
-      /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-msg", children: [
-        /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-avatar" }),
-        /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-bubble", children: [
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
-          /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
+      /* @__PURE__ */ jsx19("div", { className: "hw-skeleton-msg hw-skeleton-msg--right", children: /* @__PURE__ */ jsx19("div", { className: "hw-skeleton-bubble", style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } }) }) }),
+      /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-msg", children: [
+        /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-avatar" }),
+        /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-bubble", children: [
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
+          /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
         ] })
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs14(Fragment5, { children: [
+    /* @__PURE__ */ jsx19(
       MessageList,
       {
         items,
@@ -6798,12 +7638,12 @@ function ConversationView({
         hasMore,
         isLoadingMore: isLoading,
         onLoadMore: loadMore,
-        renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs11(Fragment5, { children: [
-          needsEmail && /* @__PURE__ */ jsx16(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
-          showStarters && /* @__PURE__ */ jsx16("div", { className: "hw-starters", children: starters?.map((entry, index) => {
+        renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
+          needsEmail && /* @__PURE__ */ jsx19(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
+          showStarters && /* @__PURE__ */ jsx19("div", { className: "hw-starters", children: starters?.map((entry, index) => {
             const question = typeof entry === "string" ? entry : entry.question;
             const label = typeof entry === "string" ? null : entry.label;
-            return /* @__PURE__ */ jsxs11(
+            return /* @__PURE__ */ jsxs14(
               "button",
               {
                 type: "button",
@@ -6813,11 +7653,11 @@ function ConversationView({
                   void submit({ text: question });
                 },
                 children: [
-                  /* @__PURE__ */ jsxs11("span", { className: "hw-starter-text", children: [
-                    /* @__PURE__ */ jsx16("span", { className: "hw-starter-k", children: label ?? question }),
-                    label && /* @__PURE__ */ jsx16("span", { className: "hw-starter-q", children: question })
+                  /* @__PURE__ */ jsxs14("span", { className: "hw-starter-text", children: [
+                    /* @__PURE__ */ jsx19("span", { className: "hw-starter-k", children: label ?? question }),
+                    label && /* @__PURE__ */ jsx19("span", { className: "hw-starter-q", children: question })
                   ] }),
-                  /* @__PURE__ */ jsx16(ChevronRightIcon, { size: 14 })
+                  /* @__PURE__ */ jsx19(ChevronRightIcon, { size: 14 })
                 ]
               },
               question
@@ -6826,10 +7666,10 @@ function ConversationView({
         ] }) : void 0
       }
     ),
-    isResolved && /* @__PURE__ */ jsx16(ResolvedBanner, { conversationId }),
-    sendError && /* @__PURE__ */ jsxs11("div", { className: "hw-send-error", children: [
+    isResolved && /* @__PURE__ */ jsx19(ResolvedBanner, { conversationId }),
+    sendError && /* @__PURE__ */ jsxs14("div", { className: "hw-send-error", children: [
       sendError,
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx19(
         "button",
         {
           type: "button",
@@ -6842,7 +7682,7 @@ function ConversationView({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx19(
       Composer,
       {
         text,
@@ -6853,50 +7693,12 @@ function ConversationView({
         attachments,
         onAddFiles: addFiles,
         onRemoveAttachment: removeAttachment,
-        disabled: needsEmail
+        disabled: needsEmail,
+        placeholder: isResolved ? t("widget.placeholder_resolved") : void 0
       }
     )
   ] });
 }
-function ResolvedBanner({ conversationId }) {
-  const { client } = useWidgetContext();
-  const [csatRating, setCsatRating] = useState15(null);
-  const [csatSubmitted, setCsatSubmitted] = useState15(false);
-  const handleCsat = (rating) => {
-    setCsatRating(rating);
-    setCsatSubmitted(true);
-    client.widget.sendCsat.mutate({ conversationId, rating }).catch(() => {
-    });
-  };
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-resolved", children: [
-    /* @__PURE__ */ jsx16("div", { className: "hw-resolved-text", children: t("widget.resolved_text") }),
-    !csatSubmitted ? /* @__PURE__ */ jsxs11("div", { className: "hw-csat", children: [
-      /* @__PURE__ */ jsx16("div", { className: "hw-csat-label", children: t("widget.csat_label") }),
-      /* @__PURE__ */ jsxs11("div", { className: "hw-csat-buttons", children: [
-        /* @__PURE__ */ jsx16(
-          "button",
-          {
-            type: "button",
-            className: `hw-csat-btn ${csatRating === "good" ? "hw-csat-btn--selected" : ""}`,
-            onClick: () => handleCsat("good"),
-            "aria-label": t("widget.aria_good"),
-            children: "\u{1F44D}"
-          }
-        ),
-        /* @__PURE__ */ jsx16(
-          "button",
-          {
-            type: "button",
-            className: `hw-csat-btn ${csatRating === "bad" ? "hw-csat-btn--selected" : ""}`,
-            onClick: () => handleCsat("bad"),
-            "aria-label": t("widget.aria_bad"),
-            children: "\u{1F44E}"
-          }
-        )
-      ] })
-    ] }) : /* @__PURE__ */ jsx16("div", { className: "hw-csat-thanks", children: t("widget.csat_thanks") })
-  ] });
-}
 function WhatsNewCard({
   getUnseenEntries,
   announcementTabs,
@@ -6907,34 +7709,34 @@ function WhatsNewCard({
   if (unseen.length === 0) return null;
   const display = unseen.slice(0, 3);
   const badgeFieldMap = new Map(announcementTabs.map((t2) => [t2.id, t2.display?.badgeField]));
-  return /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-header", children: [
-      /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
-      /* @__PURE__ */ jsxs11("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
+  return /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-header", children: [
+      /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
+      /* @__PURE__ */ jsxs14("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
         resolveLabel2("widget.view_all"),
         " \u2192"
       ] })
     ] }),
-    /* @__PURE__ */ jsx16("div", { className: "hw-whats-new-list", children: display.map((entry) => {
+    /* @__PURE__ */ jsx19("div", { className: "hw-whats-new-list", children: display.map((entry) => {
       const badgeField = badgeFieldMap.get(entry.tabId);
-      return /* @__PURE__ */ jsxs11(
+      return /* @__PURE__ */ jsxs14(
         "button",
         {
           type: "button",
           className: "hw-whats-new-item",
           onClick: () => onSelect(entry.slug, entry.tabId),
           children: [
-            badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-item-top", children: [
-              /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
-              entry.publishedAt && /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
+            badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-item-top", children: [
+              /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
+              entry.publishedAt && /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
             ] }),
-            /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-item-title", children: [
+            /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-item-title", children: [
               entry.title,
-              !badgeField && entry.publishedAt && /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
+              !badgeField && entry.publishedAt && /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
             ] }),
             entry.body && (() => {
               const clean = stripMarkdown(entry.body);
-              return /* @__PURE__ */ jsx16("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
+              return /* @__PURE__ */ jsx19("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
             })()
           ]
         },
@@ -6967,10 +7769,10 @@ function styleInject(css, { insertAt } = {}) {
 }
 
 // src/themed/styles.css
-styleInject(':host {\n  all: initial;\n  font-family:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n  font-size: 14px;\n  line-height: 1.5;\n  color: #1a1a1a;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget {\n  font-family:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n  font-size: 14px;\n  line-height: 1.5;\n  color: #1a1a1a;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget *,\n.hw-widget *::before,\n.hw-widget *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n:where(.hw-widget) {\n  --hw-primary: #171717;\n  --hw-primary-hover: #2a2a2a;\n  --hw-brand: #171717;\n  --hw-on-brand: #ffffff;\n  --hw-focus-border: #9ca3af;\n  --hw-focus-ring: rgba(0, 0, 0, 0.06);\n  --hw-accent: #6366f1;\n  --hw-bg: #ffffff;\n  --hw-bg-subtle: #fafaf9;\n  --hw-bg-hover: #f5f5f4;\n  --hw-border: #ebe9e5;\n  --hw-border-md: #e5e5e5;\n  --hw-text: #1c1b19;\n  --hw-text-1: #111;\n  --hw-text-2: #666;\n  --hw-text-3: #8a847c;\n  --hw-text-4: #a8a29a;\n  --hw-radius: 20px;\n  --hw-visitor-bubble-bg: #f5f5f4;\n  --hw-visitor-bubble-text: #1a1a1a;\n  --hw-font:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n}\n.hw-agent-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-agent-icon {\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n}\n.hw-widget :is(.hw-header-bot-icon, .hw-hero-bot-icon, .hw-conv-card-avatar, .hw-event-avatar, .hw-bubble-icon--bot):has(> .hw-agent-custom) {\n  border-radius: 50%;\n  background: transparent;\n  padding: 0;\n}\n.hw-widget :focus-visible {\n  outline: 2px solid var(--hw-primary);\n  outline-offset: 2px;\n}\n.hw-widget :focus:not(:focus-visible) {\n  outline: none;\n}\n.hw-widget {\n  position: fixed;\n  bottom: 20px;\n  right: var(--hw-position-right, 20px);\n  left: var(--hw-position-left, auto);\n  z-index: 999999;\n  font-family: var(--hw-font);\n}\n@keyframes hw-bubble-enter {\n  from {\n    opacity: 0;\n    transform: scale(0.6);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n.hw-bubble {\n  width: 48px;\n  height: 48px;\n  border-radius: 14px;\n  background: var(--hw-primary);\n  color: white;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n  position: relative;\n  overflow: visible;\n  animation: hw-bubble-enter 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) both;\n}\n.hw-bubble--rounded {\n  border-radius: 14px;\n}\n.hw-bubble--square {\n  border-radius: 8px;\n}\n.hw-bubble--pill {\n  border-radius: 24px;\n}\n.hw-bubble--launcher-bubble,\n.hw-bubble--launcher-help {\n  width: auto;\n  padding: 0 16px 0 12px;\n  gap: 8px;\n  border-radius: 24px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--square,\n.hw-bubble--launcher-help.hw-bubble--square {\n  border-radius: 8px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--rounded,\n.hw-bubble--launcher-help.hw-bubble--rounded {\n  border-radius: 14px;\n}\n.hw-bubble-label {\n  font-size: 14px;\n  font-weight: 600;\n  white-space: nowrap;\n  line-height: 1;\n  position: static;\n  opacity: 1;\n  transform: none;\n}\n.hw-bubble--launcher-bubble .hw-bubble-icon,\n.hw-bubble--launcher-help .hw-bubble-icon {\n  position: static;\n}\n.hw-bubble:hover {\n  transform: scale(1.05);\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);\n}\n.hw-bubble:active {\n  transform: scale(0.95);\n}\n.hw-bubble--open {\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n}\n.hw-bubble:focus-visible {\n  outline: 2px solid white;\n  outline-offset: 2px;\n}\n.hw-bubble-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;\n}\n.hw-bubble-icon svg:not(.hw-agent-custom svg) {\n  width: 22px;\n  height: 22px;\n}\n.hw-bubble-icon--hidden {\n  transform: scale(0.3) rotate(90deg);\n  opacity: 0;\n}\n.hw-bubble-icon--bot {\n}\n.hw-bubble--avatar .hw-bubble-icon--bot {\n  width: 100%;\n  height: 100%;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img {\n  width: 100%;\n  height: 100%;\n  border-radius: 0;\n}\n.hw-agent-img.hw-agent-img--logo {\n  object-fit: contain;\n  padding: 10px;\n  box-sizing: border-box;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img.hw-agent-img--logo {\n  padding: 10px;\n  box-sizing: border-box;\n  object-fit: contain;\n}\n.hw-bubble-icon--close svg {\n  width: 22px;\n  height: 22px;\n}\n.hw-bubble-badge {\n  position: absolute;\n  top: -4px;\n  right: -4px;\n  min-width: 20px;\n  height: 20px;\n  border-radius: 10px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  border: 2px solid white;\n  animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n@keyframes hw-badge-pop {\n  from {\n    transform: scale(0);\n  }\n  to {\n    transform: scale(1);\n  }\n}\n.hw-bubble-badge::after {\n  content: "";\n  position: absolute;\n  inset: -2px;\n  border-radius: inherit;\n  background: var(--hw-primary);\n  opacity: 0;\n  animation: hw-badge-pulse 2s ease-out infinite;\n}\n@keyframes hw-badge-pulse {\n  0% {\n    opacity: 0.5;\n    transform: scale(1);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1.8);\n  }\n}\n.hw-window {\n  position: absolute;\n  bottom: 72px;\n  right: var(--hw-window-right, 0);\n  left: var(--hw-window-left, auto);\n  width: 440px;\n  height: 640px;\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n  border-radius: var(--hw-radius);\n  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  animation: hw-window-open 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);\n  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1), height 280ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.hw-window--reading {\n  width: min(720px, calc(100vw - 40px));\n  height: min(800px, calc(100vh - 112px));\n}\n@keyframes hw-window-open {\n  from {\n    opacity: 0;\n    transform: translateY(12px) scale(0.96);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n.hw-window--closing {\n  animation: hw-window-close 0.2s ease forwards;\n}\n@keyframes hw-window-close {\n  from {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.98);\n  }\n}\n.hw-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  min-height: 0;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-window,\n  .hw-window--closing,\n  .hw-content,\n  .hw-msg,\n  .hw-bubble,\n  .hw-bubble-icon,\n  .hw-bubble-badge,\n  .hw-bubble-badge::after,\n  .hw-typing-dot,\n  .hw-loading-dot {\n    animation-duration: 0.01ms !important;\n    transition-duration: 0.01ms !important;\n  }\n}\n.hw-hero {\n  flex-shrink: 0;\n  background:\n    linear-gradient(\n      160deg,\n      color-mix(in srgb, var(--hw-primary) 60%, black) 0%,\n      var(--hw-primary) 50%,\n      color-mix(in srgb, var(--hw-primary) 40%, black) 100%);\n  color: white;\n  padding: 20px 22px 40px;\n}\n.hw-hero-top {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n}\n.hw-hero-close {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n  border: none;\n  background: rgba(255, 255, 255, 0.1);\n  color: rgba(255, 255, 255, 0.6);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-hero-close:hover {\n  background: rgba(255, 255, 255, 0.2);\n  color: white;\n}\n.hw-hero-close:active {\n  transform: scale(0.92);\n  transition:\n    transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n    background 0.15s,\n    color 0.15s;\n}\n.hw-hero-close svg {\n  width: 20px;\n  height: 20px;\n}\n.hw-hero-bot-icon {\n  width: 36px;\n  height: 36px;\n  flex-shrink: 0;\n  color: white;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 10px;\n}\n.hw-hero-bot-icon > svg,\n.hw-hero-bot-icon > .hw-agent-icon > svg {\n  width: 32px;\n  height: 32px;\n}\n.hw-hero-bot-icon .hw-agent-img,\n.hw-hero-bot-icon .hw-agent-icon {\n  border-radius: inherit;\n  overflow: hidden;\n  object-fit: contain;\n}\n.hw-hero-greeting {\n  font-size: 26px;\n  font-weight: 700;\n  line-height: 1.15;\n  margin-bottom: 6px;\n}\n.hw-hero-greeting-name {\n  font-weight: 300;\n}\n.hw-hero-greeting-question {\n  font-weight: 700;\n}\n.hw-hero-subtitle {\n  font-size: 15px;\n  color: rgba(255, 255, 255, 0.5);\n  line-height: 1.35;\n}\n.hw-sheet {\n  flex: 1;\n  overflow-y: auto;\n  min-height: 0;\n  background: #ffffff;\n  border-radius: 20px 20px 0 0;\n  margin-top: -24px;\n  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);\n  position: relative;\n  z-index: 1;\n}\n.hw-sheet-inner {\n  padding: 20px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.hw-header {\n  display: flex;\n  align-items: center;\n  padding: 14px 12px 14px 16px;\n  background: var(--hw-primary);\n  color: white;\n  flex-shrink: 0;\n  gap: 10px;\n}\n.hw-header--sub {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header-back {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: color 0.15s, background 0.15s;\n  flex-shrink: 0;\n}\n.hw-header-back svg {\n  width: 18px;\n  height: 18px;\n}\n.hw-header-back:hover {\n  color: var(--hw-text);\n  background: var(--hw-bg-subtle);\n}\n.hw-header-identity {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex: 1;\n  min-width: 0;\n}\n.hw-header-bot-icon {\n  width: 32px;\n  height: 32px;\n  flex-shrink: 0;\n  color: var(--hw-text);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 9px;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, transparent));\n}\n.hw-header-bot-icon > svg,\n.hw-header-bot-icon > .hw-agent-icon > svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-header-bot-icon--team {\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n}\n.hw-header-agent-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: inherit;\n}\n.hw-header-bot-icon .hw-agent-img,\n.hw-header-bot-icon .hw-agent-icon {\n  border-radius: inherit;\n  overflow: hidden;\n}\n.hw-header-bot-icon .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-widget[data-has-avatar=true] {\n  --hw-agent-bg-default: var(--hw-primary);\n  --hw-agent-fit-default: contain;\n  --hw-agent-pad-default: 6px;\n}\n.hw-header-agent-initials {\n  font-size: 11px;\n  font-weight: 600;\n  line-height: 1;\n}\n.hw-header-info {\n  flex: 1;\n  min-width: 0;\n}\n.hw-header-name {\n  font-size: 15px;\n  font-weight: 600;\n  line-height: 1.3;\n}\n.hw-header-status {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  line-height: 1.3;\n}\n.hw-header-close {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n  flex-shrink: 0;\n}\n.hw-header-close svg {\n  width: 20px;\n  height: 20px;\n}\n.hw-header-close:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n}\n.hw-header-close:active {\n  transform: scale(0.92);\n}\n.hw-header--centered {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header--centered .hw-header-title {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  max-width: calc(100% - 88px);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  text-align: center;\n}\n.hw-header-spacer {\n  width: 28px;\n  flex-shrink: 0;\n}\n.hw-header--messages {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header-title {\n  font-size: 16px;\n  font-weight: 600;\n}\n.hw-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.hw-header-action {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-header-action svg {\n  width: 16px;\n  height: 16px;\n}\n.hw-header-action:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n}\n.hw-header-action:active {\n  transform: scale(0.94);\n}\n.hw-card {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  width: 100%;\n  padding: 14px 16px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  cursor: pointer;\n  transition: box-shadow 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n  text-align: left;\n  color: var(--hw-text);\n  font-family: inherit;\n}\n.hw-card:hover {\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);\n  transform: translateY(-1px);\n}\n.hw-card:active {\n  transform: translateY(0) scale(0.99);\n  transition-duration: 120ms;\n}\n.hw-card-body {\n  flex: 1;\n  min-width: 0;\n}\n.hw-card-title {\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 1.3;\n  color: var(--hw-text);\n}\n.hw-card-meta {\n  font-size: 12px;\n  color: var(--hw-text-3);\n  line-height: 1.3;\n  margin-top: 1px;\n}\n.hw-card-arrow {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: var(--hw-primary);\n  color: white;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n.hw-card-arrow svg {\n  width: 14px;\n  height: 14px;\n}\n.hw-msgs-tab {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-recent-card {\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  overflow: hidden;\n}\n.hw-recent-header {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--hw-text-2);\n  padding: 12px 14px 0;\n}\n.hw-recent-row {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n  transition: background-color 140ms cubic-bezier(0.23, 1, 0.32, 1), transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n  position: relative;\n}\n.hw-recent-row:hover {\n  background: rgba(0, 0, 0, 0.03);\n}\n.hw-recent-row:active {\n  transform: scale(0.995);\n}\n.hw-recent-row--last {\n  border-bottom: none;\n}\n.hw-recent-row .hw-conv-card-avatar {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n}\n.hw-recent-row .hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n  width: 18px;\n  height: 18px;\n}\n.hw-recent-row .hw-conv-card-name {\n  font-size: 13px;\n}\n.hw-recent-row .hw-conv-card-preview {\n  font-size: 12px;\n}\n.hw-recent-row--unread .hw-conv-card-name {\n  color: var(--hw-text);\n}\n.hw-recent-row--unread .hw-conv-card-time {\n  color: var(--hw-primary);\n  font-weight: 500;\n}\n.hw-recent-row-badge {\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  flex-shrink: 0;\n  font-variant-numeric: tabular-nums;\n}\n.hw-recent-see-all {\n  display: block;\n  width: 100%;\n  padding: 10px 14px;\n  text-align: center;\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-text);\n  background: none;\n  border: none;\n  border-top: 1px solid var(--hw-border);\n  cursor: pointer;\n  font-family: inherit;\n  transition: background 0.1s;\n}\n.hw-recent-see-all:hover {\n  background: rgba(0, 0, 0, 0.02);\n}\n.hw-conv-card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  width: 100%;\n  padding: 14px 16px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  cursor: pointer;\n  transition: box-shadow 0.15s, transform 0.1s;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n}\n.hw-conv-card:hover {\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.04);\n}\n.hw-conv-card:active {\n  transform: scale(0.99);\n}\n.hw-conv-card-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.hw-conv-card-avatar {\n  width: 36px;\n  height: 36px;\n  border-radius: 10px;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-subtle)));\n  color: var(--hw-text-3);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n  width: 20px;\n  height: 20px;\n}\n.hw-conv-card-avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-conv-card-avatar .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-conv-card-avatar--team {\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n}\n.hw-conv-card-avatar-initials {\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 1;\n  letter-spacing: 0.02em;\n}\n.hw-conv-card-content {\n  flex: 1;\n  min-width: 0;\n}\n.hw-conv-card-top {\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n}\n.hw-conv-card-name {\n  flex: 1;\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-conv-card-time {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n  font-variant-numeric: tabular-nums;\n}\n.hw-conv-card-preview {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  line-height: 1.4;\n  margin-top: 1px;\n}\n.hw-conv-card--unread .hw-conv-card-name {\n  color: var(--hw-text);\n}\n.hw-conv-card--unread .hw-conv-card-time {\n  color: var(--hw-primary);\n  font-weight: 500;\n}\n.hw-conv-card-badge {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-empty-state {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px;\n  text-align: center;\n}\n.hw-empty-icon-wrap {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: var(--hw-bg-subtle);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: 16px;\n  color: var(--hw-text-3);\n}\n.hw-empty-icon-wrap svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-empty-title {\n  font-size: 15px;\n  font-weight: 600;\n  color: var(--hw-text);\n  margin-bottom: 4px;\n}\n.hw-empty-desc {\n  font-size: 13px;\n  color: var(--hw-text-3);\n  margin-bottom: 20px;\n}\n.hw-empty-btn {\n  padding: 8px 20px;\n  border-radius: 10px;\n  background: var(--hw-primary);\n  color: white;\n  border: none;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  font-family: inherit;\n  transition: background 0.15s;\n}\n.hw-empty-btn:hover {\n  background: var(--hw-primary-hover);\n}\n.hw-tabs {\n  display: flex;\n  border-top: 1px solid var(--hw-border);\n  flex-shrink: 0;\n  background: var(--hw-bg-subtle);\n}\n.hw-tabs-item {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 2px;\n  padding: 8px 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-text-3);\n  transition: color 0.15s;\n}\n.hw-tabs-item svg {\n  width: 22px;\n  height: 22px;\n  overflow: visible;\n}\n.hw-tabs-item--active {\n  color: var(--hw-text);\n}\n.hw-tabs-item:hover {\n  color: var(--hw-text-2);\n}\n.hw-tabs-item:active {\n  transform: scale(0.94);\n  transition: transform 0.14s cubic-bezier(0.23, 1, 0.32, 1), color 0.15s;\n}\n.hw-tabs-icon-wrap {\n  position: relative;\n  display: inline-flex;\n}\n.hw-tabs-badge {\n  position: absolute;\n  top: -6px;\n  right: -10px;\n  min-width: 16px;\n  height: 16px;\n  border-radius: 8px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 10px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 4px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-messages {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 16px 14px 8px;\n  background: var(--hw-bg-subtle);\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n  overscroll-behavior: contain;\n  min-width: 0;\n  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n  scrollbar-width: thin;\n}\n.hw-messages::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.hw-messages::-webkit-scrollbar-track {\n  background: transparent;\n}\n.hw-messages::-webkit-scrollbar-thumb {\n  background: rgba(0, 0, 0, 0.16);\n  background-clip: content-box;\n  border: 3px solid transparent;\n  border-radius: 999px;\n}\n.hw-messages::-webkit-scrollbar-thumb:hover {\n  background: rgba(0, 0, 0, 0.28);\n  background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages {\n  scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb {\n  background: rgba(255, 255, 255, 0.2);\n  background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb:hover {\n  background: rgba(255, 255, 255, 0.32);\n  background-clip: content-box;\n}\n.hw-empty {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px;\n  color: var(--hw-text-3);\n  text-align: center;\n}\n.hw-empty-icon {\n  width: 40px;\n  height: 40px;\n  margin-bottom: 12px;\n  opacity: 0.3;\n}\n.hw-empty-text {\n  font-size: 13px;\n}\n.hw-date-sep {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 0;\n}\n.hw-date-sep-line {\n  flex: 1;\n  height: 1px;\n  background: var(--hw-border-md);\n}\n.hw-date-sep-text {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  font-weight: 500;\n  white-space: nowrap;\n}\n.hw-msg {\n  display: flex;\n  padding: 4px 0;\n  max-width: 75%;\n  min-width: 0;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n@keyframes hw-msg-appear {\n  from {\n    opacity: 0;\n    transform: translateY(6px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-msg--visitor {\n  align-self: flex-end;\n}\n.hw-msg--team,\n.hw-msg--ai {\n  align-self: flex-start;\n}\n.hw-msg--ai {\n  width: 100%;\n  max-width: 100%;\n}\n.hw-msg-body {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  max-width: 100%;\n}\n.hw-msg-bubble {\n  padding: 10px 14px;\n  border-radius: 16px;\n  font-size: 14px;\n  line-height: 1.45;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  max-width: 100%;\n}\n.hw-msg--visitor .hw-msg-bubble {\n  background: var(--hw-primary);\n  color: white;\n  border-bottom-right-radius: 4px;\n}\n.hw-msg--team .hw-msg-bubble {\n  background: var(--hw-visitor-bubble-bg);\n  color: var(--hw-visitor-bubble-text);\n  border-bottom-left-radius: 4px;\n}\n.hw-msg--ai .hw-msg-bubble {\n  background: var(--hw-visitor-bubble-bg);\n  color: var(--hw-text);\n  border-bottom-left-radius: 4px;\n  white-space: normal;\n  max-width: min(100%, 640px);\n}\n.hw-msg--ai .hw-msg-body {\n  width: 100%;\n}\n.hw-msg--ai .hw-msg-bubble:has(.hw-code),\n.hw-msg--ai .hw-msg-bubble:has(pre) {\n  width: 100%;\n}\n.hw-quick-replies {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-top: 8px;\n}\n.hw-quick-reply-btn {\n  font: inherit;\n  font-size: 13px;\n  font-weight: 500;\n  padding: 6px 14px;\n  border-radius: 18px;\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  background: var(--hw-bg, #fff);\n  color: var(--hw-text-1, #1a1a1a);\n  cursor: pointer;\n  transition:\n    background 120ms ease,\n    border-color 120ms ease,\n    box-shadow 120ms ease,\n    transform 80ms ease;\n  line-height: 1.3;\n}\n.hw-quick-reply-btn:hover:not(:disabled) {\n  border-color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 8%, transparent);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n}\n.hw-quick-reply-btn:active:not(:disabled) {\n  transform: scale(0.97);\n}\n.hw-quick-reply-btn:disabled {\n  cursor: default;\n  opacity: 0.4;\n}\n.hw-quick-reply-btn[data-tapped=true] {\n  background: var(--hw-primary);\n  color: white;\n  border-color: var(--hw-primary);\n  opacity: 1;\n}\n.hw-quick-replies[data-cancelled=true] .hw-quick-reply-btn {\n  border-color: var(--hw-border);\n  color: var(--hw-text-3);\n}\n.hw-msg--ai .hw-code {\n  width: 100%;\n  box-sizing: border-box;\n}\n.hw-msg-meta {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 11px;\n  color: var(--hw-text-2);\n  margin-top: 2px;\n  padding: 0 4px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-msg-time {\n  white-space: nowrap;\n}\n.hw-msg--visitor .hw-msg-meta {\n  text-align: right;\n}\n.hw-msg--team .hw-msg-body,\n.hw-msg--ai .hw-msg-body {\n  align-items: flex-start;\n}\n.hw-msg--visitor .hw-msg-body {\n  align-items: flex-end;\n}\n.hw-typing {\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n  padding: 8px 0;\n  width: fit-content;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-typing-dots {\n  display: flex;\n  gap: 3px;\n  padding: 6px 2px;\n  width: fit-content;\n}\n.hw-typing-dot {\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: var(--hw-text-3);\n  animation: hw-typing-bounce 1.4s infinite;\n}\n.hw-typing-dot:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-typing-dot:nth-child(3) {\n  animation-delay: 0.4s;\n}\n@keyframes hw-typing-bounce {\n  0%, 60%, 100% {\n    transform: translateY(0);\n  }\n  30% {\n    transform: translateY(-4px);\n  }\n}\n.hw-streaming-cursor {\n  display: inline-block;\n  width: 2px;\n  height: 1em;\n  background: currentColor;\n  opacity: 0.6;\n  margin-left: 1px;\n  vertical-align: text-bottom;\n  animation: hw-cursor-blink 0.8s step-end infinite;\n}\n@keyframes hw-cursor-blink {\n  50% {\n    opacity: 0;\n  }\n}\n.hw-link-preview {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  border-radius: 10px;\n  overflow: hidden;\n  text-decoration: none;\n  color: inherit;\n  margin-top: 6px;\n  transition: background 0.15s;\n}\n.hw-link-preview:hover {\n  background: var(--hw-bg-hover, rgba(0, 0, 0, 0.02));\n}\n.hw-link-preview-img {\n  width: 100%;\n  height: 56px;\n  flex: 0 0 56px;\n  object-fit: cover;\n  object-position: top;\n  border-radius: 0;\n}\n.hw-link-preview-body {\n  padding: 8px 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n  justify-content: center;\n}\n.hw-link-preview-favicon {\n  width: 16px;\n  height: 16px;\n  border-radius: 2px;\n}\n.hw-link-preview-title {\n  font-size: 12.5px;\n  font-weight: 600;\n  line-height: 1.3;\n  color: var(--hw-text, #1a1a1a);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n.hw-link-preview-desc {\n  font-size: 11.5px;\n  line-height: 1.4;\n  color: var(--hw-text-2, #6b7280);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n.hw-link-preview-url {\n  font-size: 11px;\n  color: var(--hw-text-2);\n}\n.hw-msg-links {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  max-width: 240px;\n}\n.hw-loading {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-loading-dots {\n  display: flex;\n  gap: 4px;\n}\n.hw-loading-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: var(--hw-text-4);\n  animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-loading-dot:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-loading-dot:nth-child(3) {\n  animation-delay: 0.4s;\n}\n@keyframes hw-loading-pulse {\n  0%, 60%, 100% {\n    opacity: 0.3;\n    transform: scale(0.8);\n  }\n  30% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n@keyframes hw-skeleton-shimmer {\n  0% {\n    background-position: -200px 0;\n  }\n  100% {\n    background-position: calc(200px + 100%) 0;\n  }\n}\n.hw-skeleton {\n  background:\n    linear-gradient(\n      90deg,\n      var(--hw-bg-subtle) 25%,\n      rgba(0, 0, 0, 0.04) 50%,\n      var(--hw-bg-subtle) 75%);\n  background-size: 200px 100%;\n  animation: hw-skeleton-shimmer 1.5s ease-in-out infinite;\n  border-radius: 6px;\n}\n.hw-skeleton-messages {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  padding: 16px;\n  gap: 16px;\n}\n.hw-skeleton-msg {\n  display: flex;\n  gap: 10px;\n  align-items: flex-start;\n}\n.hw-skeleton-msg--right {\n  flex-direction: row-reverse;\n}\n.hw-skeleton-avatar {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n.hw-skeleton-bubble {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.hw-skeleton-line {\n  height: 12px;\n  border-radius: 6px;\n}\n.hw-skeleton-convs {\n  display: flex;\n  flex-direction: column;\n  padding: 8px 0;\n}\n.hw-skeleton-conv {\n  display: flex;\n  gap: 10px;\n  align-items: center;\n  padding: 10px 16px;\n}\n.hw-skeleton-conv-avatar {\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n.hw-skeleton-conv-lines {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.hw-skeleton-content {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 16px;\n  gap: 12px;\n}\n.hw-skeleton-content-item {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 12px;\n  border-radius: 10px;\n  background: var(--hw-bg);\n}\n.hw-skeleton-title {\n  height: 22px;\n  width: 65%;\n  border-radius: 6px;\n}\n.hw-skeleton-badge {\n  width: 42px;\n  height: 18px;\n  border-radius: 9px;\n}\n.hw-skeleton-date {\n  width: 60px;\n  height: 12px;\n  border-radius: 6px;\n}\n.hw-skeleton-h2 {\n  height: 16px;\n  border-radius: 6px;\n}\n.hw-skeleton-bullet {\n  padding-left: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-skeleton-bullet-line {\n  height: 14px;\n  border-radius: 7px;\n}\n.hw-email-card {\n  max-width: min(100%, 340px);\n  margin: 0;\n  padding: 0;\n  border: 0;\n  border-radius: 0;\n  background: none;\n  box-shadow: none;\n  animation: hw-email-slide-in 0.25s ease-out;\n}\n@keyframes hw-email-slide-in {\n  from {\n    opacity: 0;\n    transform: translateY(8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-email-card-title {\n  font-size: 14px;\n  font-weight: 550;\n  color: var(--hw-text, #1a1a1a);\n  line-height: 1.3;\n  margin: 0 0 2px;\n}\n.hw-email-card-subtitle {\n  font-size: 12px;\n  color: var(--hw-text-2, #888);\n  line-height: 1.4;\n  margin: 0;\n}\n.hw-email-card-row {\n  max-width: 300px;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-top: 9px;\n  padding: 3px 3px 3px 12px;\n  border-radius: 999px;\n  border: 1px solid var(--hw-border, rgba(0,0,0,0.1));\n  background: var(--hw-bg-subtle, #fafafa);\n  transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-email-card-row:focus-within {\n  border-color: var(--hw-focus-border, rgba(0,0,0,0.2));\n  box-shadow: 0 0 0 2px var(--hw-focus-ring, rgba(0,0,0,0.06));\n}\n.hw-email-card-input {\n  flex: 1;\n  min-width: 0;\n  padding: 6px 0;\n  border: 0;\n  background: transparent;\n  color: var(--hw-text, #1a1a1a);\n  font: inherit;\n  font-size: 13px;\n  outline: none;\n}\n.hw-email-card-input::placeholder {\n  color: var(--hw-text-3, #999);\n}\n.hw-email-card-row:has(.hw-email-card-input--error) {\n  border-color: #ef4444;\n}\n.hw-email-card-submit {\n  flex: none;\n  display: grid;\n  place-items: center;\n  width: 28px;\n  height: 28px;\n  border: none;\n  border-radius: 50%;\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n  cursor: pointer;\n  transition: opacity 0.15s, transform 0.15s;\n}\n.hw-email-card-submit:hover:not(:disabled) {\n  transform: scale(1.06);\n}\n.hw-email-card-submit:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n.hw-email-card--success {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 2px 0;\n  font-size: 13px;\n  color: var(--hw-text-2, #888);\n  animation: hw-email-slide-in 0.2s ease-out;\n}\n.hw-email-card--success svg {\n  flex-shrink: 0;\n}\n.hw-composer {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 16px;\n  background: transparent;\n  flex-shrink: 0;\n}\n.hw-composer--compact {\n  padding: 8px 12px;\n}\n.hw-composer-box {\n  display: flex;\n  flex-direction: column;\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  border-radius: 16px;\n  overflow: hidden;\n  transition: border-color 0.2s;\n  background: var(--hw-bg);\n}\n.hw-composer-box:focus-within {\n  border-color: var(--hw-focus-border);\n  box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-composer-input {\n  resize: none;\n  border: none;\n  padding: 12px 16px 4px;\n  font-size: 14px;\n  font-family: inherit;\n  line-height: 1.4;\n  outline: none;\n  min-height: 40px;\n  max-height: 220px;\n  background: transparent;\n  color: var(--hw-text);\n  field-sizing: content;\n}\n.hw-composer-input:focus {\n  outline: none;\n}\n.hw-composer-input:focus-visible {\n  outline: none;\n}\n.hw-composer-input::placeholder {\n  color: var(--hw-text-4);\n}\n.hw-composer-toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 10px 10px;\n}\n.hw-composer-toolbar-left {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.hw-composer-send {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-composer-send:active:not(:disabled) {\n  transform: scale(0.9);\n}\n.hw-composer-send--active {\n  background: var(--hw-primary);\n  color: white;\n}\n.hw-composer-send--inactive {\n  background: var(--hw-border);\n  color: var(--hw-text-4);\n  cursor: default;\n}\n.hw-composer-send svg {\n  width: 14px;\n  height: 14px;\n}\n.hw-composer-charcount {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  font-variant-numeric: tabular-nums;\n  opacity: 1;\n  transform: translateY(0);\n  transition:\n    color 180ms cubic-bezier(0.23, 1, 0.32, 1),\n    opacity 180ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n@starting-style {\n  .hw-composer-charcount {\n    opacity: 0;\n    transform: translateY(3px);\n  }\n}\n.hw-composer-charcount--over {\n  color: #ef4444;\n  font-weight: 600;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-composer-charcount {\n    transform: none;\n    transition: color 160ms ease, opacity 160ms ease;\n  }\n  @starting-style {\n    .hw-composer-charcount {\n      transform: none;\n    }\n  }\n}\n.hw-composer-previews {\n  display: flex;\n  gap: 6px;\n  padding: 8px 10px 0;\n  overflow-x: auto;\n  scrollbar-width: none;\n}\n.hw-composer-previews::-webkit-scrollbar {\n  display: none;\n}\n.hw-composer-preview {\n  position: relative;\n  width: 48px;\n  height: 48px;\n  border-radius: 8px;\n  overflow: hidden;\n  flex-shrink: 0;\n  background: var(--hw-border);\n  cursor: pointer;\n}\n.hw-composer-preview--error {\n  outline: 2px solid #ef4444;\n  outline-offset: -2px;\n}\n.hw-composer-preview-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-composer-preview-file {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--hw-bg-subtle);\n}\n.hw-composer-preview-ext {\n  font-size: 10px;\n  font-weight: 700;\n  color: var(--hw-text-3);\n  text-transform: uppercase;\n}\n.hw-composer-preview-loader {\n  position: absolute;\n  inset: 0;\n  background: rgba(0, 0, 0, 0.35);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-composer-preview-loader::after {\n  content: "";\n  width: 16px;\n  height: 16px;\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top-color: white;\n  border-radius: 50%;\n  animation: hw-spin 0.6s linear infinite;\n}\n@keyframes hw-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n.hw-composer-preview-badge {\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: #ef4444;\n  color: white;\n  font-size: 10px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-composer-preview-remove {\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  border: none;\n  background: rgba(0, 0, 0, 0.55);\n  color: white;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  transition: opacity 0.15s;\n}\n.hw-composer-preview-remove svg {\n  width: 10px;\n  height: 10px;\n}\n.hw-composer-preview:hover .hw-composer-preview-remove {\n  opacity: 1;\n}\n.hw-composer-attach {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: none;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  opacity: 0.7;\n  transition: opacity 0.15s;\n}\n.hw-composer-attach:hover {\n  opacity: 1;\n}\n.hw-composer-attach svg {\n  width: 16px;\n  height: 16px;\n}\n.hw-msg-images {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-bottom: 4px;\n}\n.hw-msg-image-link {\n  display: block;\n  border-radius: 14px;\n  overflow: hidden;\n  line-height: 0;\n}\n.hw-msg-image {\n  max-width: 140px;\n  max-height: 80px;\n  object-fit: cover;\n  border-radius: 8px;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-msg-files {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-top: 4px;\n}\n.hw-msg-file {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  border-radius: 10px;\n  background: var(--hw-bg-subtle);\n  text-decoration: none;\n  color: var(--hw-text);\n  transition: background 0.15s;\n}\n.hw-msg-file:hover {\n  background: var(--hw-border);\n}\n.hw-msg-file-icon {\n  flex-shrink: 0;\n  width: 20px;\n  height: 20px;\n  color: var(--hw-text-3);\n}\n.hw-msg-file-icon svg {\n  width: 100%;\n  height: 100%;\n}\n.hw-msg-file-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n.hw-msg-file-name {\n  font-size: 13px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.hw-msg-file-size {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-msg-image-link {\n  cursor: pointer;\n  border: none;\n  padding: 0;\n  background: none;\n  display: block;\n  line-height: 0;\n}\n.hw-hover-preview {\n  position: fixed;\n  z-index: 2147483001;\n  padding: 6px;\n  border-radius: 14px;\n  background: white;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.06);\n  cursor: pointer;\n  animation: hw-hover-in 0.15s ease-out;\n}\n@media (prefers-color-scheme: dark) {\n  .hw-hover-preview {\n    background: #1c1c1e;\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.08);\n  }\n}\n@keyframes hw-hover-in {\n  from {\n    opacity: 0;\n    transform: scale(0.96) translateY(4px);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1) translateY(0);\n  }\n}\n.hw-hover-preview-img {\n  width: 100%;\n  max-height: 200px;\n  object-fit: contain;\n  border-radius: 10px;\n  display: block;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-hover-preview--doc {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n}\n.hw-hover-preview-doc-icon {\n  width: 28px;\n  height: 28px;\n  flex-shrink: 0;\n}\n.hw-hover-preview-doc-icon svg {\n  width: 100%;\n  height: 100%;\n}\n.hw-hover-preview-doc-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n.hw-hover-preview-doc-name {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-text);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.hw-hover-preview-doc-hint {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-event {\n  display: flex;\n  justify-content: center;\n  padding: 8px 16px;\n}\n.hw-event-text {\n  font-size: 12px;\n  color: var(--hw-text-3);\n  text-align: center;\n}\n.hw-event--card {\n  justify-content: flex-start;\n  align-items: center;\n  gap: 10px;\n  background: var(--hw-bg-subtle);\n  padding: 10px 14px;\n  border-radius: 12px;\n  margin: 4px 16px;\n}\n.hw-event-avatar {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-hover, #e0e0e0)));\n  color: var(--hw-text-2, #555);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 600;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-event-avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-event-avatar .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-event-body {\n  font-size: 13px;\n  line-height: 1.3;\n}\n.hw-event-name {\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-event-action {\n  color: var(--hw-text-2);\n}\n.hw-resolved-banner {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 12px 16px;\n  border-top: 1px solid var(--hw-border);\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text-2);\n  font-size: 13px;\n  flex-shrink: 0;\n}\n.hw-new {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  background: var(--hw-bg-subtle);\n}\n.hw-new-body {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px 24px;\n  text-align: center;\n}\n.hw-new-welcome {\n  flex: 1;\n  padding: 16px 20px;\n  overflow-y: auto;\n}\n.hw-new-heading {\n  font-size: 17px;\n  font-weight: 600;\n  color: var(--hw-text);\n  margin-bottom: 6px;\n}\n.hw-new-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  margin-bottom: 24px;\n}\n.hw-powered {\n  text-align: center;\n  padding: 8px;\n  font-size: 11px;\n  color: var(--hw-text-4);\n  flex-shrink: 0;\n}\n.hw-powered a {\n  color: var(--hw-text-2);\n  text-decoration: none;\n  font-weight: 500;\n}\n.hw-powered a:hover {\n  color: var(--hw-text);\n}\n@media (max-width: 479px) {\n  .hw-widget {\n    bottom: 16px;\n    right: 16px;\n    left: auto;\n  }\n  .hw-window {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    width: 100%;\n    height: var(--hw-visible-height, 100%);\n    border-radius: 0;\n    animation: hw-mob-up 0.3s cubic-bezier(0.22, 1, 0.36, 1);\n  }\n  .hw-window--closing {\n    animation: hw-mob-down 0.2s ease forwards;\n  }\n  @keyframes hw-mob-up {\n    from {\n      opacity: 0;\n      transform: translateY(100%);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  @keyframes hw-mob-down {\n    from {\n      opacity: 1;\n      transform: translateY(0);\n    }\n    to {\n      opacity: 0;\n      transform: translateY(100%);\n    }\n  }\n  .hw-hero {\n    padding-top: calc(20px + env(safe-area-inset-top, 0px));\n  }\n  .hw-header {\n    padding-top: env(safe-area-inset-top, 0px);\n  }\n  .hw-tabs {\n    padding-bottom: env(safe-area-inset-bottom, 0px);\n  }\n  .hw-composer {\n    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));\n  }\n  .hw-powered {\n    padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px));\n  }\n  .hw-header-close,\n  .hw-header-back,\n  .hw-header-action {\n    width: 34px;\n    height: 34px;\n  }\n  .hw-composer-send {\n    width: 40px;\n    height: 40px;\n  }\n  .hw-window ~ .hw-bubble {\n    display: none;\n  }\n  .hw-messages {\n    padding: 12px 14px;\n  }\n  .hw-msg {\n    max-width: 82%;\n  }\n  .hw-msg--ai {\n    max-width: 100%;\n  }\n}\n.hw-preview {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  width: 300px;\n  max-width: calc(100vw - 40px);\n  background: var(--hw-bg);\n  border: 1px solid var(--hw-border);\n  border-radius: 16px;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);\n  animation: hw-preview-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n  overflow: hidden;\n  cursor: pointer;\n  transition: transform 0.15s, box-shadow 0.15s;\n}\n.hw-preview.hw-preview--anchored {\n  position: static;\n  bottom: auto;\n  right: auto;\n  width: 100%;\n  max-width: 100%;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar {\n  background: none;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar img,\n.hw-preview.hw-preview--anchored .hw-preview-avatar svg:not(.hw-agent-custom svg) {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n.hw-preview:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);\n}\n@keyframes hw-preview-in {\n  from {\n    opacity: 0;\n    transform: translateY(8px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n@keyframes hw-preview-out {\n  from {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.95);\n  }\n}\n.hw-preview-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px 14px 0;\n}\n.hw-preview-avatar {\n  width: 28px;\n  height: 28px;\n  border-radius: 50%;\n  background:\n    linear-gradient(\n      135deg,\n      var(--hw-primary),\n      color-mix(in srgb, var(--hw-primary) 50%, black));\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-preview-avatar svg:not(.hw-agent-custom svg) {\n  width: 16px;\n  height: 16px;\n}\n.hw-preview-avatar img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  display: block;\n}\n.hw-preview-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--hw-text);\n  flex: 1;\n}\n.hw-preview-close {\n  width: 24px;\n  height: 24px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  transition: background 0.15s, color 0.15s;\n  flex-shrink: 0;\n}\n.hw-preview-close:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text-2);\n}\n.hw-preview-close:active {\n  transform: scale(0.90);\n  transition:\n    transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n    background 0.15s,\n    color 0.15s;\n}\n.hw-preview-close svg {\n  width: 12px;\n  height: 12px;\n}\n.hw-preview-body {\n  padding: 4px 14px;\n  font-size: 14px;\n  line-height: 1.45;\n  color: var(--hw-text-2);\n}\n.hw-preview-body:first-of-type {\n  padding-top: 8px;\n}\n.hw-preview-body:last-child {\n  padding-bottom: 14px;\n}\n.hw-preview-footer {\n  margin-top: 2px;\n  padding: 8px 14px 12px;\n  border-top: 1px solid var(--hw-border);\n  font-size: 11px;\n  line-height: 1.3;\n  color: var(--hw-text-2);\n  opacity: 0.65;\n}\n.hw-preview-prompt {\n  padding: 2px 14px 6px;\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--hw-text-1);\n}\n.hw-preview-quick-replies {\n  padding: 0 14px 14px;\n  margin-top: 0;\n}\n.hw-awaiting {\n  margin-top: 2px;\n  padding-left: 44px;\n  font-size: 11px;\n  line-height: 1.4;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-preview-dock {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 8px;\n  pointer-events: none;\n}\n.hw-preview-dock > .hw-preview,\n.hw-preview-dock > .hw-preview-stack {\n  position: relative;\n  bottom: auto;\n  right: auto;\n  pointer-events: auto;\n}\n.hw-preview--closing {\n  animation: hw-preview-out 0.2s ease-in forwards;\n}\n.hw-preview-stack {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-preview-stack .hw-preview {\n  position: relative;\n  bottom: auto;\n  right: auto;\n}\n.hw-preview-stack.hw-preview-stack--anchored {\n  position: static;\n  bottom: auto;\n  right: auto;\n  width: 100%;\n}\n.hw-preview-more {\n  align-self: flex-end;\n  padding: 4px 10px;\n  border: 0;\n  border-radius: 999px;\n  background: var(--hw-bg);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), inset 0 0 0 1px var(--hw-border);\n  color: var(--hw-text-2);\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.4;\n  cursor: pointer;\n  transition: background 0.12s, color 0.12s;\n}\n.hw-preview-more:hover {\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n}\n.hw-preview--announcement {\n  width: 340px;\n}\n.hw-preview--announcement .hw-preview-body--title {\n  font-weight: 600;\n  color: var(--hw-text);\n  font-size: 15px;\n  line-height: 1.3;\n  padding-top: 10px;\n}\n.hw-preview--announcement .hw-preview-body--desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  line-height: 1.5;\n  padding-bottom: 16px;\n}\n.hw-announcement-badge {\n  display: inline-block;\n  margin: 8px 14px 0;\n  padding: 2px 8px;\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 10%, transparent);\n  border-radius: 4px;\n}\n.hw-whats-new {\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  overflow: hidden;\n}\n.hw-whats-new-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px 0;\n}\n.hw-whats-new-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--hw-text-2);\n}\n.hw-whats-new-view-all {\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-primary);\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  font-family: inherit;\n}\n.hw-whats-new-view-all:hover {\n  opacity: 0.8;\n}\n.hw-whats-new-list {\n  display: flex;\n  flex-direction: column;\n}\n.hw-whats-new-item {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n  transition: background-color 140ms ease;\n}\n.hw-whats-new-item:last-child {\n  border-bottom: none;\n}\n.hw-whats-new-item:hover {\n  background: rgba(0, 0, 0, 0.03);\n}\n.hw-whats-new-item-top {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n.hw-whats-new-badge {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--hw-primary);\n}\n.hw-whats-new-time {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  margin-left: auto;\n}\n.hw-whats-new-item-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--hw-text);\n  line-height: 1.3;\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n}\n.hw-whats-new-time-inline {\n  font-size: 11px;\n  font-weight: 400;\n  color: var(--hw-text-3);\n  margin-left: auto;\n  flex-shrink: 0;\n}\n.hw-whats-new-item-body {\n  font-size: 12px;\n  color: var(--hw-text-2);\n  line-height: 1.4;\n}\n.hw-tabs-dot {\n  position: absolute;\n  top: -2px;\n  right: -6px;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: var(--hw-primary);\n  animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.hw-bubble-badge-dot {\n  display: block;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: white;\n}\n.hw-content-search {\n  padding: 10px 16px;\n}\n.hw-content-search-box {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--hw-bg);\n  border: 1px solid var(--hw-border-md);\n  border-radius: 10px;\n  transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-content-search-box:focus-within {\n  border-color: var(--hw-focus-border);\n  box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-content-search-input {\n  flex: 1;\n  border: none !important;\n  outline: none !important;\n  box-shadow: none !important;\n  background: none;\n  font-size: 13px;\n  color: var(--hw-text-1);\n  font-family: inherit;\n  line-height: 1;\n  -webkit-appearance: none;\n}\n.hw-content-search-input:focus,\n.hw-content-search-input:focus-visible {\n  outline: none !important;\n  box-shadow: none !important;\n  border: none !important;\n}\n.hw-content-search-input::placeholder {\n  color: var(--hw-text-3);\n}\n.hw-content-search-icon {\n  width: 15px;\n  height: 15px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n}\n.hw-content-list {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n.hw-content-entries {\n  flex: 1;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n}\n.hw-content-entry {\n  display: block;\n  width: 100%;\n  padding: 14px 16px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  transition: background-color 0.15s ease;\n  -webkit-tap-highlight-color: transparent;\n}\n.hw-content-entry:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-content-entry:active {\n  background: var(--hw-border);\n}\n.hw-content-entry:last-child {\n  border-bottom: none;\n}\n.hw-content-entry-main {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.hw-content-entry-text {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n}\n.hw-content-entry-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text-1);\n  line-height: 1.3;\n}\n.hw-content-entry-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n.hw-content-entry-meta {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-top: 2px;\n}\n.hw-content-entry-badge {\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-text-3);\n  background: var(--hw-bg-hover);\n  padding: 1px 6px;\n  border-radius: 4px;\n}\n.hw-content-entry-date {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-content-entry-chevron {\n  width: 16px;\n  height: 16px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n  opacity: 0.5;\n}\n.hw-content-detail {\n  padding: 16px;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  flex: 1;\n  min-height: 0;\n}\n.hw-content-detail-header {\n  margin-bottom: 16px;\n}\n.hw-content-detail-title {\n  font-size: 17px;\n  font-weight: 700;\n  color: var(--hw-text-1);\n  margin: 0 0 6px;\n  line-height: 1.3;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.hw-content-detail-meta {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n}\n.hw-content-detail-date {\n  font-size: 12px;\n  color: var(--hw-text-3);\n}\n.hw-content-detail-body {\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--hw-text-1);\n}\n.hw-markdown h1 {\n  font-size: 17px;\n  font-weight: 700;\n  margin: 0;\n}\n.hw-markdown h2 {\n  font-size: 15px;\n  font-weight: 600;\n  margin: 0;\n}\n.hw-markdown h3 {\n  font-size: 14px;\n  font-weight: 600;\n  margin: 0;\n}\n.hw-markdown p {\n  margin: 0;\n}\n.hw-markdown p:empty,\n.hw-markdown div:empty,\n.hw-markdown p:has(> br:only-child),\n.hw-markdown div:has(> br:only-child) {\n  display: none;\n}\n.hw-markdown > * + * {\n  margin-top: 12px;\n}\n.hw-markdown > * + h1,\n.hw-markdown > * + h2 {\n  margin-top: 20px;\n}\n.hw-markdown > * + h3 {\n  margin-top: 16px;\n}\n.hw-markdown > h1 + *,\n.hw-markdown > h2 + *,\n.hw-markdown > h3 + * {\n  margin-top: 8px;\n}\n.hw-markdown > *:first-child {\n  margin-top: 0;\n}\n.hw-markdown > *:last-child {\n  margin-bottom: 0;\n}\n.hw-markdown > br {\n  display: none;\n}\n.hw-markdown ul,\n.hw-markdown ol {\n  margin: 0;\n  padding-left: 20px;\n}\n.hw-markdown li {\n  margin: 4px 0;\n}\n.hw-markdown code {\n  font-family:\n    ui-monospace,\n    "SF Mono",\n    monospace;\n  font-size: 12px;\n  background: var(--hw-bg-hover);\n  padding: 1px 5px;\n  border-radius: 4px;\n}\n.hw-table-wrap {\n  margin: 10px 0;\n  overflow-x: auto;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  border-radius: 10px;\n}\n.hw-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: 13px;\n}\n.hw-table th {\n  text-align: left;\n  font-weight: 600;\n  font-size: 12px;\n  padding: 8px 12px;\n  background: var(--hw-bg-hover, #f5f5f4);\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n}\n.hw-table td {\n  padding: 8px 12px;\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n  vertical-align: top;\n}\n.hw-table tbody tr:last-child td {\n  border-bottom: none;\n}\n.hw-code {\n  margin: 10px 0;\n  border-radius: 10px;\n  overflow: hidden;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  background: var(--hw-bg-hover, #f5f5f4);\n  font-family:\n    ui-monospace,\n    "SF Mono",\n    "Menlo",\n    monospace;\n}\n.hw-code-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 10px;\n  padding: 7px 8px 7px 12px;\n  font-size: 11px;\n  color: var(--hw-text-2, #6b7280);\n  background: rgba(0, 0, 0, 0.03);\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n}\n.hw-code-lang {\n  text-transform: lowercase;\n  letter-spacing: 0.02em;\n  font-weight: 500;\n}\n.hw-code-actions {\n  display: inline-flex;\n  align-items: center;\n  gap: 1px;\n}\n.hw-code-action {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 22px;\n  height: 22px;\n  padding: 0;\n  font-family: inherit;\n  color: var(--hw-text-2, #6b7280);\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  opacity: 0.62;\n  transition:\n    background 120ms ease,\n    color 120ms ease,\n    opacity 120ms ease,\n    scale 120ms ease;\n}\n.hw-code-action:hover {\n  color: var(--hw-text, #111);\n  background: rgba(0, 0, 0, 0.06);\n  opacity: 1;\n}\n.hw-code-action:active {\n  scale: 0.96;\n}\n.hw-code-action svg {\n  width: 13px;\n  height: 13px;\n}\n.hw-code-copy-icon,\n.hw-code-check-icon {\n  position: absolute;\n  inset: 50% auto auto 50%;\n  transition:\n    opacity 180ms cubic-bezier(0.2, 0, 0, 1),\n    scale 180ms cubic-bezier(0.2, 0, 0, 1),\n    filter 180ms cubic-bezier(0.2, 0, 0, 1);\n  translate: -50% -50%;\n}\n.hw-code-check-icon {\n  filter: blur(4px);\n  opacity: 0;\n  scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-copy-icon {\n  filter: blur(4px);\n  opacity: 0;\n  scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-check-icon {\n  filter: blur(0);\n  opacity: 1;\n  scale: 1;\n}\n.hw-code-copy-label {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n}\n.hw-code-copy--copied {\n  color: #16a34a;\n}\n.hw-code-copy--failed {\n  color: #dc2626;\n}\n.hw-code pre {\n  margin: 0;\n  padding: 10px 12px;\n  background: transparent;\n  border-radius: 0;\n  overflow-x: auto;\n  max-width: 100%;\n  max-height: 320px;\n  scrollbar-color: rgba(0, 0, 0, 0.22) transparent;\n  scrollbar-width: thin;\n}\n.hw-code pre::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.hw-code pre::-webkit-scrollbar-track {\n  background: transparent;\n}\n.hw-code pre::-webkit-scrollbar-thumb {\n  background: rgba(0, 0, 0, 0.18);\n  background-clip: content-box;\n  border: 3px solid transparent;\n  border-radius: 999px;\n}\n.hw-code pre::-webkit-scrollbar-thumb:hover {\n  background: rgba(0, 0, 0, 0.28);\n  background-clip: content-box;\n}\n.hw-code pre code {\n  display: block;\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.55;\n  white-space: pre;\n  color: var(--hw-text, #111);\n}\n@media (prefers-color-scheme: dark) {\n  .hw-code {\n    background: rgba(255, 255, 255, 0.04);\n    border-color: rgba(255, 255, 255, 0.08);\n  }\n  .hw-code-header {\n    background: rgba(255, 255, 255, 0.03);\n    border-bottom-color: rgba(255, 255, 255, 0.06);\n  }\n  .hw-code-action:hover,\n  .hw-code-action:focus-visible {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-code pre {\n    scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n  }\n  .hw-code pre::-webkit-scrollbar-thumb {\n    background: rgba(255, 255, 255, 0.22);\n    background-clip: content-box;\n  }\n  .hw-code pre::-webkit-scrollbar-thumb:hover {\n    background: rgba(255, 255, 255, 0.32);\n    background-clip: content-box;\n  }\n}\n.hw-markdown pre {\n  margin: 8px 0;\n  padding: 10px 12px;\n  background: var(--hw-bg-hover);\n  border-radius: 8px;\n  overflow-x: auto;\n  max-width: 100%;\n}\n.hw-markdown pre code {\n  display: block;\n  background: transparent;\n  padding: 0;\n  border-radius: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  white-space: pre;\n  word-break: normal;\n  color: inherit;\n}\n.hw-msg-bubble pre {\n  margin: 6px 0;\n  padding: 8px 10px;\n  background: rgba(0, 0, 0, 0.06);\n  border-radius: 6px;\n  overflow-x: auto;\n  max-width: 100%;\n}\n.hw-msg-bubble pre code {\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  white-space: pre;\n}\n.hw-msg-bubble .hw-code pre {\n  margin: 0;\n  padding: 10px 12px;\n  background: transparent;\n  border-radius: 0;\n}\n.hw-msg-bubble .hw-code pre code {\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.55;\n}\n.hw-msg--team .hw-msg-bubble pre,\n.hw-msg--visitor .hw-msg-bubble pre {\n  background: rgba(255, 255, 255, 0.12);\n}\n.hw-markdown blockquote {\n  margin: 0 0 12px;\n  padding: 8px 12px;\n  border-left: 3px solid var(--hw-border);\n  color: var(--hw-text-2);\n  font-style: italic;\n}\n.hw-markdown a {\n  color: var(--hw-primary);\n  text-decoration: underline;\n  text-underline-offset: 2px;\n}\n.hw-markdown img {\n  max-width: 100%;\n  border-radius: 8px;\n  margin: 8px 0;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-markdown hr {\n  border: none;\n  border-top: 1px solid var(--hw-border);\n  margin: 16px 0;\n}\n.hw-content-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n  text-align: center;\n}\n.hw-content-empty-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text-1);\n  margin-bottom: 4px;\n}\n.hw-content-empty-desc {\n  font-size: 12px;\n  color: var(--hw-text-3);\n}\n.hw-content-loading {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n}\n.hw-content-load-more {\n  display: block;\n  width: 100%;\n  padding: 10px;\n  border: none;\n  background: none;\n  color: var(--hw-primary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  text-align: center;\n}\n.hw-content-load-more:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-content-load-more:disabled {\n  opacity: 0.5;\n  cursor: default;\n}\n@media (hover: none) {\n  .hw-composer-preview-remove {\n    opacity: 0.7;\n  }\n}\n.hw-composer--dragging .hw-composer-box {\n  border-color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 4%, transparent);\n}\n.hw-composer-drop-overlay {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: color-mix(in srgb, var(--hw-bg) 90%, transparent);\n  border: 2px dashed var(--hw-primary);\n  border-radius: 12px;\n  z-index: 10;\n  pointer-events: none;\n  animation: hw-drop-pulse 1.5s ease-in-out infinite;\n}\n.hw-composer-drop-text {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-primary);\n}\n@keyframes hw-drop-pulse {\n  0%, 100% {\n    opacity: 0.8;\n  }\n  50% {\n    opacity: 1;\n  }\n}\n.hw-disconnect {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 7px;\n  padding: 7px 14px;\n  background: var(--hw-bg-hover);\n  color: var(--hw-text-2);\n  font-size: 11.5px;\n  font-weight: 500;\n  letter-spacing: -0.01em;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  flex-shrink: 0;\n  animation: hw-disconnect-in 0.18s cubic-bezier(0.22, 1, 0.36, 1);\n}\n@keyframes hw-disconnect-in {\n  from {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-disconnect-spinner {\n  width: 9px;\n  height: 9px;\n  border: 1.5px solid currentColor;\n  border-top-color: transparent;\n  border-radius: 50%;\n  opacity: 0.75;\n  flex-shrink: 0;\n  animation: hw-spin 0.7s linear infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-disconnect {\n    animation: none;\n  }\n  .hw-disconnect-spinner {\n    animation: none;\n    border-top-color: currentColor;\n    opacity: 0.5;\n  }\n}\n.hw-error-state {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px 24px;\n  text-align: center;\n  gap: 12px;\n}\n.hw-error-icon {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: #fef2f2;\n  color: #ef4444;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-error-icon svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-error-title {\n  font-size: 15px;\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-error-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n}\n.hw-error-btn {\n  padding: 8px 20px;\n  border: 1px solid var(--hw-border-md);\n  border-radius: 8px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.hw-error-btn:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-send-error {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: #fef2f2;\n  color: #dc2626;\n  font-size: 12px;\n  font-weight: 500;\n  flex-shrink: 0;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-send-error-retry {\n  margin-left: auto;\n  padding: 2px 8px;\n  border: 1px solid #fca5a5;\n  border-radius: 4px;\n  background: none;\n  color: #dc2626;\n  font-size: 11px;\n  font-weight: 600;\n  cursor: pointer;\n}\n.hw-send-error-retry:hover {\n  background: #fee2e2;\n}\n.hw-resolved {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 20px;\n  border-top: 1px solid var(--hw-border);\n  flex-shrink: 0;\n}\n.hw-resolved-text {\n  font-size: 13px;\n  color: var(--hw-text-3);\n  font-weight: 500;\n}\n.hw-resolved-actions {\n  display: flex;\n  gap: 8px;\n}\n.hw-resolved-reopen {\n  padding: 6px 16px;\n  border: 1px solid var(--hw-border-md);\n  border-radius: 8px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.hw-resolved-reopen:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-csat {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 8px;\n}\n.hw-csat-label {\n  font-size: 12px;\n  color: var(--hw-text-3);\n}\n.hw-csat-buttons {\n  display: flex;\n  gap: 8px;\n}\n.hw-csat-btn {\n  width: 36px;\n  height: 36px;\n  border: 1px solid var(--hw-border-md);\n  border-radius: 8px;\n  background: var(--hw-bg);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 18px;\n  transition:\n    transform 0.15s,\n    border-color 0.15s,\n    background 0.15s;\n}\n.hw-csat-btn:hover {\n  transform: scale(1.1);\n  border-color: var(--hw-text-3);\n}\n.hw-csat-btn--selected {\n  border-color: var(--hw-primary);\n  background: var(--hw-bg-hover);\n  transform: scale(1.15);\n}\n.hw-csat-thanks {\n  font-size: 12px;\n  color: #22c55e;\n  font-weight: 500;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-load-more-trigger {\n  display: flex;\n  justify-content: center;\n  min-height: 1px;\n}\n.hw-load-more-trigger:has(.hw-load-more-spinner) {\n  padding: 8px 0;\n}\n.hw-load-more-spinner {\n  display: flex;\n  gap: 3px;\n}\n.hw-load-more-spinner > div {\n  width: 5px;\n  height: 5px;\n  border-radius: 50%;\n  background: var(--hw-text-4);\n  animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-load-more-spinner > div:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-load-more-spinner > div:nth-child(3) {\n  animation-delay: 0.4s;\n}\n.hw-drag-handle {\n  display: none;\n}\n@media (max-width: 479px) {\n  .hw-drag-handle {\n    display: flex;\n    justify-content: center;\n    padding: 8px 0 4px;\n    flex-shrink: 0;\n  }\n  .hw-drag-handle-pill {\n    width: 32px;\n    height: 4px;\n    border-radius: 2px;\n    background: var(--hw-text-4);\n  }\n}\n.hw-msg-bubble p {\n  margin: 0 0 8px;\n}\n.hw-msg-bubble p:last-child {\n  margin-bottom: 0;\n}\n.hw-msg-bubble strong {\n  font-weight: 600;\n}\n.hw-msg-bubble em {\n  font-style: italic;\n}\n.hw-msg-bubble a {\n  color: inherit;\n  text-decoration: underline;\n  text-decoration-thickness: 1px;\n  text-underline-offset: 2px;\n  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);\n  word-break: normal;\n  overflow-wrap: anywhere;\n}\n.hw-msg-bubble a:hover {\n  opacity: 0.8;\n}\n.hw-msg--visitor .hw-msg-bubble a {\n  color: rgba(255, 255, 255, 0.9);\n}\n.hw-msg--visitor .hw-msg-bubble a:hover {\n  color: white;\n}\n.hw-msg-bubble ul,\n.hw-msg-bubble ol {\n  margin: 4px 0 8px;\n  padding-left: 20px;\n}\n.hw-msg-bubble li {\n  margin: 2px 0;\n}\n.hw-msg-bubble code {\n  padding: 1px 4px;\n  border-radius: 3px;\n  background: rgba(0, 0, 0, 0.06);\n  font-size: 0.9em;\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    monospace;\n}\n.hw-msg-bubble pre {\n  margin: 4px 0 8px;\n  padding: 8px 10px;\n  border-radius: 6px;\n  background: rgba(0, 0, 0, 0.06);\n  overflow-x: auto;\n  font-size: 0.85em;\n}\n.hw-msg-bubble pre code {\n  padding: 0;\n  background: none;\n}\n.hw-msg-bubble blockquote {\n  margin: 4px 0 8px;\n  padding: 4px 0 4px 12px;\n  border-left: 3px solid var(--hw-border-md);\n  color: var(--hw-text-2);\n}\n.hw-widget[data-theme=dark] {\n  --hw-bg: #1c1c1e;\n  --hw-bg-subtle: #161618;\n  --hw-bg-hover: #2c2c2e;\n  --hw-border: rgba(255, 255, 255, 0.08);\n  --hw-border-md: rgba(255, 255, 255, 0.14);\n  --hw-text: #f5f5f5;\n  --hw-text-1: #f5f5f5;\n  --hw-text-2: #a1a1aa;\n  --hw-text-3: #71717a;\n  --hw-text-4: #52525b;\n  --hw-visitor-bubble-bg: #2c2c2e;\n  --hw-visitor-bubble-text: #f5f5f5;\n  --hw-focus-border: rgba(255, 255, 255, 0.28);\n  --hw-focus-ring: rgba(255, 255, 255, 0.08);\n  --hw-brand: #f5f5f5;\n  --hw-on-brand: #1c1c1e;\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light]) .hw-messages {\n    scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n  }\n  .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb {\n    background: rgba(255, 255, 255, 0.2);\n    background-clip: content-box;\n  }\n  .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb:hover {\n    background: rgba(255, 255, 255, 0.32);\n    background-clip: content-box;\n  }\n  .hw-widget:not([data-theme=light]) {\n    --hw-bg: #1c1c1e;\n    --hw-bg-subtle: #161618;\n    --hw-bg-hover: #2c2c2e;\n    --hw-border: rgba(255, 255, 255, 0.08);\n    --hw-border-md: rgba(255, 255, 255, 0.14);\n    --hw-text: #f5f5f5;\n    --hw-text-1: #f5f5f5;\n    --hw-text-2: #a1a1aa;\n    --hw-text-3: #71717a;\n    --hw-text-4: #52525b;\n    --hw-visitor-bubble-bg: #2c2c2e;\n    --hw-visitor-bubble-text: #f5f5f5;\n    --hw-focus-border: rgba(255, 255, 255, 0.28);\n    --hw-focus-ring: rgba(255, 255, 255, 0.08);\n    --hw-brand: #f5f5f5;\n    --hw-on-brand: #1c1c1e;\n  }\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light]) .hw-header {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-header-bot-icon {\n    background: var(--hw-bg-hover);\n  }\n  .hw-header-name,\n  .hw-header-title {\n    color: var(--hw-text);\n  }\n  .hw-header-status {\n    color: var(--hw-text-2);\n  }\n  .hw-header-close,\n  .hw-header-back {\n    color: var(--hw-text-2);\n  }\n  .hw-header-close:hover,\n  .hw-header-back:hover {\n    background: var(--hw-bg-hover);\n    color: var(--hw-text);\n  }\n  .hw-content-entry {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-content-entry:hover {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border-md);\n  }\n  .hw-content-empty,\n  .hw-empty {\n    color: var(--hw-text-3);\n  }\n  .hw-conv-card {\n    border-color: var(--hw-border);\n  }\n  .hw-recent-row {\n    border-color: var(--hw-border);\n  }\n  .hw-composer-drop-overlay {\n    background: rgba(0, 0, 0, 0.6);\n    color: var(--hw-text);\n  }\n  .hw-composer--dragging .hw-composer-box {\n    border-color: var(--hw-focus-border);\n    box-shadow: 0 0 0 3px var(--hw-focus-ring);\n  }\n  .hw-hero {\n    background:\n      linear-gradient(\n        160deg,\n        color-mix(in srgb, var(--hw-primary) 40%, black) 0%,\n        var(--hw-primary) 50%,\n        color-mix(in srgb, var(--hw-primary) 25%, black) 100%);\n  }\n  .hw-sheet {\n    background: var(--hw-bg);\n  }\n  .hw-card {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border);\n  }\n  .hw-card:hover {\n    background: #333;\n  }\n  .hw-window {\n    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);\n  }\n  .hw-bubble:focus-visible {\n    outline-color: var(--hw-text-3);\n  }\n  .hw-msg--visitor .hw-msg-bubble {\n    background: var(--hw-primary);\n    color: white;\n  }\n  .hw-msg-bubble code {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-msg-bubble pre {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-composer-box {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-composer-input {\n    color: var(--hw-text);\n  }\n  .hw-tabs {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-conv-card:hover,\n  .hw-recent-row:hover {\n    background: var(--hw-bg-hover);\n  }\n  .hw-send-error {\n    background: #450a0a;\n    color: #fca5a5;\n  }\n  .hw-error-icon {\n    background: #450a0a;\n    color: #f87171;\n  }\n  .hw-resolved {\n    border-color: var(--hw-border);\n  }\n  .hw-resolved-reopen,\n  .hw-csat-btn {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border-md);\n    color: var(--hw-text);\n  }\n  .hw-hover-preview {\n    background: #1c1c1e;\n    border-color: var(--hw-border);\n  }\n  .hw-content-search-box {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border-md);\n  }\n  .hw-preview {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n}\n.hw-widget[data-hw-placement=docked] {\n  --hw-dock-width: 600px;\n  --hw-dock-bar-width: 480px;\n  --hw-dock-inset: 24px;\n  --hw-bar-max-height: 148px;\n  --hw-dock-surface: #ffffff;\n  --hw-dock-on-surface: #111111;\n  --hw-dock-pill-bg: rgba(44, 44, 48, 0.66);\n  --hw-dock-pill-fg: rgba(255, 255, 255, 0.94);\n  --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] {\n  z-index: 2147483000;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: var(--hw-dock-inset);\n  z-index: 2147483000;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  pointer-events: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock > * {\n  pointer-events: auto;\n}\n.hw-dock-suggestions {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 9px;\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  margin-bottom: 14px;\n}\n.hw-dock-pill-row {\n  align-self: flex-start;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  animation: hw-dock-pill-in 0.42s cubic-bezier(0.2, 0.9, 0.3, 1) both;\n}\n.hw-dock-pill-dismiss {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  padding: 0;\n  border: 0;\n  background: none;\n  color: var(--hw-dock-pill-fg);\n  cursor: pointer;\n  align-self: flex-start;\n  margin-top: 8px;\n  opacity: 0;\n  transform: scale(0.85);\n  transition:\n    opacity 0.12s linear,\n    transform 0.12s cubic-bezier(0.25, 1, 0.5, 1),\n    color 0.12s linear;\n}\n.hw-dock-pill-dismiss svg {\n  width: 11px;\n  height: 11px;\n}\n.hw-dock-suggestions:hover .hw-dock-pill-dismiss,\n.hw-dock-suggestions:focus-within .hw-dock-pill-dismiss {\n  opacity: 1;\n  transform: none;\n}\n.hw-dock-pill-dismiss:hover {\n  color: var(--hw-dock-on-surface);\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-pill-dismiss {\n    transition: none;\n  }\n}\n@media (hover: none) {\n  .hw-dock-pill-dismiss {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-dock-pill {\n  align-self: flex-start;\n  padding: 10px 18px;\n  border: 1px solid var(--hw-dock-pill-border, transparent);\n  border-radius: 999px;\n  cursor: pointer;\n  font: inherit;\n  font-size: 14px;\n  font-weight: 500;\n  text-align: left;\n  background: var(--hw-dock-pill-bg);\n  color: var(--hw-dock-pill-fg);\n  backdrop-filter: blur(10px) saturate(1.2);\n  -webkit-backdrop-filter: blur(10px) saturate(1.2);\n  box-shadow: 0 4px 14px -8px rgba(12, 11, 10, 0.28);\n  transition:\n    background 0.16s,\n    border-color 0.16s,\n    transform 0.16s;\n}\n.hw-dock-pill {\n  backdrop-filter: blur(18px);\n  -webkit-backdrop-filter: blur(18px);\n}\n.hw-dock-pill:hover {\n  background: color-mix(in srgb, var(--hw-dock-pill-bg) 100%, var(--hw-dock-on-surface) 8%);\n  border-color: color-mix(in srgb, var(--hw-dock-pill-border) 100%, var(--hw-dock-on-surface) 10%);\n  transform: translateX(3px);\n}\n@keyframes hw-dock-pill-in {\n  from {\n    opacity: 0;\n    transform: translateY(10px) scale(0.97);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-dock-bar {\n  display: flex;\n  align-items: flex-end;\n  gap: 10px;\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  min-height: 52px;\n  padding: 10px 10px 10px 18px;\n  border: 0;\n  border-radius: 26px;\n  background: var(--hw-dock-surface);\n  color: var(--hw-dock-on-surface);\n  box-shadow:\n    inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n    0 0 0 1px color-mix(in srgb, var(--hw-dock-on-surface) 7%, transparent),\n    0 2px 6px rgba(12, 11, 10, 0.18),\n    0 20px 48px -14px rgba(12, 11, 10, 0.45);\n  transition:\n    border-radius 0.18s ease,\n    box-shadow 0.2s cubic-bezier(0.2, 0.8, 0.2, 1),\n    width 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);\n}\n.hw-dock-bar:focus-within {\n  box-shadow:\n    inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n    0 0 0 1px color-mix(in srgb, var(--hw-primary, #fb923c) 60%, transparent),\n    0 2px 6px rgba(12, 11, 10, 0.18),\n    0 20px 48px -14px rgba(12, 11, 10, 0.45);\n}\n.hw-dock-bar[data-grown=true] {\n  border-radius: 20px;\n}\n.hw-dock-input {\n  flex: 1;\n  min-width: 0;\n  min-height: 20px;\n  max-height: var(--hw-bar-max-height);\n  padding: 6px 0;\n  border: 0;\n  outline: none;\n  resize: none;\n  overflow-y: auto;\n  background: transparent;\n  color: var(--hw-dock-on-surface);\n  font: inherit;\n  font-size: 14px;\n  line-height: 1.45;\n  transition: height 0.12s ease;\n}\n.hw-dock-input::placeholder {\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 45%, transparent);\n}\n.hw-dock-send {\n  flex: none;\n  width: 32px;\n  height: 32px;\n  margin-bottom: 1px;\n  border: 0;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  background: var(--hw-primary, #fb923c);\n  color: var(--hw-on-brand, #fff);\n  transition: transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.16s;\n}\n.hw-dock-send:hover:not(:disabled) {\n  transform: scale(1.06);\n}\n.hw-dock-send:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  position: fixed;\n  left: 50%;\n  right: auto;\n  margin-left: calc(var(--hw-dock-width) / -2);\n  bottom: calc(var(--hw-dock-inset) + 66px);\n  width: var(--hw-dock-width);\n  max-width: calc(100vw - 32px);\n  height: 420px;\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    left: 16px;\n    right: 16px;\n    margin-left: 0;\n    width: auto;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-bubble {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-window {\n  bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-suggestions {\n  display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-pill,\n  .hw-dock-bar,\n  .hw-dock-input,\n  .hw-dock-send {\n    animation: none;\n    transition: none;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-composer,\n.hw-widget[data-hw-placement=docked] .hw-tabs,\n.hw-widget[data-hw-placement=docked] .hw-footer-tabs {\n  display: none;\n}\n.hw-starters {\n  display: flex;\n  flex-direction: column;\n  margin-top: 10px;\n  border-radius: 14px;\n  overflow: hidden;\n  background: var(--hw-bg);\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n}\n.hw-starter {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 11px 14px;\n  border: 0;\n  border-radius: 0;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text);\n  font: inherit;\n  text-align: left;\n  animation: hw-starter-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n  transition: background 0.12s;\n}\n.hw-starter + .hw-starter {\n  box-shadow: inset 0 1px 0 var(--hw-border);\n}\n.hw-starter:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-starter-text {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 1px;\n}\n.hw-starter-k {\n  font-size: 13px;\n  font-weight: 550;\n  line-height: 1.35;\n  color: var(--hw-text);\n}\n.hw-starter-q {\n  font-size: 12px;\n  line-height: 1.35;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-starter svg {\n  flex: none;\n  color: var(--hw-text-3, var(--hw-text-muted));\n  opacity: 0.45;\n  transition: opacity 0.15s, transform 0.15s;\n}\n.hw-starter:hover svg {\n  opacity: 0.9;\n  transform: translateX(2px);\n}\n@keyframes hw-starter-in {\n  from {\n    opacity: 0;\n    transform: translateY(6px);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-header-back {\n  display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-starter {\n    animation: none;\n  }\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light])[data-hw-placement=docked] {\n    --hw-dock-surface: #1f1f23;\n    --hw-dock-on-surface: #f4f4f6;\n    --hw-dock-pill-bg: rgba(255, 255, 255, 0.1);\n    --hw-dock-pill-fg: #e4e4e7;\n    --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n  }\n}\n.hw-widget[data-theme=dark][data-hw-placement=docked] {\n  --hw-dock-surface: #1f1f23;\n  --hw-dock-on-surface: #f4f4f6;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  --hw-bg: rgba(255, 255, 255, 0.08);\n  --hw-bg-subtle: transparent;\n  --hw-bg-hover: rgba(255, 255, 255, 0.1);\n  --hw-border: rgba(255, 255, 255, 0.14);\n  --hw-border-md: rgba(255, 255, 255, 0.22);\n  --hw-text: rgba(255, 255, 255, 0.94);\n  --hw-text-1: #ffffff;\n  --hw-text-2: rgba(255, 255, 255, 0.72);\n  --hw-text-3: rgba(255, 255, 255, 0.62);\n  --hw-text-4: rgba(255, 255, 255, 0.46);\n  --hw-visitor-bubble-bg: rgba(255, 255, 255, 0.16);\n  --hw-visitor-bubble-text: #ffffff;\n  --hw-brand: rgba(255, 255, 255, 0.92);\n  --hw-on-brand: #17161a;\n  --hw-focus-border: rgba(255, 255, 255, 0.34);\n  --hw-focus-ring: rgba(255, 255, 255, 0.1);\n  height: 500px;\n  max-height: calc(100vh - 180px);\n  border-radius: 24px;\n  color: var(--hw-text);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(40, 40, 44, 0.72) 0%,\n      rgba(46, 46, 50, 0.7) 55%,\n      rgba(52, 52, 56, 0.68) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    background: #2c2c2e;\n  }\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    height: min(60vh, 460px);\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-header--sub {\n  padding: 14px 12px 8px 16px;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-status {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-name {\n  font-size: 15.5px;\n  font-weight: 560;\n  letter-spacing: -0.006em;\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-conv-name,\n.hw-widget[data-hw-placement=docked] .hw-event-name {\n  font-weight: 545;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-bot-icon {\n  border-radius: 50%;\n  overflow: hidden;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-close:hover,\n.hw-widget[data-hw-placement=docked] .hw-header-menu-btn:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-messages {\n  padding: 4px 22px 16px;\n  gap: 18px;\n  -webkit-mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 16px);\n  mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 16px);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--ai .hw-msg-bubble,\n.hw-widget[data-hw-placement=docked] .hw-msg--team .hw-msg-bubble {\n  padding: 0;\n  background: transparent;\n  border-radius: 0;\n  font-size: 15px;\n  line-height: 1.55;\n  color: var(--hw-text);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--visitor .hw-msg-bubble {\n  background: rgba(255, 255, 255, 0.16);\n  color: #ffffff;\n  font-size: 14.5px;\n  line-height: 1.5;\n}\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble pre,\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble code {\n  background: rgba(0, 0, 0, 0.28);\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row {\n  background: rgba(0, 0, 0, 0.26);\n  border-color: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] .hw-window :focus-visible {\n  outline-color: rgba(255, 255, 255, 0.55);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus,\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus-visible {\n  outline: none;\n  box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row:focus-within {\n  border-color: rgba(255, 255, 255, 0.42);\n  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-submit {\n  background: #ffffff;\n  color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n  position: relative;\n  z-index: 3;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu {\n  background: #3a3a3f;\n  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16), 0 18px 44px -12px rgba(12, 11, 10, 0.62);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button:hover {\n  background: rgba(255, 255, 255, 0.11);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button.hw-header-menu-conv[data-active=true] {\n  background: rgba(255, 255, 255, 0.09);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-convs {\n  border-bottom-color: rgba(255, 255, 255, 0.12);\n}\n.hw-widget[data-hw-placement=docked] .hw-event--card {\n  margin: 0;\n  background: rgba(255, 255, 255, 0.08);\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-event-avatar {\n  background: rgba(255, 255, 255, 0.14);\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview {\n  position: fixed;\n  left: 50%;\n  right: auto;\n  margin-left: calc(var(--hw-dock-bar-width, var(--hw-dock-width)) / -2);\n  bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  border: 0;\n  border-radius: 24px;\n  color: rgba(255, 255, 255, 0.94);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(40, 40, 44, 0.74) 0%,\n      rgba(52, 52, 56, 0.7) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-name,\n.hw-widget[data-hw-placement=docked] .hw-preview-body {\n  color: rgba(255, 255, 255, 0.94);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close {\n  color: rgba(255, 255, 255, 0.6);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-footer {\n  color: rgba(255, 255, 255, 0.55);\n  border-top-color: rgba(255, 255, 255, 0.1);\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-preview {\n    left: 16px;\n    right: 16px;\n    margin-left: 0;\n    width: auto;\n  }\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-preview {\n    background: #2c2c2e;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn {\n  padding: 7px 14px;\n  font-size: 13px;\n  font-weight: 550;\n  border-radius: 999px;\n  background: rgba(255, 255, 255, 0.94);\n  box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n  color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn:hover:not(:disabled) {\n  background: #ffffff;\n  box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n  transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn[data-tapped=true] {\n  background: rgba(255, 255, 255, 0.22);\n  color: #ffffff;\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);\n  transform: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn svg {\n  opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer {\n  padding: 7px 14px;\n  font-size: 13px;\n  background: rgba(255, 255, 255, 0.94);\n  color: #17161a;\n  box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n  transition:\n    background 0.15s,\n    box-shadow 0.15s,\n    transform 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer:hover {\n  background: #ffffff;\n  color: #17161a;\n  box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n  transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-offer svg {\n  opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar {\n  --hw-dock-on-surface: rgba(255, 255, 255, 0.94);\n  color: rgba(255, 255, 255, 0.94);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(44, 44, 48, 0.74) 0%,\n      rgba(52, 52, 56, 0.72) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 18px 40px -16px rgba(12, 11, 10, 0.45);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n  width: var(--hw-dock-width);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar:focus-within {\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26), 0 18px 40px -16px rgba(12, 11, 10, 0.5);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 22px 52px -18px rgba(12, 11, 10, 0.52);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-send:not(:disabled) {\n  background: #ffffff;\n  color: #17161a;\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-dock-bar {\n    background: #2c2c2e;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  transform-origin: 50% 100%;\n  animation: hw-dock-panel-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing {\n  animation: hw-dock-panel-out 0.18s cubic-bezier(0.4, 0, 1, 1) forwards;\n}\n@keyframes hw-dock-panel-in {\n  from {\n    opacity: 0;\n    transform: translateY(14px) scale(0.98);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n@keyframes hw-dock-panel-out {\n  from {\n    opacity: 1;\n    transform: none;\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.99);\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n  animation: hw-dock-settle 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.06s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n  animation: hw-dock-settle 0.34s cubic-bezier(0.16, 1, 0.3, 1) 0.11s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-header--sub,\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-messages {\n  animation: none;\n}\n@keyframes hw-dock-settle {\n  from {\n    opacity: 0;\n    transform: translateY(7px);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-widget[data-hw-placement=docked] .hw-window,\n  .hw-widget[data-hw-placement=docked] .hw-window--closing,\n  .hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub,\n  .hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n    animation: none;\n  }\n}\n.hw-dock-bar {\n  flex-wrap: wrap;\n  padding-left: 18px;\n  padding-right: 8px;\n}\n.hw-dock-error {\n  width: var(--hw-dock-width);\n  max-width: calc(100vw - 32px);\n  margin-bottom: 8px;\n  padding: 8px 14px;\n  border-radius: 14px;\n  background: rgba(190, 24, 40, 0.92);\n  color: #ffffff;\n  font-size: 12.5px;\n  line-height: 1.35;\n  box-shadow: 0 10px 26px -12px rgba(12, 11, 10, 0.5);\n  animation: hw-dock-settle 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-error {\n    animation: none;\n  }\n}\n.hw-dock-previews {\n  flex: 0 0 100%;\n  order: -1;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  padding: 2px 0 8px;\n}\n.hw-dock-lead {\n  flex: none;\n  display: grid;\n  place-items: center;\n  width: 32px;\n  height: 32px;\n  margin-left: -8px;\n}\n.hw-dock-actions {\n  flex: none;\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  margin-bottom: 1px;\n}\n.hw-dock-tool {\n  display: grid;\n  place-items: center;\n  width: 30px;\n  height: 30px;\n  border: 0;\n  border-radius: 50%;\n  background: transparent;\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 52%, transparent);\n  cursor: pointer;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-dock-tool:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--hw-dock-on-surface) 8%, transparent);\n  color: var(--hw-dock-on-surface);\n}\n.hw-dock-tool:disabled {\n  opacity: 0.4;\n  cursor: default;\n}\n.hw-dock-tool[data-active=true] {\n  color: #e11d48;\n  background: rgba(225, 29, 72, 0.12);\n  animation: hw-dock-listening 1.4s ease-in-out infinite;\n}\n@keyframes hw-dock-listening {\n  0%, 100% {\n    box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.35);\n  }\n  50% {\n    box-shadow: 0 0 0 4px rgba(225, 29, 72, 0);\n  }\n}\n.hw-dock-send:disabled {\n  opacity: 1;\n  background: color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent);\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 38%, transparent);\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-tool[data-active=true] {\n    animation: none;\n  }\n  .hw-dock-bar {\n    transition: none;\n  }\n}\n.hw-dock-input:focus,\n.hw-dock-input:focus-visible {\n  outline: none;\n  box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-powered {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-disconnect {\n  border-radius: 20px 20px 0 0;\n}\n.hw-msg-meta {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n.hw-msg-author {\n  font-weight: 550;\n}\n.hw-msg-meta-sep {\n  opacity: 0.55;\n}\n.hw-header-actions {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 2px;\n}\n.hw-header-menu-btn {\n  display: grid;\n  place-items: center;\n  width: 30px;\n  height: 30px;\n  border: 0;\n  border-radius: 8px;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text-2, var(--hw-text-muted));\n  transition: background 0.15s, color 0.15s;\n}\n.hw-header-menu-btn:hover {\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n}\n.hw-header-menu {\n  position: absolute;\n  top: 36px;\n  right: 0;\n  z-index: 6;\n  min-width: 236px;\n  max-width: 288px;\n  padding: 5px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  box-shadow: 0 0 0 1px var(--hw-border), 0 12px 32px -10px rgba(0, 0, 0, 0.32);\n  animation: hw-menu-in 0.16s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n}\n@keyframes hw-menu-in {\n  from {\n    opacity: 0;\n    transform: translateY(-4px) scale(0.98);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-header-menu button {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 9px 10px;\n  border: 0;\n  border-radius: 9px;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text);\n  font: inherit;\n  font-size: 13px;\n  text-align: left;\n  transition: background 0.14s;\n}\n.hw-header-menu button:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-header-menu button svg {\n  flex: none;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu button:hover svg {\n  color: var(--hw-brand, var(--hw-primary));\n}\n.hw-header-menu-convs {\n  display: flex;\n  flex-direction: column;\n  max-height: 168px;\n  overflow-y: auto;\n  padding-bottom: 5px;\n  margin-bottom: 5px;\n  border-bottom: 1px solid var(--hw-border);\n}\n.hw-header-menu button.hw-header-menu-conv {\n  flex-direction: column;\n  align-items: stretch;\n  gap: 2px;\n  padding: 8px 10px;\n}\n.hw-header-menu button.hw-header-menu-conv[data-active=true] {\n  background: var(--hw-bg-hover);\n}\n.hw-header-menu-conv-top {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  gap: 8px;\n}\n.hw-header-menu-conv-name {\n  overflow: hidden;\n  font-size: 12.5px;\n  font-weight: 600;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.hw-header-menu-conv-time {\n  flex: none;\n  font-size: 11px;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu-conv-preview {\n  overflow: hidden;\n  font-size: 12px;\n  color: var(--hw-text-2);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.hw-offers {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-top: 10px;\n}\n.hw-offer {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 14px;\n  border: 0;\n  border-radius: 999px;\n  cursor: pointer;\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n  font: inherit;\n  font-size: 12.5px;\n  font-weight: 550;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-offer:hover {\n  background: var(--hw-brand, var(--hw-primary));\n  color: var(--hw-on-brand, #fff);\n}\n.hw-offer svg {\n  flex: none;\n}\n.hw-sources {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  margin-top: 8px;\n}\n.hw-source {\n  display: flex;\n  align-items: center;\n  gap: 9px;\n  padding: 7px 10px;\n  border-radius: 9px;\n  background: transparent;\n  color: var(--hw-text);\n  text-decoration: none;\n  transition: background 0.15s;\n}\na.hw-source {\n  cursor: pointer;\n}\na.hw-source:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-source-n {\n  display: grid;\n  place-items: center;\n  flex: none;\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  background: var(--hw-brand, var(--hw-primary));\n  color: var(--hw-on-brand, #fff);\n  font-size: 10px;\n  font-weight: 700;\n  font-variant-numeric: tabular-nums;\n}\n.hw-source-title {\n  flex: 1;\n  min-width: 0;\n  font-size: 12px;\n  font-weight: 550;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n');
+styleInject(':host {\n  all: initial;\n  font-family:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n  font-size: 14px;\n  line-height: 1.5;\n  color: #1a1a1a;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget {\n  font-family:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n  font-size: 14px;\n  line-height: 1.5;\n  color: #1a1a1a;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget *,\n.hw-widget *::before,\n.hw-widget *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n.hw-widget :where(p, li, strong, b, em, i, u, s, small, a, code, pre, blockquote, h1, h2, h3, h4, h5, h6) {\n  color: inherit;\n}\n:where(.hw-widget) {\n  --hw-primary: #171717;\n  --hw-primary-hover: #2a2a2a;\n  --hw-brand: #171717;\n  --hw-on-brand: #ffffff;\n  --hw-focus-border: #9ca3af;\n  --hw-focus-ring: rgba(0, 0, 0, 0.06);\n  --hw-accent: #6366f1;\n  --hw-bg: #ffffff;\n  --hw-bg-subtle: #fafaf9;\n  --hw-bg-hover: #f5f5f4;\n  --hw-border: #ebe9e5;\n  --hw-border-md: #e5e5e5;\n  --hw-text: #1c1b19;\n  --hw-text-1: #111;\n  --hw-text-2: #666;\n  --hw-text-3: #8a847c;\n  --hw-text-4: #a8a29a;\n  --hw-radius: 20px;\n  --hw-visitor-bubble-bg: #f5f5f4;\n  --hw-visitor-bubble-text: #1a1a1a;\n  --hw-font:\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    Roboto,\n    "Helvetica Neue",\n    Arial,\n    sans-serif;\n}\n.hw-agent-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-agent-icon {\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n}\n.hw-widget :is(.hw-header-bot-icon, .hw-hero-bot-icon, .hw-conv-card-avatar, .hw-event-avatar, .hw-bubble-icon--bot):has(> .hw-agent-custom) {\n  border-radius: 50%;\n  background: transparent;\n  padding: 0;\n}\n.hw-widget :focus-visible {\n  outline: 2px solid var(--hw-primary);\n  outline-offset: 2px;\n}\n.hw-widget :focus:not(:focus-visible) {\n  outline: none;\n}\n.hw-widget {\n  position: fixed;\n  bottom: 20px;\n  right: var(--hw-position-right, 20px);\n  left: var(--hw-position-left, auto);\n  z-index: 999999;\n  font-family: var(--hw-font);\n}\n@keyframes hw-bubble-enter {\n  from {\n    opacity: 0;\n    transform: scale(0.6);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n.hw-bubble {\n  width: 48px;\n  height: 48px;\n  border-radius: 14px;\n  background: var(--hw-primary);\n  color: white;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n  position: relative;\n  overflow: visible;\n  animation: hw-bubble-enter 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) both;\n}\n.hw-bubble--rounded {\n  border-radius: 14px;\n}\n.hw-bubble--square {\n  border-radius: 8px;\n}\n.hw-bubble--pill {\n  border-radius: 24px;\n}\n.hw-bubble--launcher-bubble,\n.hw-bubble--launcher-help {\n  width: auto;\n  padding: 0 16px 0 12px;\n  gap: 8px;\n  border-radius: 24px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--square,\n.hw-bubble--launcher-help.hw-bubble--square {\n  border-radius: 8px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--rounded,\n.hw-bubble--launcher-help.hw-bubble--rounded {\n  border-radius: 14px;\n}\n.hw-bubble-label {\n  font-size: 14px;\n  font-weight: 600;\n  white-space: nowrap;\n  line-height: 1;\n  position: static;\n  opacity: 1;\n  transform: none;\n}\n.hw-bubble--launcher-bubble .hw-bubble-icon,\n.hw-bubble--launcher-help .hw-bubble-icon {\n  position: static;\n}\n.hw-bubble:hover {\n  transform: scale(1.05);\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);\n}\n.hw-bubble:active {\n  transform: scale(0.95);\n}\n.hw-bubble--open {\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n}\n.hw-bubble:focus-visible {\n  outline: 2px solid white;\n  outline-offset: 2px;\n}\n.hw-bubble-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;\n}\n.hw-bubble-icon svg:not(.hw-agent-custom svg) {\n  width: 22px;\n  height: 22px;\n}\n.hw-bubble-icon--hidden {\n  transform: scale(0.3) rotate(90deg);\n  opacity: 0;\n}\n.hw-bubble-icon--bot {\n}\n.hw-bubble--avatar .hw-bubble-icon--bot {\n  width: 100%;\n  height: 100%;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img {\n  width: 100%;\n  height: 100%;\n  border-radius: 0;\n}\n.hw-agent-img.hw-agent-img--logo {\n  object-fit: contain;\n  padding: 10px;\n  box-sizing: border-box;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img.hw-agent-img--logo {\n  padding: 10px;\n  box-sizing: border-box;\n  object-fit: contain;\n}\n.hw-bubble-icon--close svg {\n  width: 22px;\n  height: 22px;\n}\n.hw-bubble-badge {\n  position: absolute;\n  top: -4px;\n  right: -4px;\n  min-width: 20px;\n  height: 20px;\n  border-radius: 10px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  border: 2px solid white;\n  animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n@keyframes hw-badge-pop {\n  from {\n    transform: scale(0);\n  }\n  to {\n    transform: scale(1);\n  }\n}\n.hw-bubble-badge::after {\n  content: "";\n  position: absolute;\n  inset: -2px;\n  border-radius: inherit;\n  background: var(--hw-primary);\n  opacity: 0;\n  animation: hw-badge-pulse 2s ease-out infinite;\n}\n@keyframes hw-badge-pulse {\n  0% {\n    opacity: 0.5;\n    transform: scale(1);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1.8);\n  }\n}\n.hw-window {\n  position: absolute;\n  bottom: 72px;\n  right: var(--hw-window-right, 0);\n  left: var(--hw-window-left, auto);\n  width: 440px;\n  height: 640px;\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n  border-radius: var(--hw-radius);\n  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  animation: hw-window-open 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);\n  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1), height 280ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.hw-window--reading {\n  width: min(720px, calc(100vw - 40px));\n  height: min(800px, calc(100vh - 112px));\n}\n:host([data-hw-mode="mobile"]) .hw-window,\n:host([data-hw-mode="mobile"]) .hw-window--reading {\n  position: fixed;\n  inset: 0;\n  width: 100%;\n  height: var(--hw-visible-height, 100%);\n  border-radius: 0;\n  box-shadow: none;\n  animation: none;\n}\n:host([data-hw-mode="mobile"]) .hw-hero {\n  background-color: color-mix(in srgb, var(--hw-primary) 60%, black);\n}\n:host([data-hw-mode="mobile"]) .hw-bubble {\n  display: none;\n}\n.hw-window[data-hw-keyboard] .hw-composer {\n  padding-bottom: 8px;\n}\n.hw-window[data-hw-keyboard] .hw-powered {\n  display: none;\n}\n@keyframes hw-window-open {\n  from {\n    opacity: 0;\n    transform: translateY(12px) scale(0.96);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n.hw-window--closing {\n  animation: hw-window-close 0.2s ease forwards;\n}\n@keyframes hw-window-close {\n  from {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.98);\n  }\n}\n.hw-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  min-height: 0;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-window,\n  .hw-window--closing,\n  .hw-content,\n  .hw-msg,\n  .hw-bubble,\n  .hw-bubble-icon,\n  .hw-bubble-badge,\n  .hw-bubble-badge::after,\n  .hw-typing-dot,\n  .hw-loading-dot {\n    animation-duration: 0.01ms !important;\n    transition-duration: 0.01ms !important;\n  }\n}\n.hw-hero {\n  flex-shrink: 0;\n  background:\n    linear-gradient(\n      160deg,\n      color-mix(in srgb, var(--hw-primary) 60%, black) 0%,\n      var(--hw-primary) 50%,\n      color-mix(in srgb, var(--hw-primary) 40%, black) 100%);\n  color: white;\n  padding: 20px 22px 40px;\n}\n.hw-hero-top {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n}\n.hw-hero-close {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n  border: none;\n  background: rgba(255, 255, 255, 0.1);\n  color: rgba(255, 255, 255, 0.6);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-hero-close:hover {\n  background: rgba(255, 255, 255, 0.2);\n  color: white;\n}\n.hw-hero-close:active {\n  transform: scale(0.92);\n  transition:\n    transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n    background 0.15s,\n    color 0.15s;\n}\n.hw-hero-close svg {\n  width: 20px;\n  height: 20px;\n}\n.hw-hero-bot-icon {\n  width: 36px;\n  height: 36px;\n  flex-shrink: 0;\n  color: white;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 10px;\n}\n.hw-hero-bot-icon > svg,\n.hw-hero-bot-icon > .hw-agent-icon > svg {\n  width: 32px;\n  height: 32px;\n}\n.hw-hero-bot-icon .hw-agent-img,\n.hw-hero-bot-icon .hw-agent-icon {\n  border-radius: inherit;\n  overflow: hidden;\n  object-fit: contain;\n}\n.hw-hero-greeting {\n  font-size: 26px;\n  font-weight: 700;\n  line-height: 1.15;\n  margin-bottom: 6px;\n}\n.hw-hero-greeting-name {\n  font-weight: 300;\n}\n.hw-hero-greeting-question {\n  font-weight: 700;\n}\n.hw-hero-subtitle {\n  font-size: 15px;\n  color: rgba(255, 255, 255, 0.5);\n  line-height: 1.35;\n}\n.hw-sheet {\n  flex: 1;\n  overflow-y: auto;\n  min-height: 0;\n  background: #ffffff;\n  border-radius: 20px 20px 0 0;\n  margin-top: -24px;\n  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);\n  position: relative;\n  z-index: 1;\n}\n.hw-sheet-inner {\n  padding: 20px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.hw-header {\n  display: flex;\n  align-items: center;\n  padding: 14px 12px 14px 16px;\n  background: var(--hw-primary);\n  color: white;\n  flex-shrink: 0;\n  gap: 10px;\n}\n.hw-header--sub {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header-back {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: color 0.15s, background 0.15s;\n  flex-shrink: 0;\n}\n.hw-header-back svg {\n  width: 18px;\n  height: 18px;\n}\n.hw-header-back:hover {\n  color: var(--hw-text);\n  background: var(--hw-bg-subtle);\n}\n.hw-header-identity {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex: 1;\n  min-width: 0;\n}\n.hw-header-bot-icon {\n  width: 32px;\n  height: 32px;\n  flex-shrink: 0;\n  color: var(--hw-text);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 9px;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, transparent));\n}\n.hw-header-bot-icon > svg,\n.hw-header-bot-icon > .hw-agent-icon > svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-header-bot-icon--team {\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n}\n.hw-header-agent-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: inherit;\n}\n.hw-header-bot-icon .hw-agent-img,\n.hw-header-bot-icon .hw-agent-icon {\n  border-radius: inherit;\n  overflow: hidden;\n}\n.hw-header-bot-icon .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-widget[data-has-avatar=true] {\n  --hw-agent-bg-default: var(--hw-primary);\n  --hw-agent-fit-default: contain;\n  --hw-agent-pad-default: 6px;\n}\n.hw-header-agent-initials {\n  font-size: 11px;\n  font-weight: 600;\n  line-height: 1;\n}\n.hw-header-info {\n  flex: 1;\n  min-width: 0;\n}\n.hw-header-name {\n  font-size: 15px;\n  font-weight: 600;\n  line-height: 1.3;\n}\n.hw-header-status {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  line-height: 1.3;\n}\n.hw-header-close {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n  flex-shrink: 0;\n}\n.hw-header-close svg {\n  width: 20px;\n  height: 20px;\n}\n.hw-header-close:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n}\n.hw-header-close:active {\n  transform: scale(0.92);\n}\n.hw-header--centered {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header--centered .hw-header-title {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  max-width: calc(100% - 88px);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  text-align: center;\n}\n.hw-header-spacer {\n  width: 28px;\n  flex-shrink: 0;\n}\n.hw-header--messages {\n  justify-content: space-between;\n  background: transparent;\n  color: var(--hw-text);\n  border-bottom: 0;\n}\n.hw-header-title {\n  font-size: 16px;\n  font-weight: 600;\n}\n.hw-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.hw-header-action {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-header-action svg {\n  width: 16px;\n  height: 16px;\n}\n.hw-header-action:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text);\n}\n.hw-header-action:active {\n  transform: scale(0.94);\n}\n.hw-card {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  width: 100%;\n  padding: 14px 16px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  cursor: pointer;\n  transition: box-shadow 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n  text-align: left;\n  color: var(--hw-text);\n  font-family: inherit;\n}\n.hw-card:hover {\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);\n  transform: translateY(-1px);\n}\n.hw-card:active {\n  transform: translateY(0) scale(0.99);\n  transition-duration: 120ms;\n}\n.hw-card-body {\n  flex: 1;\n  min-width: 0;\n}\n.hw-card-title {\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 1.3;\n  color: var(--hw-text);\n}\n.hw-card-meta {\n  font-size: 12px;\n  color: var(--hw-text-3);\n  line-height: 1.3;\n  margin-top: 1px;\n}\n.hw-card-arrow {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: var(--hw-primary);\n  color: white;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n.hw-card-arrow svg {\n  width: 14px;\n  height: 14px;\n}\n.hw-msgs-tab {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-recent-card {\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  overflow: hidden;\n}\n.hw-recent-header {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--hw-text-2);\n  padding: 12px 14px 0;\n}\n.hw-recent-row {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n  transition: background-color 140ms cubic-bezier(0.23, 1, 0.32, 1), transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n  position: relative;\n}\n.hw-recent-row:hover {\n  background: rgba(0, 0, 0, 0.03);\n}\n.hw-recent-row:active {\n  transform: scale(0.995);\n}\n.hw-recent-row--last {\n  border-bottom: none;\n}\n.hw-recent-row .hw-conv-card-avatar {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n}\n.hw-recent-row .hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n  width: 18px;\n  height: 18px;\n}\n.hw-recent-row .hw-conv-card-name {\n  font-size: 13px;\n}\n.hw-recent-row .hw-conv-card-preview {\n  font-size: 12px;\n}\n.hw-recent-row--unread .hw-conv-card-name {\n  color: var(--hw-text);\n}\n.hw-recent-row--unread .hw-conv-card-time {\n  color: var(--hw-primary);\n  font-weight: 500;\n}\n.hw-recent-row-badge {\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  flex-shrink: 0;\n  font-variant-numeric: tabular-nums;\n}\n.hw-recent-see-all {\n  display: block;\n  width: 100%;\n  padding: 10px 14px;\n  text-align: center;\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-text);\n  background: none;\n  border: none;\n  border-top: 1px solid var(--hw-border);\n  cursor: pointer;\n  font-family: inherit;\n  transition: background 0.1s;\n}\n.hw-recent-see-all:hover {\n  background: rgba(0, 0, 0, 0.02);\n}\n.hw-conv-card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  width: 100%;\n  padding: 14px 16px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  cursor: pointer;\n  transition: box-shadow 0.15s, transform 0.1s;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n}\n.hw-conv-card:hover {\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.04);\n}\n.hw-conv-card:active {\n  transform: scale(0.99);\n}\n.hw-conv-card-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.hw-conv-card-avatar {\n  width: 36px;\n  height: 36px;\n  border-radius: 10px;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-subtle)));\n  color: var(--hw-text-3);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n  width: 20px;\n  height: 20px;\n}\n.hw-conv-card-avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-conv-card-avatar .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-conv-card-avatar--team {\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n}\n.hw-conv-card-avatar-initials {\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 1;\n  letter-spacing: 0.02em;\n}\n.hw-conv-card-content {\n  flex: 1;\n  min-width: 0;\n}\n.hw-conv-card-top {\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n}\n.hw-conv-card-name {\n  flex: 1;\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-conv-card-time {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n  font-variant-numeric: tabular-nums;\n}\n.hw-conv-card-preview {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  line-height: 1.4;\n  margin-top: 1px;\n}\n.hw-conv-card--unread .hw-conv-card-name {\n  color: var(--hw-text);\n}\n.hw-conv-card--unread .hw-conv-card-time {\n  color: var(--hw-primary);\n  font-weight: 500;\n}\n.hw-conv-card-badge {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n  min-width: 18px;\n  height: 18px;\n  border-radius: 9px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 11px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 5px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-empty-state {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px;\n  text-align: center;\n}\n.hw-empty-icon-wrap {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: var(--hw-bg-subtle);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: 16px;\n  color: var(--hw-text-3);\n}\n.hw-empty-icon-wrap svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-empty-title {\n  font-size: 15px;\n  font-weight: 600;\n  color: var(--hw-text);\n  margin-bottom: 4px;\n}\n.hw-empty-desc {\n  font-size: 13px;\n  color: var(--hw-text-3);\n  margin-bottom: 20px;\n}\n.hw-empty-btn {\n  padding: 8px 20px;\n  border-radius: 10px;\n  background: var(--hw-primary);\n  color: white;\n  border: none;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  font-family: inherit;\n  transition: background 0.15s;\n}\n.hw-empty-btn:hover {\n  background: var(--hw-primary-hover);\n}\n.hw-tabs {\n  display: flex;\n  border-top: 1px solid var(--hw-border);\n  flex-shrink: 0;\n  background: var(--hw-bg-subtle);\n}\n.hw-tabs-item {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 2px;\n  padding: 8px 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-text-3);\n  transition: color 0.15s;\n}\n.hw-tabs-item svg {\n  width: 22px;\n  height: 22px;\n  overflow: visible;\n}\n.hw-tabs-item--active {\n  color: var(--hw-text);\n}\n.hw-tabs-item:hover {\n  color: var(--hw-text-2);\n}\n.hw-tabs-item:active {\n  transform: scale(0.94);\n  transition: transform 0.14s cubic-bezier(0.23, 1, 0.32, 1), color 0.15s;\n}\n.hw-tabs-icon-wrap {\n  position: relative;\n  display: inline-flex;\n}\n.hw-tabs-badge {\n  position: absolute;\n  top: -6px;\n  right: -10px;\n  min-width: 16px;\n  height: 16px;\n  border-radius: 8px;\n  background: var(--hw-primary);\n  color: white;\n  font-size: 10px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 4px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-messages {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 16px 14px 8px;\n  background: var(--hw-bg-subtle);\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n  overscroll-behavior: contain;\n  min-width: 0;\n  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n  scrollbar-width: thin;\n  -webkit-mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 12px);\n  mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 12px);\n}\n.hw-messages::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.hw-messages::-webkit-scrollbar-track {\n  background: transparent;\n}\n.hw-messages::-webkit-scrollbar-thumb {\n  background: rgba(0, 0, 0, 0.16);\n  background-clip: content-box;\n  border: 3px solid transparent;\n  border-radius: 999px;\n}\n.hw-messages::-webkit-scrollbar-thumb:hover {\n  background: rgba(0, 0, 0, 0.28);\n  background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages {\n  scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb {\n  background: rgba(255, 255, 255, 0.2);\n  background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb:hover {\n  background: rgba(255, 255, 255, 0.32);\n  background-clip: content-box;\n}\n.hw-empty {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px;\n  color: var(--hw-text-3);\n  text-align: center;\n}\n.hw-empty-icon {\n  width: 40px;\n  height: 40px;\n  margin-bottom: 12px;\n  opacity: 0.3;\n}\n.hw-empty-text {\n  font-size: 13px;\n}\n.hw-date-sep {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 0;\n}\n.hw-date-sep-line {\n  flex: 1;\n  height: 1px;\n  background: var(--hw-border-md);\n}\n.hw-date-sep-text {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  font-weight: 500;\n  white-space: nowrap;\n}\n.hw-msg {\n  display: flex;\n  padding: 4px 0;\n  max-width: 75%;\n  min-width: 0;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n@keyframes hw-msg-appear {\n  from {\n    opacity: 0;\n    transform: translateY(6px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-msg--visitor {\n  align-self: flex-end;\n}\n.hw-msg--team,\n.hw-msg--ai {\n  align-self: flex-start;\n}\n.hw-msg--ai {\n  width: 100%;\n  max-width: 100%;\n}\n.hw-msg-body {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  max-width: 100%;\n}\n.hw-msg-bubble {\n  padding: 10px 14px;\n  border-radius: 16px;\n  font-size: 14px;\n  line-height: 1.45;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  max-width: 100%;\n}\n.hw-msg--visitor .hw-msg-bubble {\n  background: var(--hw-primary);\n  color: white;\n  border-bottom-right-radius: 4px;\n}\n.hw-msg--team .hw-msg-bubble {\n  background: var(--hw-visitor-bubble-bg);\n  color: var(--hw-visitor-bubble-text);\n  border-bottom-left-radius: 4px;\n}\n.hw-msg--ai .hw-msg-bubble {\n  background: var(--hw-visitor-bubble-bg);\n  color: var(--hw-text);\n  border-bottom-left-radius: 4px;\n  white-space: normal;\n  max-width: min(100%, 640px);\n}\n.hw-msg--ai .hw-msg-body {\n  width: 100%;\n}\n.hw-msg--ai .hw-msg-bubble:has(.hw-code),\n.hw-msg--ai .hw-msg-bubble:has(pre) {\n  width: 100%;\n}\n.hw-quick-replies {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-top: 8px;\n}\n.hw-quick-reply-btn {\n  font: inherit;\n  font-size: 13px;\n  font-weight: 500;\n  padding: 6px 14px;\n  border-radius: 18px;\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  background: var(--hw-bg, #fff);\n  color: var(--hw-text-1, #1a1a1a);\n  cursor: pointer;\n  transition:\n    background 120ms ease,\n    border-color 120ms ease,\n    box-shadow 120ms ease,\n    transform 80ms ease;\n  line-height: 1.3;\n}\n.hw-quick-reply-btn:hover:not(:disabled) {\n  border-color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 8%, transparent);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n}\n.hw-quick-reply-btn:active:not(:disabled) {\n  transform: scale(0.97);\n}\n.hw-quick-reply-btn:disabled {\n  cursor: default;\n  opacity: 0.4;\n}\n.hw-quick-reply-btn[data-tapped=true] {\n  background: var(--hw-primary);\n  color: white;\n  border-color: var(--hw-primary);\n  opacity: 1;\n}\n.hw-quick-replies[data-cancelled=true] .hw-quick-reply-btn {\n  border-color: var(--hw-border);\n  color: var(--hw-text-3);\n}\n.hw-msg--ai .hw-code {\n  width: 100%;\n  box-sizing: border-box;\n}\n.hw-msg-meta {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 11px;\n  color: var(--hw-text-2);\n  margin-top: 2px;\n  padding: 0 4px;\n  font-variant-numeric: tabular-nums;\n}\n.hw-msg-time {\n  white-space: nowrap;\n}\n.hw-msg--visitor .hw-msg-meta {\n  text-align: right;\n}\n.hw-msg--team .hw-msg-body,\n.hw-msg--ai .hw-msg-body {\n  align-items: flex-start;\n}\n.hw-msg--visitor .hw-msg-body {\n  align-items: flex-end;\n}\n.hw-typing {\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n  padding: 8px 0;\n  width: fit-content;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-typing-dots {\n  display: flex;\n  gap: 3px;\n  padding: 6px 2px;\n  width: fit-content;\n}\n.hw-typing-dot {\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: var(--hw-text-3);\n  animation: hw-typing-bounce 1.4s infinite;\n}\n.hw-typing-dot:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-typing-dot:nth-child(3) {\n  animation-delay: 0.4s;\n}\n@keyframes hw-typing-bounce {\n  0%, 60%, 100% {\n    transform: translateY(0);\n  }\n  30% {\n    transform: translateY(-4px);\n  }\n}\n.hw-streaming-cursor {\n  display: inline-block;\n  width: 2px;\n  height: 1em;\n  background: currentColor;\n  opacity: 0.6;\n  margin-left: 1px;\n  vertical-align: text-bottom;\n  animation: hw-cursor-blink 0.8s step-end infinite;\n}\n@keyframes hw-cursor-blink {\n  50% {\n    opacity: 0;\n  }\n}\n.hw-link-preview {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  border-radius: 10px;\n  overflow: hidden;\n  text-decoration: none;\n  color: inherit;\n  margin-top: 6px;\n  transition: background 0.15s;\n  min-height: 44px;\n  max-width: 100%;\n  text-align: start;\n}\n.hw-link-preview:hover {\n  background: var(--hw-bg-hover, rgba(0, 0, 0, 0.02));\n}\n.hw-link-preview-img {\n  width: 100%;\n  height: 56px;\n  flex: 0 0 56px;\n  object-fit: cover;\n  object-position: top;\n  border-radius: 0;\n}\n.hw-link-preview-body {\n  padding: 8px 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n  justify-content: center;\n}\n.hw-link-preview-favicon {\n  width: 14px;\n  height: 14px;\n  flex: 0 0 14px;\n  border-radius: 3px;\n}\n.hw-widget[data-hw-placement=docked] .hw-link-preview-favicon {\n  box-sizing: content-box;\n  padding: 2px;\n  background: #ffffff;\n}\n.hw-link-preview-host {\n  direction: ltr;\n  min-width: 0;\n  overflow-wrap: anywhere;\n  word-break: break-all;\n}\n.hw-link-preview-title {\n  font-size: 12.5px;\n  font-weight: 600;\n  line-height: 1.3;\n  color: var(--hw-text, #1a1a1a);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  overflow-wrap: anywhere;\n}\n.hw-link-preview-desc {\n  font-size: 11.5px;\n  line-height: 1.4;\n  color: var(--hw-text-2, #6b7280);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  overflow-wrap: anywhere;\n}\n.hw-link-preview-url {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  min-width: 0;\n  font-size: 11px;\n  color: var(--hw-text-2);\n}\n.hw-msg-links {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  max-width: 240px;\n}\n.hw-loading {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-loading-dots {\n  display: flex;\n  gap: 4px;\n}\n.hw-loading-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: var(--hw-text-4);\n  animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-loading-dot:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-loading-dot:nth-child(3) {\n  animation-delay: 0.4s;\n}\n@keyframes hw-loading-pulse {\n  0%, 60%, 100% {\n    opacity: 0.3;\n    transform: scale(0.8);\n  }\n  30% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n@keyframes hw-skeleton-shimmer {\n  0% {\n    background-position: -200px 0;\n  }\n  100% {\n    background-position: calc(200px + 100%) 0;\n  }\n}\n.hw-skeleton {\n  background:\n    linear-gradient(\n      90deg,\n      var(--hw-bg-subtle) 25%,\n      rgba(0, 0, 0, 0.04) 50%,\n      var(--hw-bg-subtle) 75%);\n  background-size: 200px 100%;\n  animation: hw-skeleton-shimmer 1.5s ease-in-out infinite;\n  border-radius: 6px;\n}\n.hw-skeleton-messages {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  padding: 16px;\n  gap: 16px;\n}\n.hw-skeleton-msg {\n  display: flex;\n  gap: 10px;\n  align-items: flex-start;\n}\n.hw-skeleton-msg--right {\n  flex-direction: row-reverse;\n}\n.hw-skeleton-avatar {\n  width: 28px;\n  height: 28px;\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n.hw-skeleton-bubble {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.hw-skeleton-line {\n  height: 12px;\n  border-radius: 6px;\n}\n.hw-skeleton-convs {\n  display: flex;\n  flex-direction: column;\n  padding: 8px 0;\n}\n.hw-skeleton-conv {\n  display: flex;\n  gap: 10px;\n  align-items: center;\n  padding: 10px 16px;\n}\n.hw-skeleton-conv-avatar {\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n.hw-skeleton-conv-lines {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.hw-skeleton-content {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 16px;\n  gap: 12px;\n}\n.hw-skeleton-content-item {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 12px;\n  border-radius: 10px;\n  background: var(--hw-bg);\n}\n.hw-skeleton-title {\n  height: 22px;\n  width: 65%;\n  border-radius: 6px;\n}\n.hw-skeleton-badge {\n  width: 42px;\n  height: 18px;\n  border-radius: 9px;\n}\n.hw-skeleton-date {\n  width: 60px;\n  height: 12px;\n  border-radius: 6px;\n}\n.hw-skeleton-h2 {\n  height: 16px;\n  border-radius: 6px;\n}\n.hw-skeleton-bullet {\n  padding-left: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-skeleton-bullet-line {\n  height: 14px;\n  border-radius: 7px;\n}\n.hw-email-card {\n  max-width: min(100%, 340px);\n  margin: 0;\n  padding: 0;\n  border: 0;\n  border-radius: 0;\n  background: none;\n  box-shadow: none;\n  animation: hw-email-slide-in 0.25s ease-out;\n}\n@keyframes hw-email-slide-in {\n  from {\n    opacity: 0;\n    transform: translateY(8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-email-card-title {\n  font-size: 14px;\n  font-weight: 550;\n  color: var(--hw-text, #1a1a1a);\n  line-height: 1.3;\n  margin: 0 0 2px;\n}\n.hw-email-card-subtitle {\n  font-size: 12px;\n  color: var(--hw-text-2, #888);\n  line-height: 1.4;\n  margin: 0;\n}\n.hw-email-card-row {\n  max-width: 300px;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-top: 9px;\n  padding: 3px 3px 3px 12px;\n  border-radius: 999px;\n  border: 1px solid var(--hw-border, rgba(0,0,0,0.1));\n  background: var(--hw-bg-subtle, #fafafa);\n  transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-email-card-row:focus-within {\n  border-color: var(--hw-focus-border, rgba(0,0,0,0.2));\n  box-shadow: 0 0 0 2px var(--hw-focus-ring, rgba(0,0,0,0.06));\n}\n.hw-email-card-input {\n  flex: 1;\n  min-width: 0;\n  padding: 6px 0;\n  border: 0;\n  background: transparent;\n  color: var(--hw-text, #1a1a1a);\n  font: inherit;\n  font-size: 13px;\n  outline: none;\n}\n.hw-email-card-input::placeholder {\n  color: var(--hw-text-3, #999);\n}\n.hw-email-card-row:has(.hw-email-card-input--error) {\n  border-color: #ef4444;\n}\n.hw-email-card-submit {\n  flex: none;\n  display: grid;\n  place-items: center;\n  width: 28px;\n  height: 28px;\n  border: none;\n  border-radius: 50%;\n  background: var(--hw-brand, #0a0a0a);\n  color: var(--hw-on-brand, #fff);\n  cursor: pointer;\n  transition: opacity 0.15s, transform 0.15s;\n}\n.hw-email-card-submit:hover:not(:disabled) {\n  transform: scale(1.06);\n}\n.hw-email-card-submit:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n.hw-email-card--success {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 2px 0;\n  font-size: 13px;\n  color: var(--hw-text-2, #888);\n  animation: hw-email-slide-in 0.2s ease-out;\n}\n.hw-email-card--success svg {\n  flex-shrink: 0;\n}\n.hw-composer {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 16px;\n  background: transparent;\n  flex-shrink: 0;\n}\n.hw-composer--compact {\n  padding: 8px 12px;\n}\n.hw-composer-box {\n  display: flex;\n  flex-direction: column;\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  border-radius: 16px;\n  overflow: hidden;\n  transition: border-color 0.2s;\n  background: var(--hw-bg);\n}\n.hw-composer-box:focus-within {\n  border-color: var(--hw-focus-border);\n  box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-composer-input {\n  resize: none;\n  border: none;\n  padding: 12px 16px 4px;\n  font-size: 14px;\n  font-family: inherit;\n  line-height: 1.4;\n  outline: none;\n  min-height: 40px;\n  max-height: 220px;\n  background: transparent;\n  color: var(--hw-text);\n  field-sizing: content;\n}\n.hw-composer-input:focus {\n  outline: none;\n}\n.hw-composer-input:focus-visible {\n  outline: none;\n}\n.hw-composer-input::placeholder {\n  color: var(--hw-text-4);\n}\n.hw-composer-toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 10px 10px;\n}\n.hw-composer-toolbar-left {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.hw-composer-send {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition:\n    background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-composer-send:active:not(:disabled) {\n  transform: scale(0.9);\n}\n.hw-composer-send--active {\n  background: var(--hw-primary);\n  color: white;\n}\n.hw-composer-send--inactive {\n  background: var(--hw-border);\n  color: var(--hw-text-4);\n  cursor: default;\n}\n.hw-composer-send svg {\n  width: 14px;\n  height: 14px;\n}\n.hw-composer-charcount {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  font-variant-numeric: tabular-nums;\n  opacity: 1;\n  transform: translateY(0);\n  transition:\n    color 180ms cubic-bezier(0.23, 1, 0.32, 1),\n    opacity 180ms cubic-bezier(0.23, 1, 0.32, 1),\n    transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n@starting-style {\n  .hw-composer-charcount {\n    opacity: 0;\n    transform: translateY(3px);\n  }\n}\n.hw-composer-charcount--over {\n  color: #ef4444;\n  font-weight: 600;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-composer-charcount {\n    transform: none;\n    transition: color 160ms ease, opacity 160ms ease;\n  }\n  @starting-style {\n    .hw-composer-charcount {\n      transform: none;\n    }\n  }\n}\n.hw-composer-previews {\n  display: flex;\n  gap: 6px;\n  padding: 8px 10px 0;\n  overflow-x: auto;\n  scrollbar-width: none;\n}\n.hw-composer-previews::-webkit-scrollbar {\n  display: none;\n}\n.hw-composer-preview {\n  position: relative;\n  width: 48px;\n  height: 48px;\n  border-radius: 8px;\n  overflow: hidden;\n  flex-shrink: 0;\n  background: var(--hw-border);\n  cursor: pointer;\n}\n.hw-composer-preview--error {\n  outline: 2px solid #ef4444;\n  outline-offset: -2px;\n}\n.hw-composer-preview-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-composer-preview-file {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--hw-bg-subtle);\n}\n.hw-composer-preview-ext {\n  font-size: 10px;\n  font-weight: 700;\n  color: var(--hw-text-3);\n  text-transform: uppercase;\n}\n.hw-composer-preview-loader {\n  position: absolute;\n  inset: 0;\n  background: rgba(0, 0, 0, 0.35);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-composer-preview-loader::after {\n  content: "";\n  width: 16px;\n  height: 16px;\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top-color: white;\n  border-radius: 50%;\n  animation: hw-spin 0.6s linear infinite;\n}\n@keyframes hw-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n.hw-composer-preview-badge {\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: #ef4444;\n  color: white;\n  font-size: 10px;\n  font-weight: 700;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-composer-preview-remove {\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  border: none;\n  background: rgba(0, 0, 0, 0.55);\n  color: white;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  transition: opacity 0.15s;\n}\n.hw-composer-preview-remove svg {\n  width: 10px;\n  height: 10px;\n}\n.hw-composer-preview:hover .hw-composer-preview-remove {\n  opacity: 1;\n}\n.hw-composer-attach {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: none;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  opacity: 0.7;\n  transition: opacity 0.15s;\n}\n.hw-composer-attach:hover {\n  opacity: 1;\n}\n.hw-composer-attach svg {\n  width: 16px;\n  height: 16px;\n}\n.hw-msg-images {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-bottom: 4px;\n}\n.hw-msg-image-link {\n  display: block;\n  border-radius: 14px;\n  overflow: hidden;\n  line-height: 0;\n}\n.hw-msg-image {\n  max-width: 140px;\n  max-height: 80px;\n  object-fit: cover;\n  border-radius: 8px;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-msg-files {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-top: 4px;\n}\n.hw-msg-file {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  border-radius: 10px;\n  background: var(--hw-bg-subtle);\n  text-decoration: none;\n  color: var(--hw-text);\n  transition: background 0.15s;\n}\n.hw-msg-file:hover {\n  background: var(--hw-border);\n}\n.hw-msg-file-icon {\n  flex-shrink: 0;\n  width: 20px;\n  height: 20px;\n  color: var(--hw-text-3);\n}\n.hw-msg-file-icon svg {\n  width: 100%;\n  height: 100%;\n}\n.hw-msg-file-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n.hw-msg-file-name {\n  font-size: 13px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.hw-msg-file-size {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-msg-image-link {\n  cursor: pointer;\n  border: none;\n  padding: 0;\n  background: none;\n  display: block;\n  line-height: 0;\n}\n.hw-hover-preview {\n  position: fixed;\n  z-index: 2147483001;\n  padding: 6px;\n  border-radius: 14px;\n  background: white;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.06);\n  cursor: pointer;\n  animation: hw-hover-in 0.15s ease-out;\n}\n@media (prefers-color-scheme: dark) {\n  .hw-hover-preview {\n    background: #1c1c1e;\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.08);\n  }\n}\n@keyframes hw-hover-in {\n  from {\n    opacity: 0;\n    transform: scale(0.96) translateY(4px);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1) translateY(0);\n  }\n}\n.hw-hover-preview-img {\n  width: 100%;\n  max-height: 200px;\n  object-fit: contain;\n  border-radius: 10px;\n  display: block;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-hover-preview--doc {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n}\n.hw-hover-preview-doc-icon {\n  width: 28px;\n  height: 28px;\n  flex-shrink: 0;\n}\n.hw-hover-preview-doc-icon svg {\n  width: 100%;\n  height: 100%;\n}\n.hw-hover-preview-doc-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n.hw-hover-preview-doc-name {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-text);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.hw-hover-preview-doc-hint {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-event {\n  display: flex;\n  justify-content: center;\n  padding: 8px 16px;\n}\n.hw-event-text {\n  font-size: 12px;\n  color: var(--hw-text-3);\n  text-align: center;\n}\n.hw-event--card {\n  justify-content: flex-start;\n  align-items: center;\n  gap: 10px;\n  background: var(--hw-bg-subtle);\n  padding: 10px 14px;\n  border-radius: 12px;\n  margin: 4px 16px;\n}\n.hw-event-avatar {\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-hover, #e0e0e0)));\n  color: var(--hw-text-2, #555);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 600;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-event-avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.hw-event-avatar .hw-agent-img {\n  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n  padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n  box-sizing: border-box;\n}\n.hw-event-body {\n  font-size: 13px;\n  line-height: 1.3;\n}\n.hw-event-name {\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-event-action {\n  color: var(--hw-text-2);\n}\n.hw-new {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  background: var(--hw-bg-subtle);\n}\n.hw-new-body {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px 24px;\n  text-align: center;\n}\n.hw-new-welcome {\n  flex: 1;\n  padding: 16px 20px;\n  overflow-y: auto;\n}\n.hw-new-heading {\n  font-size: 17px;\n  font-weight: 600;\n  color: var(--hw-text);\n  margin-bottom: 6px;\n}\n.hw-new-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  margin-bottom: 24px;\n}\n.hw-powered {\n  text-align: center;\n  padding: 8px;\n  font-size: 11px;\n  color: var(--hw-text-4);\n  flex-shrink: 0;\n}\n.hw-powered a {\n  color: var(--hw-text-2);\n  text-decoration: none;\n  font-weight: 500;\n}\n.hw-powered a:hover {\n  color: var(--hw-text);\n}\n@media (max-width: 479px) {\n  .hw-widget {\n    bottom: 16px;\n    right: 16px;\n    left: auto;\n  }\n  .hw-window {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    width: 100%;\n    height: var(--hw-visible-height, 100%);\n    border-radius: 0;\n    animation: hw-mob-up 0.3s cubic-bezier(0.22, 1, 0.36, 1);\n  }\n  .hw-window--closing {\n    animation: hw-mob-down 0.2s ease forwards;\n  }\n  @keyframes hw-mob-up {\n    from {\n      opacity: 0;\n      transform: translateY(100%);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  @keyframes hw-mob-down {\n    from {\n      opacity: 1;\n      transform: translateY(0);\n    }\n    to {\n      opacity: 0;\n      transform: translateY(100%);\n    }\n  }\n  .hw-hero {\n    padding-top: calc(20px + env(safe-area-inset-top, 0px));\n  }\n  .hw-header {\n    padding-top: env(safe-area-inset-top, 0px);\n  }\n  .hw-tabs {\n    padding-bottom: env(safe-area-inset-bottom, 0px);\n  }\n  .hw-composer {\n    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));\n  }\n  .hw-powered {\n    padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px));\n  }\n  .hw-window:has(.hw-powered) .hw-composer {\n    padding-bottom: 8px;\n  }\n  .hw-window:has(.hw-powered) .hw-tabs {\n    padding-bottom: 0;\n  }\n  .hw-header-close,\n  .hw-header-back,\n  .hw-header-action {\n    width: 34px;\n    height: 34px;\n  }\n  .hw-composer-send {\n    width: 40px;\n    height: 40px;\n  }\n  .hw-window ~ .hw-bubble {\n    display: none;\n  }\n  .hw-messages {\n    padding: 12px 14px;\n  }\n  .hw-msg {\n    max-width: 82%;\n  }\n  .hw-msg--ai {\n    max-width: 100%;\n  }\n}\n.hw-preview {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  width: 300px;\n  max-width: calc(100vw - 40px);\n  background: var(--hw-bg);\n  border: 1px solid var(--hw-border);\n  border-radius: 16px;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);\n  animation: hw-preview-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n  overflow: hidden;\n  cursor: pointer;\n  transition: transform 0.15s, box-shadow 0.15s;\n}\n.hw-preview.hw-preview--anchored {\n  position: static;\n  bottom: auto;\n  right: auto;\n  width: 100%;\n  max-width: 100%;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar {\n  background: none;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar img,\n.hw-preview.hw-preview--anchored .hw-preview-avatar svg:not(.hw-agent-custom svg) {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n.hw-preview:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);\n}\n@keyframes hw-preview-in {\n  from {\n    opacity: 0;\n    transform: translateY(8px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n@keyframes hw-preview-out {\n  from {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.95);\n  }\n}\n.hw-preview-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px 14px 0;\n}\n.hw-preview-avatar {\n  width: 28px;\n  height: 28px;\n  border-radius: 50%;\n  background:\n    linear-gradient(\n      135deg,\n      var(--hw-primary),\n      color-mix(in srgb, var(--hw-primary) 50%, black));\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  flex-shrink: 0;\n  overflow: hidden;\n}\n.hw-preview-avatar svg:not(.hw-agent-custom svg) {\n  width: 16px;\n  height: 16px;\n}\n.hw-preview-avatar img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  display: block;\n}\n.hw-preview-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--hw-text);\n  flex: 1;\n}\n.hw-preview-close {\n  width: 24px;\n  height: 24px;\n  border: none;\n  background: transparent;\n  color: var(--hw-text-3);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  transition: background 0.15s, color 0.15s;\n  flex-shrink: 0;\n}\n.hw-preview-close:hover {\n  background: var(--hw-bg-subtle);\n  color: var(--hw-text-2);\n}\n.hw-preview-close:active {\n  transform: scale(0.90);\n  transition:\n    transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n    background 0.15s,\n    color 0.15s;\n}\n.hw-preview-close svg {\n  width: 12px;\n  height: 12px;\n}\n.hw-preview-body {\n  padding: 4px 14px;\n  font-size: 14px;\n  line-height: 1.45;\n  color: var(--hw-text-2);\n}\n.hw-preview-body:first-of-type {\n  padding-top: 8px;\n}\n.hw-preview-body:last-child {\n  padding-bottom: 14px;\n}\n.hw-preview-footer {\n  margin-top: 2px;\n  padding: 8px 14px 12px;\n  border-top: 1px solid var(--hw-border);\n  font-size: 11px;\n  line-height: 1.3;\n  color: var(--hw-text-2);\n  opacity: 0.65;\n}\n.hw-preview-prompt {\n  padding: 2px 14px 6px;\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--hw-text-1);\n}\n.hw-preview-quick-replies {\n  padding: 0 14px 14px;\n  margin-top: 0;\n}\n.hw-awaiting {\n  margin-top: 2px;\n  padding-left: 44px;\n  font-size: 11px;\n  line-height: 1.4;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-preview-dock {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 8px;\n  pointer-events: none;\n}\n.hw-preview-dock > .hw-preview,\n.hw-preview-dock > .hw-preview-stack {\n  position: relative;\n  bottom: auto;\n  right: auto;\n  pointer-events: auto;\n}\n.hw-preview--closing {\n  animation: hw-preview-out 0.2s ease-in forwards;\n}\n.hw-preview-stack {\n  position: absolute;\n  bottom: calc(100% + 12px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.hw-preview-stack .hw-preview {\n  position: relative;\n  bottom: auto;\n  right: auto;\n}\n.hw-preview-stack.hw-preview-stack--anchored {\n  position: static;\n  bottom: auto;\n  right: auto;\n  width: 100%;\n}\n.hw-preview-more {\n  align-self: flex-end;\n  padding: 4px 10px;\n  border: 0;\n  border-radius: 999px;\n  background: var(--hw-bg);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), inset 0 0 0 1px var(--hw-border);\n  color: var(--hw-text-2);\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.4;\n  cursor: pointer;\n  transition: background 0.12s, color 0.12s;\n}\n.hw-preview-more:hover {\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n}\n.hw-preview--announcement {\n  width: 340px;\n}\n.hw-preview--announcement .hw-preview-body--title {\n  font-weight: 600;\n  color: var(--hw-text);\n  font-size: 15px;\n  line-height: 1.3;\n  padding-top: 10px;\n}\n.hw-preview--announcement .hw-preview-body--desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  line-height: 1.5;\n  padding-bottom: 16px;\n}\n.hw-announcement-badge {\n  display: inline-block;\n  margin: 8px 14px 0;\n  padding: 2px 8px;\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 10%, transparent);\n  border-radius: 4px;\n}\n.hw-whats-new {\n  border-radius: 14px;\n  background: var(--hw-bg);\n  border: 0;\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n  overflow: hidden;\n}\n.hw-whats-new-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px 0;\n}\n.hw-whats-new-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--hw-text-2);\n}\n.hw-whats-new-view-all {\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-primary);\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  font-family: inherit;\n}\n.hw-whats-new-view-all:hover {\n  opacity: 0.8;\n}\n.hw-whats-new-list {\n  display: flex;\n  flex-direction: column;\n}\n.hw-whats-new-item {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  font-family: inherit;\n  color: var(--hw-text);\n  transition: background-color 140ms ease;\n}\n.hw-whats-new-item:last-child {\n  border-bottom: none;\n}\n.hw-whats-new-item:hover {\n  background: rgba(0, 0, 0, 0.03);\n}\n.hw-whats-new-item-top {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n.hw-whats-new-badge {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  color: var(--hw-primary);\n}\n.hw-whats-new-time {\n  font-size: 11px;\n  color: var(--hw-text-3);\n  margin-left: auto;\n}\n.hw-whats-new-item-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--hw-text);\n  line-height: 1.3;\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n}\n.hw-whats-new-time-inline {\n  font-size: 11px;\n  font-weight: 400;\n  color: var(--hw-text-3);\n  margin-left: auto;\n  flex-shrink: 0;\n}\n.hw-whats-new-item-body {\n  font-size: 12px;\n  color: var(--hw-text-2);\n  line-height: 1.4;\n}\n.hw-tabs-dot {\n  position: absolute;\n  top: -2px;\n  right: -6px;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: var(--hw-primary);\n  animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.hw-bubble-badge-dot {\n  display: block;\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: white;\n}\n.hw-content-search {\n  padding: 10px 16px;\n}\n.hw-content-search-box {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--hw-bg);\n  border: 1px solid var(--hw-border-md);\n  border-radius: 10px;\n  transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-content-search-box:focus-within {\n  border-color: var(--hw-focus-border);\n  box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-content-search-input {\n  flex: 1;\n  border: none !important;\n  outline: none !important;\n  box-shadow: none !important;\n  background: none;\n  font-size: 13px;\n  color: var(--hw-text-1);\n  font-family: inherit;\n  line-height: 1;\n  -webkit-appearance: none;\n}\n.hw-content-search-input:focus,\n.hw-content-search-input:focus-visible {\n  outline: none !important;\n  box-shadow: none !important;\n  border: none !important;\n}\n.hw-content-search-input::placeholder {\n  color: var(--hw-text-3);\n}\n.hw-content-search-icon {\n  width: 15px;\n  height: 15px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n}\n.hw-content-list {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n.hw-content-entries {\n  flex: 1;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n}\n.hw-content-entry {\n  display: block;\n  width: 100%;\n  padding: 14px 16px;\n  border: none;\n  border-bottom: 1px solid var(--hw-border);\n  background: none;\n  cursor: pointer;\n  text-align: left;\n  transition: background-color 0.15s ease;\n  -webkit-tap-highlight-color: transparent;\n}\n.hw-content-entry:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-content-entry:active {\n  background: var(--hw-border);\n}\n.hw-content-entry:last-child {\n  border-bottom: none;\n}\n.hw-content-entry-main {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.hw-content-entry-text {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n}\n.hw-content-entry-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text-1);\n  line-height: 1.3;\n}\n.hw-content-entry-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n.hw-content-entry-meta {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-top: 2px;\n}\n.hw-content-entry-badge {\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--hw-text-3);\n  background: var(--hw-bg-hover);\n  padding: 1px 6px;\n  border-radius: 4px;\n}\n.hw-content-entry-date {\n  font-size: 11px;\n  color: var(--hw-text-3);\n}\n.hw-content-entry-chevron {\n  width: 16px;\n  height: 16px;\n  color: var(--hw-text-3);\n  flex-shrink: 0;\n  opacity: 0.5;\n}\n.hw-content-detail {\n  padding: 16px;\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  flex: 1;\n  min-height: 0;\n}\n.hw-content-detail-header {\n  margin-bottom: 16px;\n}\n.hw-content-detail-title {\n  font-size: 17px;\n  font-weight: 700;\n  color: var(--hw-text-1);\n  margin: 0 0 6px;\n  line-height: 1.3;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.hw-content-detail-meta {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n}\n.hw-content-detail-date {\n  font-size: 12px;\n  color: var(--hw-text-3);\n}\n.hw-content-detail-body {\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--hw-text-1);\n}\n.hw-markdown h1 {\n  font-size: 17px;\n  font-weight: 700;\n  margin: 0;\n}\n.hw-markdown h2 {\n  font-size: 15px;\n  font-weight: 600;\n  margin: 0;\n}\n.hw-markdown h3 {\n  font-size: 14px;\n  font-weight: 600;\n  margin: 0;\n}\n.hw-markdown p {\n  margin: 0;\n}\n.hw-markdown p:empty,\n.hw-markdown div:empty,\n.hw-markdown p:has(> br:only-child),\n.hw-markdown div:has(> br:only-child) {\n  display: none;\n}\n.hw-markdown > * + * {\n  margin-top: 12px;\n}\n.hw-markdown > * + h1,\n.hw-markdown > * + h2 {\n  margin-top: 20px;\n}\n.hw-markdown > * + h3 {\n  margin-top: 16px;\n}\n.hw-markdown > h1 + *,\n.hw-markdown > h2 + *,\n.hw-markdown > h3 + * {\n  margin-top: 8px;\n}\n.hw-markdown > *:first-child {\n  margin-top: 0;\n}\n.hw-markdown > *:last-child {\n  margin-bottom: 0;\n}\n.hw-markdown > br {\n  display: none;\n}\n.hw-markdown ul,\n.hw-markdown ol {\n  margin: 0;\n  padding-left: 20px;\n}\n.hw-markdown li {\n  margin: 4px 0;\n}\n.hw-markdown code {\n  font-family:\n    ui-monospace,\n    "SF Mono",\n    monospace;\n  font-size: 12px;\n  background: var(--hw-bg-hover);\n  padding: 1px 5px;\n  border-radius: 4px;\n}\n.hw-table-wrap {\n  margin: 10px 0;\n  overflow-x: auto;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  border-radius: 10px;\n}\n.hw-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: 13px;\n}\n.hw-table th {\n  text-align: left;\n  font-weight: 600;\n  font-size: 12px;\n  padding: 8px 12px;\n  background: var(--hw-bg-hover, #f5f5f4);\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n}\n.hw-table td {\n  padding: 8px 12px;\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n  vertical-align: top;\n}\n.hw-table tbody tr:last-child td {\n  border-bottom: none;\n}\n.hw-code {\n  margin: 10px 0;\n  border-radius: 10px;\n  overflow: hidden;\n  border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n  background: var(--hw-bg-hover, #f5f5f4);\n  font-family:\n    ui-monospace,\n    "SF Mono",\n    "Menlo",\n    monospace;\n}\n.hw-code-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 10px;\n  padding: 7px 8px 7px 12px;\n  font-size: 11px;\n  color: var(--hw-text-2, #6b7280);\n  background: rgba(0, 0, 0, 0.03);\n  border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n}\n.hw-code-lang {\n  text-transform: lowercase;\n  letter-spacing: 0.02em;\n  font-weight: 500;\n}\n.hw-code-actions {\n  display: inline-flex;\n  align-items: center;\n  gap: 1px;\n}\n.hw-code-action {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 22px;\n  height: 22px;\n  padding: 0;\n  font-family: inherit;\n  color: var(--hw-text-2, #6b7280);\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  opacity: 0.62;\n  transition:\n    background 120ms ease,\n    color 120ms ease,\n    opacity 120ms ease,\n    scale 120ms ease;\n}\n.hw-code-action:hover {\n  color: var(--hw-text, #111);\n  background: rgba(0, 0, 0, 0.06);\n  opacity: 1;\n}\n.hw-code-action:active {\n  scale: 0.96;\n}\n.hw-code-action svg {\n  width: 13px;\n  height: 13px;\n}\n.hw-code-copy-icon,\n.hw-code-check-icon {\n  position: absolute;\n  inset: 50% auto auto 50%;\n  transition:\n    opacity 180ms cubic-bezier(0.2, 0, 0, 1),\n    scale 180ms cubic-bezier(0.2, 0, 0, 1),\n    filter 180ms cubic-bezier(0.2, 0, 0, 1);\n  translate: -50% -50%;\n}\n.hw-code-check-icon {\n  filter: blur(4px);\n  opacity: 0;\n  scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-copy-icon {\n  filter: blur(4px);\n  opacity: 0;\n  scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-check-icon {\n  filter: blur(0);\n  opacity: 1;\n  scale: 1;\n}\n.hw-code-copy-label {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n}\n.hw-code-copy--copied {\n  color: #16a34a;\n}\n.hw-code-copy--failed {\n  color: #dc2626;\n}\n.hw-code pre {\n  margin: 0;\n  padding: 10px 12px;\n  background: transparent;\n  border-radius: 0;\n  overflow-x: auto;\n  max-width: 100%;\n  max-height: 320px;\n  scrollbar-color: rgba(0, 0, 0, 0.22) transparent;\n  scrollbar-width: thin;\n}\n.hw-code pre::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.hw-code pre::-webkit-scrollbar-track {\n  background: transparent;\n}\n.hw-code pre::-webkit-scrollbar-thumb {\n  background: rgba(0, 0, 0, 0.18);\n  background-clip: content-box;\n  border: 3px solid transparent;\n  border-radius: 999px;\n}\n.hw-code pre::-webkit-scrollbar-thumb:hover {\n  background: rgba(0, 0, 0, 0.28);\n  background-clip: content-box;\n}\n.hw-code pre code {\n  display: block;\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.55;\n  white-space: pre;\n  color: var(--hw-text, #111);\n}\n@media (prefers-color-scheme: dark) {\n  .hw-code {\n    background: rgba(255, 255, 255, 0.04);\n    border-color: rgba(255, 255, 255, 0.08);\n  }\n  .hw-code-header {\n    background: rgba(255, 255, 255, 0.03);\n    border-bottom-color: rgba(255, 255, 255, 0.06);\n  }\n  .hw-code-action:hover,\n  .hw-code-action:focus-visible {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-code pre {\n    scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n  }\n  .hw-code pre::-webkit-scrollbar-thumb {\n    background: rgba(255, 255, 255, 0.22);\n    background-clip: content-box;\n  }\n  .hw-code pre::-webkit-scrollbar-thumb:hover {\n    background: rgba(255, 255, 255, 0.32);\n    background-clip: content-box;\n  }\n}\n.hw-markdown pre {\n  margin: 8px 0;\n  padding: 10px 12px;\n  background: var(--hw-bg-hover);\n  border-radius: 8px;\n  overflow-x: auto;\n  max-width: 100%;\n}\n.hw-markdown pre code {\n  display: block;\n  background: transparent;\n  padding: 0;\n  border-radius: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  white-space: pre;\n  word-break: normal;\n  color: inherit;\n}\n.hw-msg-bubble pre {\n  margin: 6px 0;\n  padding: 8px 10px;\n  background: rgba(0, 0, 0, 0.06);\n  border-radius: 6px;\n  overflow-x: auto;\n  max-width: 100%;\n}\n.hw-msg-bubble pre code {\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  white-space: pre;\n}\n.hw-msg-bubble .hw-code pre {\n  margin: 0;\n  padding: 10px 12px;\n  background: transparent;\n  border-radius: 0;\n}\n.hw-msg-bubble .hw-code pre code {\n  background: transparent;\n  padding: 0;\n  font-size: 12px;\n  line-height: 1.55;\n}\n.hw-msg--team .hw-msg-bubble pre,\n.hw-msg--visitor .hw-msg-bubble pre {\n  background: rgba(255, 255, 255, 0.12);\n}\n.hw-markdown blockquote {\n  margin: 0 0 12px;\n  padding: 8px 12px;\n  border-left: 3px solid var(--hw-border);\n  color: var(--hw-text-2);\n  font-style: italic;\n}\n.hw-markdown a {\n  color: var(--hw-primary);\n  text-decoration: underline;\n  text-underline-offset: 2px;\n}\n.hw-markdown img {\n  max-width: 100%;\n  border-radius: 8px;\n  margin: 8px 0;\n  outline: 1px solid rgba(0, 0, 0, 0.08);\n  outline-offset: -1px;\n}\n.hw-markdown hr {\n  border: none;\n  border-top: 1px solid var(--hw-border);\n  margin: 16px 0;\n}\n.hw-content-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n  text-align: center;\n}\n.hw-content-empty-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--hw-text-1);\n  margin-bottom: 4px;\n}\n.hw-content-empty-desc {\n  font-size: 12px;\n  color: var(--hw-text-3);\n}\n.hw-content-loading {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n}\n.hw-content-load-more {\n  display: block;\n  width: 100%;\n  padding: 10px;\n  border: none;\n  background: none;\n  color: var(--hw-primary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  text-align: center;\n}\n.hw-content-load-more:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-content-load-more:disabled {\n  opacity: 0.5;\n  cursor: default;\n}\n@media (hover: none) {\n  .hw-composer-preview-remove {\n    opacity: 0.7;\n  }\n}\n.hw-composer--dragging .hw-composer-box {\n  border-color: var(--hw-primary);\n  background: color-mix(in srgb, var(--hw-primary) 4%, transparent);\n}\n.hw-composer-drop-overlay {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: color-mix(in srgb, var(--hw-bg) 90%, transparent);\n  border: 2px dashed var(--hw-primary);\n  border-radius: 12px;\n  z-index: 10;\n  pointer-events: none;\n  animation: hw-drop-pulse 1.5s ease-in-out infinite;\n}\n.hw-composer-drop-text {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--hw-primary);\n}\n@keyframes hw-drop-pulse {\n  0%, 100% {\n    opacity: 0.8;\n  }\n  50% {\n    opacity: 1;\n  }\n}\n.hw-disconnect {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 7px;\n  padding: 7px 14px;\n  background: var(--hw-bg-hover);\n  color: var(--hw-text-2);\n  font-size: 11.5px;\n  font-weight: 500;\n  letter-spacing: -0.01em;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  flex-shrink: 0;\n  animation: hw-disconnect-in 0.18s cubic-bezier(0.22, 1, 0.36, 1);\n}\n@keyframes hw-disconnect-in {\n  from {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n.hw-disconnect-retry {\n  flex: none;\n  padding: 2px 4px;\n  margin: -2px 0;\n  border: 0;\n  border-radius: 4px;\n  background: none;\n  color: var(--hw-text);\n  font: inherit;\n  font-weight: 600;\n  text-decoration: underline;\n  text-underline-offset: 2px;\n  cursor: pointer;\n}\n.hw-disconnect-retry:hover {\n  text-decoration-thickness: 2px;\n}\n.hw-disconnect-retry:focus-visible {\n  outline: 2px solid var(--hw-text);\n  outline-offset: 1px;\n}\n.hw-disconnect-spinner {\n  width: 9px;\n  height: 9px;\n  border: 1.5px solid currentColor;\n  border-top-color: transparent;\n  border-radius: 50%;\n  opacity: 0.75;\n  flex-shrink: 0;\n  animation: hw-spin 0.7s linear infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-disconnect {\n    animation: none;\n  }\n  .hw-disconnect-spinner {\n    animation: none;\n    border-top-color: currentColor;\n    opacity: 0.5;\n  }\n}\n.hw-error-state {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 32px 24px;\n  text-align: center;\n  gap: 12px;\n}\n.hw-error-icon {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: #fef2f2;\n  color: #ef4444;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.hw-error-icon svg {\n  width: 24px;\n  height: 24px;\n}\n.hw-error-title {\n  font-size: 15px;\n  font-weight: 600;\n  color: var(--hw-text);\n}\n.hw-error-desc {\n  font-size: 13px;\n  color: var(--hw-text-2);\n}\n.hw-error-btn {\n  padding: 8px 20px;\n  border: 1px solid var(--hw-border-md);\n  border-radius: 8px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.hw-error-btn:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-send-error {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: #fef2f2;\n  color: #dc2626;\n  font-size: 12px;\n  font-weight: 500;\n  flex-shrink: 0;\n  animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-send-error-retry {\n  margin-left: auto;\n  padding: 2px 8px;\n  border: 1px solid #fca5a5;\n  border-radius: 4px;\n  background: none;\n  color: #dc2626;\n  font-size: 11px;\n  font-weight: 600;\n  cursor: pointer;\n}\n.hw-send-error-retry:hover {\n  background: #fee2e2;\n}\n.hw-resolved {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 10px 14px;\n  border-top: 1px solid var(--hw-border);\n  flex-shrink: 0;\n}\n.hw-resolved-status {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 12.5px;\n  font-weight: 550;\n  color: var(--hw-text);\n}\n.hw-resolved-status svg {\n  flex: none;\n  color: var(--hw-text-2);\n}\n.hw-csat {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n.hw-csat-label,\n.hw-csat-error {\n  font-size: 12px;\n  color: var(--hw-text-2);\n}\n.hw-csat-error {\n  color: var(--hw-text);\n}\n.hw-csat-buttons {\n  display: flex;\n  gap: 6px;\n}\n.hw-csat-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  height: 30px;\n  padding: 0 11px;\n  border: 1px solid var(--hw-border-md);\n  border-radius: 999px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  font: inherit;\n  font-size: 12px;\n  font-weight: 550;\n  cursor: pointer;\n  transition: background 0.15s, border-color 0.15s;\n}\n.hw-csat-btn svg {\n  flex: none;\n}\n.hw-csat-btn:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-csat-btn:focus-visible {\n  outline: 2px solid var(--hw-text);\n  outline-offset: 2px;\n}\n.hw-csat-btn[aria-pressed=true] {\n  background: var(--hw-bg-hover);\n  border-color: var(--hw-brand, var(--hw-primary));\n  box-shadow: inset 0 0 0 1px var(--hw-brand, var(--hw-primary));\n  cursor: default;\n}\n.hw-load-more-trigger {\n  display: flex;\n  justify-content: center;\n  min-height: 1px;\n}\n.hw-load-more-trigger:has(.hw-load-more-spinner) {\n  padding: 8px 0;\n}\n.hw-load-more-spinner {\n  display: flex;\n  gap: 3px;\n}\n.hw-load-more-spinner > div {\n  width: 5px;\n  height: 5px;\n  border-radius: 50%;\n  background: var(--hw-text-4);\n  animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-load-more-spinner > div:nth-child(2) {\n  animation-delay: 0.2s;\n}\n.hw-load-more-spinner > div:nth-child(3) {\n  animation-delay: 0.4s;\n}\n.hw-drag-handle {\n  display: none;\n}\n@media (max-width: 479px) {\n  .hw-drag-handle {\n    display: flex;\n    justify-content: center;\n    padding: 8px 0 4px;\n    flex-shrink: 0;\n  }\n  .hw-drag-handle-pill {\n    width: 32px;\n    height: 4px;\n    border-radius: 2px;\n    background: var(--hw-text-4);\n  }\n}\n.hw-msg-bubble p {\n  margin: 0 0 8px;\n}\n.hw-msg-bubble p:last-child {\n  margin-bottom: 0;\n}\n.hw-msg-bubble strong {\n  font-weight: 600;\n}\n.hw-msg-bubble em {\n  font-style: italic;\n}\n.hw-msg-bubble a {\n  color: inherit;\n  text-decoration: underline;\n  text-decoration-thickness: 1px;\n  text-underline-offset: 2px;\n  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);\n  word-break: normal;\n  overflow-wrap: anywhere;\n}\n.hw-msg-bubble a:hover {\n  opacity: 0.8;\n}\n.hw-msg--visitor .hw-msg-bubble a {\n  color: rgba(255, 255, 255, 0.9);\n}\n.hw-msg--visitor .hw-msg-bubble a:hover {\n  color: white;\n}\n.hw-msg-bubble ul,\n.hw-msg-bubble ol {\n  margin: 4px 0 8px;\n  padding-left: 20px;\n}\n.hw-msg-bubble li {\n  margin: 2px 0;\n}\n.hw-msg-bubble code {\n  padding: 1px 4px;\n  border-radius: 3px;\n  background: rgba(0, 0, 0, 0.06);\n  font-size: 0.9em;\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    monospace;\n}\n.hw-msg-bubble pre {\n  margin: 4px 0 8px;\n  padding: 8px 10px;\n  border-radius: 6px;\n  background: rgba(0, 0, 0, 0.06);\n  overflow-x: auto;\n  font-size: 0.85em;\n}\n.hw-msg-bubble pre code {\n  padding: 0;\n  background: none;\n}\n.hw-msg-bubble blockquote {\n  margin: 4px 0 8px;\n  padding: 4px 0 4px 12px;\n  border-left: 3px solid var(--hw-border-md);\n  color: var(--hw-text-2);\n}\n.hw-widget[data-theme=dark] {\n  --hw-bg: #1c1c1e;\n  --hw-bg-subtle: #161618;\n  --hw-bg-hover: #2c2c2e;\n  --hw-border: rgba(255, 255, 255, 0.08);\n  --hw-border-md: rgba(255, 255, 255, 0.14);\n  --hw-text: #f5f5f5;\n  --hw-text-1: #f5f5f5;\n  --hw-text-2: #a1a1aa;\n  --hw-text-3: #71717a;\n  --hw-text-4: #52525b;\n  --hw-visitor-bubble-bg: #2c2c2e;\n  --hw-visitor-bubble-text: #f5f5f5;\n  --hw-focus-border: rgba(255, 255, 255, 0.28);\n  --hw-focus-ring: rgba(255, 255, 255, 0.08);\n  --hw-brand: #f5f5f5;\n  --hw-on-brand: #1c1c1e;\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light]) .hw-messages {\n    scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n  }\n  .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb {\n    background: rgba(255, 255, 255, 0.2);\n    background-clip: content-box;\n  }\n  .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb:hover {\n    background: rgba(255, 255, 255, 0.32);\n    background-clip: content-box;\n  }\n  .hw-widget:not([data-theme=light]) {\n    --hw-bg: #1c1c1e;\n    --hw-bg-subtle: #161618;\n    --hw-bg-hover: #2c2c2e;\n    --hw-border: rgba(255, 255, 255, 0.08);\n    --hw-border-md: rgba(255, 255, 255, 0.14);\n    --hw-text: #f5f5f5;\n    --hw-text-1: #f5f5f5;\n    --hw-text-2: #a1a1aa;\n    --hw-text-3: #71717a;\n    --hw-text-4: #52525b;\n    --hw-visitor-bubble-bg: #2c2c2e;\n    --hw-visitor-bubble-text: #f5f5f5;\n    --hw-focus-border: rgba(255, 255, 255, 0.28);\n    --hw-focus-ring: rgba(255, 255, 255, 0.08);\n    --hw-brand: #f5f5f5;\n    --hw-on-brand: #1c1c1e;\n  }\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light]) .hw-header {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-header-bot-icon {\n    background: var(--hw-bg-hover);\n  }\n  .hw-header-name,\n  .hw-header-title {\n    color: var(--hw-text);\n  }\n  .hw-header-status {\n    color: var(--hw-text-2);\n  }\n  .hw-header-close,\n  .hw-header-back {\n    color: var(--hw-text-2);\n  }\n  .hw-header-close:hover,\n  .hw-header-back:hover {\n    background: var(--hw-bg-hover);\n    color: var(--hw-text);\n  }\n  .hw-content-entry {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-content-entry:hover {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border-md);\n  }\n  .hw-content-empty,\n  .hw-empty {\n    color: var(--hw-text-3);\n  }\n  .hw-conv-card {\n    border-color: var(--hw-border);\n  }\n  .hw-recent-row {\n    border-color: var(--hw-border);\n  }\n  .hw-composer-drop-overlay {\n    background: rgba(0, 0, 0, 0.6);\n    color: var(--hw-text);\n  }\n  .hw-composer--dragging .hw-composer-box {\n    border-color: var(--hw-focus-border);\n    box-shadow: 0 0 0 3px var(--hw-focus-ring);\n  }\n  .hw-hero {\n    background:\n      linear-gradient(\n        160deg,\n        color-mix(in srgb, var(--hw-primary) 40%, black) 0%,\n        var(--hw-primary) 50%,\n        color-mix(in srgb, var(--hw-primary) 25%, black) 100%);\n  }\n  .hw-sheet {\n    background: var(--hw-bg);\n  }\n  .hw-card {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border);\n  }\n  .hw-card:hover {\n    background: #333;\n  }\n  .hw-window {\n    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);\n  }\n  .hw-bubble:focus-visible {\n    outline-color: var(--hw-text-3);\n  }\n  .hw-msg--visitor .hw-msg-bubble {\n    background: var(--hw-primary);\n    color: white;\n  }\n  .hw-msg-bubble code {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-msg-bubble pre {\n    background: rgba(255, 255, 255, 0.08);\n  }\n  .hw-composer-box {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-composer-input {\n    color: var(--hw-text);\n  }\n  .hw-tabs {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n  .hw-conv-card:hover,\n  .hw-recent-row:hover {\n    background: var(--hw-bg-hover);\n  }\n  .hw-send-error {\n    background: #450a0a;\n    color: #fca5a5;\n  }\n  .hw-error-icon {\n    background: #450a0a;\n    color: #f87171;\n  }\n  .hw-hover-preview {\n    background: #1c1c1e;\n    border-color: var(--hw-border);\n  }\n  .hw-content-search-box {\n    background: var(--hw-bg-hover);\n    border-color: var(--hw-border-md);\n  }\n  .hw-preview {\n    background: var(--hw-bg);\n    border-color: var(--hw-border);\n  }\n}\n.hw-widget[data-hw-placement=docked] {\n  --hw-dock-width: 600px;\n  --hw-dock-bar-width: 480px;\n  --hw-dock-inset: 24px;\n  --hw-bar-max-height: 148px;\n  --hw-dock-surface: #ffffff;\n  --hw-dock-on-surface: #111111;\n  --hw-dock-pill-bg: rgba(44, 44, 48, 0.66);\n  --hw-dock-pill-fg: rgba(255, 255, 255, 0.94);\n  --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] {\n  z-index: 2147483000;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: var(--hw-dock-inset);\n  z-index: 2147483000;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  pointer-events: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock > * {\n  pointer-events: auto;\n}\n.hw-dock-suggestions {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 9px;\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  margin-bottom: 14px;\n}\n.hw-dock-pill-row {\n  align-self: flex-start;\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  animation: hw-dock-pill-in 0.42s cubic-bezier(0.2, 0.9, 0.3, 1) both;\n}\n.hw-dock-pill-dismiss {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  padding: 0;\n  border: 0;\n  background: none;\n  color: var(--hw-dock-pill-fg);\n  cursor: pointer;\n  align-self: flex-start;\n  margin-top: 8px;\n  opacity: 0;\n  transform: scale(0.85);\n  transition:\n    opacity 0.12s linear,\n    transform 0.12s cubic-bezier(0.25, 1, 0.5, 1),\n    color 0.12s linear;\n}\n.hw-dock-pill-dismiss svg {\n  width: 11px;\n  height: 11px;\n}\n.hw-dock-suggestions:hover .hw-dock-pill-dismiss,\n.hw-dock-suggestions:focus-within .hw-dock-pill-dismiss {\n  opacity: 1;\n  transform: none;\n}\n.hw-dock-pill-dismiss:hover {\n  color: var(--hw-dock-on-surface);\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-pill-dismiss {\n    transition: none;\n  }\n}\n@media (hover: none) {\n  .hw-dock-pill-dismiss {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-dock-pill {\n  align-self: flex-start;\n  padding: 10px 18px;\n  border: 1px solid var(--hw-dock-pill-border, transparent);\n  border-radius: 999px;\n  cursor: pointer;\n  font: inherit;\n  font-size: 14px;\n  font-weight: 500;\n  text-align: left;\n  background: var(--hw-dock-pill-bg);\n  color: var(--hw-dock-pill-fg);\n  backdrop-filter: blur(10px) saturate(1.2);\n  -webkit-backdrop-filter: blur(10px) saturate(1.2);\n  box-shadow: 0 4px 14px -8px rgba(12, 11, 10, 0.28);\n  transition:\n    background 0.16s,\n    border-color 0.16s,\n    transform 0.16s;\n}\n.hw-dock-pill {\n  backdrop-filter: blur(18px);\n  -webkit-backdrop-filter: blur(18px);\n}\n.hw-dock-pill:hover {\n  background: color-mix(in srgb, var(--hw-dock-pill-bg) 100%, var(--hw-dock-on-surface) 8%);\n  border-color: color-mix(in srgb, var(--hw-dock-pill-border) 100%, var(--hw-dock-on-surface) 10%);\n  transform: translateX(3px);\n}\n@keyframes hw-dock-pill-in {\n  from {\n    opacity: 0;\n    transform: translateY(10px) scale(0.97);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-dock-bar {\n  display: flex;\n  align-items: flex-end;\n  gap: 10px;\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  min-height: 52px;\n  padding: 10px 10px 10px 18px;\n  border: 0;\n  border-radius: 26px;\n  background: var(--hw-dock-surface);\n  color: var(--hw-dock-on-surface);\n  box-shadow:\n    inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n    0 0 0 1px color-mix(in srgb, var(--hw-dock-on-surface) 7%, transparent),\n    0 2px 6px rgba(12, 11, 10, 0.18),\n    0 20px 48px -14px rgba(12, 11, 10, 0.45);\n  transition:\n    border-radius 0.18s ease,\n    box-shadow 0.2s cubic-bezier(0.2, 0.8, 0.2, 1),\n    width 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);\n}\n.hw-dock-bar:focus-within {\n  box-shadow:\n    inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n    0 0 0 1px color-mix(in srgb, var(--hw-primary, #fb923c) 60%, transparent),\n    0 2px 6px rgba(12, 11, 10, 0.18),\n    0 20px 48px -14px rgba(12, 11, 10, 0.45);\n}\n.hw-dock-bar[data-grown=true] {\n  border-radius: 20px;\n}\n.hw-dock-input {\n  flex: 1;\n  min-width: 0;\n  min-height: 20px;\n  max-height: var(--hw-bar-max-height);\n  padding: 6px 0;\n  border: 0;\n  outline: none;\n  resize: none;\n  overflow-y: auto;\n  background: transparent;\n  color: var(--hw-dock-on-surface);\n  font: inherit;\n  font-size: 14px;\n  line-height: 1.45;\n  transition: height 0.12s ease;\n}\n.hw-dock-input::placeholder {\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 45%, transparent);\n}\n.hw-dock-send {\n  flex: none;\n  width: 32px;\n  height: 32px;\n  margin-bottom: 1px;\n  border: 0;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  background: var(--hw-primary, #fb923c);\n  color: var(--hw-on-brand, #fff);\n  transition: transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.16s;\n}\n.hw-dock-send:hover:not(:disabled) {\n  transform: scale(1.06);\n}\n.hw-dock-send:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  position: fixed;\n  left: 50%;\n  right: auto;\n  margin-left: calc(var(--hw-dock-width) / -2);\n  bottom: calc(var(--hw-dock-inset) + 66px);\n  width: var(--hw-dock-width);\n  max-width: calc(100vw - 32px);\n  height: 420px;\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    left: 16px;\n    right: 16px;\n    margin-left: 0;\n    width: auto;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-bubble {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-window {\n  bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-suggestions {\n  display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-pill,\n  .hw-dock-bar,\n  .hw-dock-input,\n  .hw-dock-send {\n    animation: none;\n    transition: none;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-composer,\n.hw-widget[data-hw-placement=docked] .hw-tabs,\n.hw-widget[data-hw-placement=docked] .hw-footer-tabs {\n  display: none;\n}\n.hw-starters {\n  display: flex;\n  flex-direction: column;\n  margin-top: 10px;\n  border-radius: 14px;\n  overflow: hidden;\n  background: var(--hw-bg);\n  box-shadow: inset 0 0 0 1px var(--hw-border);\n}\n.hw-starter {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 11px 14px;\n  border: 0;\n  border-radius: 0;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text);\n  font: inherit;\n  text-align: left;\n  animation: hw-starter-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n  transition: background 0.12s;\n}\n.hw-starter + .hw-starter {\n  box-shadow: inset 0 1px 0 var(--hw-border);\n}\n.hw-starter:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-starter-text {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 1px;\n}\n.hw-starter-k {\n  font-size: 13px;\n  font-weight: 550;\n  line-height: 1.35;\n  color: var(--hw-text);\n}\n.hw-starter-q {\n  font-size: 12px;\n  line-height: 1.35;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-starter svg {\n  flex: none;\n  color: var(--hw-text-3, var(--hw-text-muted));\n  opacity: 0.45;\n  transition: opacity 0.15s, transform 0.15s;\n}\n.hw-starter:hover svg {\n  opacity: 0.9;\n  transform: translateX(2px);\n}\n@keyframes hw-starter-in {\n  from {\n    opacity: 0;\n    transform: translateY(6px);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-header-back {\n  display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-starter {\n    animation: none;\n  }\n}\n@media (prefers-color-scheme: dark) {\n  .hw-widget:not([data-theme=light])[data-hw-placement=docked] {\n    --hw-dock-surface: #1f1f23;\n    --hw-dock-on-surface: #f4f4f6;\n    --hw-dock-pill-bg: rgba(255, 255, 255, 0.1);\n    --hw-dock-pill-fg: #e4e4e7;\n    --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n  }\n}\n.hw-widget[data-theme=dark][data-hw-placement=docked] {\n  --hw-dock-surface: #1f1f23;\n  --hw-dock-on-surface: #f4f4f6;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  --hw-bg: rgba(255, 255, 255, 0.08);\n  --hw-bg-subtle: transparent;\n  --hw-bg-hover: rgba(255, 255, 255, 0.1);\n  --hw-border: rgba(255, 255, 255, 0.14);\n  --hw-border-md: rgba(255, 255, 255, 0.22);\n  --hw-text: rgba(255, 255, 255, 0.94);\n  --hw-text-1: #ffffff;\n  --hw-text-2: rgba(255, 255, 255, 0.72);\n  --hw-text-3: rgba(255, 255, 255, 0.62);\n  --hw-text-4: rgba(255, 255, 255, 0.46);\n  --hw-visitor-bubble-bg: rgba(255, 255, 255, 0.16);\n  --hw-visitor-bubble-text: #ffffff;\n  --hw-brand: rgba(255, 255, 255, 0.92);\n  --hw-on-brand: #17161a;\n  --hw-focus-border: rgba(255, 255, 255, 0.34);\n  --hw-focus-ring: rgba(255, 255, 255, 0.1);\n  height: 500px;\n  max-height: calc(100vh - 180px);\n  border-radius: 24px;\n  color: var(--hw-text);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(40, 40, 44, 0.72) 0%,\n      rgba(46, 46, 50, 0.7) 55%,\n      rgba(52, 52, 56, 0.68) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    background: #2c2c2e;\n  }\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-window {\n    height: min(60vh, 460px);\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-header--sub {\n  padding: 14px 12px 8px 16px;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-status {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-name {\n  font-size: 15.5px;\n  font-weight: 560;\n  letter-spacing: -0.006em;\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-conv-name,\n.hw-widget[data-hw-placement=docked] .hw-event-name {\n  font-weight: 545;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-bot-icon {\n  border-radius: 50%;\n  overflow: hidden;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-close:hover,\n.hw-widget[data-hw-placement=docked] .hw-header-menu-btn:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-messages {\n  padding: 4px 22px 16px;\n  gap: 18px;\n  -webkit-mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 16px);\n  mask-image:\n    linear-gradient(\n      180deg,\n      transparent 0,\n      #000 16px);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--ai .hw-msg-bubble,\n.hw-widget[data-hw-placement=docked] .hw-msg--team .hw-msg-bubble {\n  padding: 0;\n  background: transparent;\n  border-radius: 0;\n  font-size: 15px;\n  line-height: 1.55;\n  color: var(--hw-text);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--visitor .hw-msg-bubble {\n  background: rgba(255, 255, 255, 0.16);\n  color: #ffffff;\n  font-size: 14.5px;\n  line-height: 1.5;\n}\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble pre,\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble code {\n  background: rgba(0, 0, 0, 0.28);\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row {\n  background: rgba(0, 0, 0, 0.26);\n  border-color: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] .hw-window :focus-visible {\n  outline-color: rgba(255, 255, 255, 0.55);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus,\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus-visible {\n  outline: none;\n  box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row:focus-within {\n  border-color: rgba(255, 255, 255, 0.42);\n  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-submit {\n  background: #ffffff;\n  color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n  position: relative;\n  z-index: 3;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu {\n  background: #3a3a3f;\n  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16), 0 18px 44px -12px rgba(12, 11, 10, 0.62);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button:hover {\n  background: rgba(255, 255, 255, 0.11);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button.hw-header-menu-conv[data-active=true] {\n  background: rgba(255, 255, 255, 0.09);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-convs {\n  border-bottom-color: rgba(255, 255, 255, 0.12);\n}\n.hw-widget[data-hw-placement=docked] .hw-event--card {\n  margin: 0;\n  background: rgba(255, 255, 255, 0.08);\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-event-avatar {\n  background: rgba(255, 255, 255, 0.14);\n  color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview {\n  position: fixed;\n  left: 50%;\n  right: auto;\n  margin-left: calc(var(--hw-dock-bar-width, var(--hw-dock-width)) / -2);\n  bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n  width: var(--hw-dock-bar-width, var(--hw-dock-width));\n  max-width: calc(100vw - 32px);\n  border: 0;\n  border-radius: 24px;\n  color: rgba(255, 255, 255, 0.94);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(40, 40, 44, 0.74) 0%,\n      rgba(52, 52, 56, 0.7) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-name,\n.hw-widget[data-hw-placement=docked] .hw-preview-body {\n  color: rgba(255, 255, 255, 0.94);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close {\n  color: rgba(255, 255, 255, 0.6);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-footer {\n  color: rgba(255, 255, 255, 0.55);\n  border-top-color: rgba(255, 255, 255, 0.1);\n}\n@media (max-width: 640px) {\n  .hw-widget[data-hw-placement=docked] .hw-preview {\n    left: 16px;\n    right: 16px;\n    margin-left: 0;\n    width: auto;\n  }\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-preview {\n    background: #2c2c2e;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn {\n  padding: 7px 14px;\n  font-size: 13px;\n  font-weight: 550;\n  border-radius: 999px;\n  background: rgba(255, 255, 255, 0.94);\n  box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n  color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn:hover:not(:disabled) {\n  background: #ffffff;\n  box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n  transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn[data-tapped=true] {\n  background: rgba(255, 255, 255, 0.22);\n  color: #ffffff;\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);\n  transform: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn svg {\n  opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer {\n  padding: 7px 14px;\n  font-size: 13px;\n  background: rgba(255, 255, 255, 0.94);\n  color: #17161a;\n  box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n  transition:\n    background 0.15s,\n    box-shadow 0.15s,\n    transform 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer:hover {\n  background: #ffffff;\n  color: #17161a;\n  box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n  transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-offer svg {\n  opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar {\n  --hw-dock-on-surface: rgba(255, 255, 255, 0.94);\n  color: rgba(255, 255, 255, 0.94);\n  background:\n    linear-gradient(\n      180deg,\n      rgba(44, 44, 48, 0.74) 0%,\n      rgba(52, 52, 56, 0.72) 100%);\n  backdrop-filter: blur(30px);\n  -webkit-backdrop-filter: blur(30px);\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 18px 40px -16px rgba(12, 11, 10, 0.45);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n  width: var(--hw-dock-width);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar:focus-within {\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26), 0 18px 40px -16px rgba(12, 11, 10, 0.5);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 22px 52px -18px rgba(12, 11, 10, 0.52);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-send:not(:disabled) {\n  background: #ffffff;\n  color: #17161a;\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n  .hw-widget[data-hw-placement=docked] .hw-dock-bar {\n    background: #2c2c2e;\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n  transform-origin: 50% 100%;\n  animation: hw-dock-panel-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing {\n  animation: hw-dock-panel-out 0.18s cubic-bezier(0.4, 0, 1, 1) forwards;\n}\n@keyframes hw-dock-panel-in {\n  from {\n    opacity: 0;\n    transform: translateY(14px) scale(0.98);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n@keyframes hw-dock-panel-out {\n  from {\n    opacity: 1;\n    transform: none;\n  }\n  to {\n    opacity: 0;\n    transform: translateY(8px) scale(0.99);\n  }\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n  animation: hw-dock-settle 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.06s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n  animation: hw-dock-settle 0.34s cubic-bezier(0.16, 1, 0.3, 1) 0.11s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-header--sub,\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-messages {\n  animation: none;\n}\n@keyframes hw-dock-settle {\n  from {\n    opacity: 0;\n    transform: translateY(7px);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-widget[data-hw-placement=docked] .hw-window,\n  .hw-widget[data-hw-placement=docked] .hw-window--closing,\n  .hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub,\n  .hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n    animation: none;\n  }\n}\n.hw-dock-bar {\n  flex-wrap: wrap;\n  padding-left: 18px;\n  padding-right: 8px;\n}\n.hw-dock-error {\n  width: var(--hw-dock-width);\n  max-width: calc(100vw - 32px);\n  margin-bottom: 8px;\n  padding: 8px 14px;\n  border-radius: 14px;\n  background: rgba(190, 24, 40, 0.92);\n  color: #ffffff;\n  font-size: 12.5px;\n  line-height: 1.35;\n  box-shadow: 0 10px 26px -12px rgba(12, 11, 10, 0.5);\n  animation: hw-dock-settle 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-error {\n    animation: none;\n  }\n}\n.hw-dock-previews {\n  flex: 0 0 100%;\n  order: -1;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  padding: 2px 0 8px;\n}\n.hw-dock-lead {\n  flex: none;\n  display: grid;\n  place-items: center;\n  width: 32px;\n  height: 32px;\n  margin-left: -8px;\n}\n.hw-dock-actions {\n  flex: none;\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  margin-bottom: 1px;\n}\n.hw-dock-tool {\n  display: grid;\n  place-items: center;\n  width: 30px;\n  height: 30px;\n  border: 0;\n  border-radius: 50%;\n  background: transparent;\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 52%, transparent);\n  cursor: pointer;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-dock-tool:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--hw-dock-on-surface) 8%, transparent);\n  color: var(--hw-dock-on-surface);\n}\n.hw-dock-tool:disabled {\n  opacity: 0.4;\n  cursor: default;\n}\n.hw-dock-tool[data-active=true] {\n  color: #e11d48;\n  background: rgba(225, 29, 72, 0.12);\n  animation: hw-dock-listening 1.4s ease-in-out infinite;\n}\n@keyframes hw-dock-listening {\n  0%, 100% {\n    box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.35);\n  }\n  50% {\n    box-shadow: 0 0 0 4px rgba(225, 29, 72, 0);\n  }\n}\n.hw-dock-send:disabled {\n  opacity: 1;\n  background: color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent);\n  color: color-mix(in srgb, var(--hw-dock-on-surface) 38%, transparent);\n}\n@media (prefers-reduced-motion: reduce) {\n  .hw-dock-tool[data-active=true] {\n    animation: none;\n  }\n  .hw-dock-bar {\n    transition: none;\n  }\n}\n.hw-dock-input:focus,\n.hw-dock-input:focus-visible {\n  outline: none;\n  box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-powered {\n  display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-disconnect {\n  border-radius: 20px 20px 0 0;\n}\n.hw-msg-meta {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n.hw-msg-author {\n  font-weight: 550;\n}\n.hw-msg-meta-sep {\n  opacity: 0.55;\n}\n.hw-header-actions {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 2px;\n}\n.hw-header-menu-btn {\n  display: grid;\n  place-items: center;\n  width: 30px;\n  height: 30px;\n  border: 0;\n  border-radius: 8px;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text-2, var(--hw-text-muted));\n  transition: background 0.15s, color 0.15s;\n}\n.hw-header-menu-btn:hover {\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n}\n.hw-header-menu {\n  position: absolute;\n  top: 36px;\n  right: 0;\n  z-index: 6;\n  min-width: 236px;\n  max-width: 288px;\n  padding: 5px;\n  border-radius: 14px;\n  background: var(--hw-bg);\n  color: var(--hw-text);\n  box-shadow: 0 0 0 1px var(--hw-border), 0 12px 32px -10px rgba(0, 0, 0, 0.32);\n  animation: hw-menu-in 0.16s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n}\n@keyframes hw-menu-in {\n  from {\n    opacity: 0;\n    transform: translateY(-4px) scale(0.98);\n  }\n  to {\n    opacity: 1;\n    transform: none;\n  }\n}\n.hw-header-menu button {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 9px 10px;\n  border: 0;\n  border-radius: 9px;\n  cursor: pointer;\n  background: transparent;\n  color: var(--hw-text);\n  font: inherit;\n  font-size: 13px;\n  text-align: left;\n  transition: background 0.14s;\n}\n.hw-header-menu button:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-header-menu button svg {\n  flex: none;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu button:hover svg {\n  color: var(--hw-brand, var(--hw-primary));\n}\n.hw-header-menu-convs {\n  display: flex;\n  flex-direction: column;\n  max-height: 168px;\n  overflow-y: auto;\n  padding-bottom: 5px;\n  margin-bottom: 5px;\n  border-bottom: 1px solid var(--hw-border);\n}\n.hw-header-menu button.hw-header-menu-conv {\n  flex-direction: column;\n  align-items: stretch;\n  gap: 2px;\n  padding: 8px 10px;\n}\n.hw-header-menu button.hw-header-menu-conv[data-active=true] {\n  background: var(--hw-bg-hover);\n}\n.hw-header-menu-conv-top {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  gap: 8px;\n}\n.hw-header-menu-conv-name {\n  overflow: hidden;\n  font-size: 12.5px;\n  font-weight: 600;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.hw-header-menu-conv-time {\n  flex: none;\n  font-size: 11px;\n  color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu-conv-preview {\n  overflow: hidden;\n  font-size: 12px;\n  color: var(--hw-text-2);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.hw-offers {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  margin-top: 10px;\n}\n.hw-offer {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 14px;\n  border: 0;\n  border-radius: 999px;\n  cursor: pointer;\n  background: var(--hw-bg-hover);\n  color: var(--hw-text);\n  font: inherit;\n  font-size: 12.5px;\n  font-weight: 550;\n  transition: background 0.15s, color 0.15s;\n}\n.hw-offer:hover {\n  background: var(--hw-brand, var(--hw-primary));\n  color: var(--hw-on-brand, #fff);\n}\n.hw-offer svg {\n  flex: none;\n}\n.hw-sources {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  margin-top: 4px;\n}\n.hw-source {\n  display: flex;\n  align-items: center;\n  gap: 9px;\n  padding: 5px 14px;\n  border-radius: 9px;\n  background: transparent;\n  color: var(--hw-text);\n  text-decoration: none;\n  transition: background 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-source {\n  margin-inline: -8px;\n  padding-inline: 8px;\n}\na.hw-source {\n  cursor: pointer;\n}\na.hw-source:hover {\n  background: var(--hw-bg-hover);\n}\n.hw-source-n {\n  display: grid;\n  place-items: center;\n  flex: none;\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  background: var(--hw-brand, var(--hw-primary));\n  color: var(--hw-on-brand, #fff);\n  font-size: 10px;\n  font-weight: 700;\n  font-variant-numeric: tabular-nums;\n}\n.hw-source-title {\n  flex: 1;\n  min-width: 0;\n  font-size: 12px;\n  font-weight: 550;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] {\n  --hw-dock-tint: var(--hw-primary);\n  --hw-dock-ink: #ffffff;\n  --hw-dock-shade: #000000;\n  --hw-dock-wash: var(--hw-dock-shade);\n  --hw-dock-ink-2: color-mix(in srgb, var(--hw-dock-ink) 86%, var(--hw-dock-tint));\n  --hw-dock-ink-3: color-mix(in srgb, var(--hw-dock-ink) 78%, var(--hw-dock-tint));\n  --hw-dock-ink-4: color-mix(in srgb, var(--hw-dock-ink) 60%, var(--hw-dock-tint));\n  --hw-dock-pill-bg: var(--hw-dock-tint);\n  --hw-dock-pill-fg: var(--hw-dock-ink);\n  --hw-dock-pill-border: color-mix(in srgb, var(--hw-dock-ink) 30%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-window, .hw-dock-bar, .hw-preview) {\n  --hw-text: var(--hw-dock-ink);\n  --hw-text-1: var(--hw-dock-ink);\n  --hw-text-2: var(--hw-dock-ink-2);\n  --hw-text-3: var(--hw-dock-ink-3);\n  --hw-text-4: var(--hw-dock-ink-4);\n  --hw-text-muted: var(--hw-dock-ink-2);\n  --hw-bg: color-mix(in srgb, var(--hw-dock-wash) 12%, transparent);\n  --hw-bg-subtle: transparent;\n  --hw-bg-hover: color-mix(in srgb, var(--hw-dock-wash) 18%, transparent);\n  --hw-border: color-mix(in srgb, var(--hw-dock-ink) 22%, transparent);\n  --hw-border-md: color-mix(in srgb, var(--hw-dock-ink) 34%, transparent);\n  --hw-focus-border: color-mix(in srgb, var(--hw-dock-ink) 60%, transparent);\n  --hw-focus-ring: color-mix(in srgb, var(--hw-dock-ink) 18%, transparent);\n  --hw-visitor-bubble-bg: color-mix(in srgb, var(--hw-dock-wash) 14%, transparent);\n  --hw-visitor-bubble-text: var(--hw-dock-ink);\n  --hw-primary: var(--hw-dock-ink);\n  --hw-primary-hover: var(--hw-dock-ink);\n  --hw-brand: var(--hw-dock-ink);\n  --hw-on-brand: var(--hw-dock-tint);\n  --hw-dock-surface: transparent;\n  --hw-dock-on-surface: var(--hw-dock-ink);\n  color: var(--hw-dock-ink);\n  background:\n    radial-gradient(\n      70% 60% at 86% 8%,\n      var(--hw-dock-tint),\n      transparent 64%),\n    linear-gradient(\n      165deg,\n      color-mix(in srgb, var(--hw-dock-shade) 12%, var(--hw-dock-tint)) 0%,\n      color-mix(in srgb, var(--hw-dock-shade) 30%, var(--hw-dock-tint)) 100%);\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px color-mix(in srgb, var(--hw-dock-ink) 16%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble {\n  background: var(--hw-dock-ink);\n  color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble a,\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble a:hover {\n  color: inherit;\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-dock-send:not(:disabled), .hw-quick-reply-btn, .hw-quick-reply-btn:hover:not(:disabled), .hw-email-card-submit, .hw-offer, .hw-offer:hover) {\n  background: var(--hw-dock-ink);\n  color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-preview-body, .hw-header-close:hover, .hw-header-menu-btn:hover, .hw-preview-close:hover, .hw-quick-reply-btn[data-tapped=true]) {\n  color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-preview-close, .hw-preview-footer) {\n  color: var(--hw-dock-ink-2);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-quick-reply-btn[data-tapped=true] {\n  background: color-mix(in srgb, var(--hw-dock-wash) 22%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-window :focus-visible {\n  outline-color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg-bubble :is(pre, code),\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-email-card-row {\n  background: color-mix(in srgb, var(--hw-dock-shade) 26%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-header-menu {\n  background: color-mix(in srgb, var(--hw-dock-shade) 34%, var(--hw-dock-tint));\n  color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-header-bot-icon--team, .hw-event-avatar) {\n  background: var(--hw-dock-ink);\n  color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-dock-input::placeholder {\n  color: var(--hw-dock-ink-3);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-typing-dot {\n  background: var(--hw-dock-ink-2);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-disconnect {\n  background: color-mix(in srgb, var(--hw-dock-shade) 16%, transparent);\n  color: var(--hw-dock-ink-2);\n}\n');
 
 // src/helpway-widget.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 function HelpwayWidget({
   apiKey,
   apiUrl,
@@ -6992,7 +7794,7 @@ function HelpwayWidget({
   src
 }) {
   const resolvedApiUrl = apiUrl ?? (src ? src.replace(/\/widget\.js$/, "") : void 0);
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx20(
     SupportProvider,
     {
       apiKey,
@@ -7006,7 +7808,7 @@ function HelpwayWidget({
       onClose,
       onUnreadChange,
       theme,
-      children: /* @__PURE__ */ jsx17(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx17(
+      children: /* @__PURE__ */ jsx20(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx20(
         DefaultWidget,
         {
           hideLauncher,
@@ -7020,14 +7822,14 @@ function HelpwayWidget({
 }
 
 // src/hooks/use-realtime.ts
-import { useEffect as useEffect16, useRef as useRef16 } from "react";
+import { useEffect as useEffect17, useRef as useRef18 } from "react";
 function useRealtime(handler) {
   const { ws } = useWidgetContext();
-  const handlerRef = useRef16(handler);
-  useEffect16(() => {
+  const handlerRef = useRef18(handler);
+  useEffect17(() => {
     handlerRef.current = handler;
   });
-  useEffect16(() => {
+  useEffect17(() => {
     return ws.onEvent((event) => handlerRef.current(event));
   }, [ws]);
 }