@helpway/react 0.17.0 → 0.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -55,7 +55,11 @@ function createWidgetClient(config) {
55
55
  headers() {
56
56
  return {
57
57
  "X-Public-Key": config.apiKey,
58
- "X-Visitor-Id": getOrCreateVisitorId(config.apiKey)
58
+ "X-Visitor-Id": getOrCreateVisitorId(config.apiKey),
59
+ /* Only when it is not the default. A header on every web
60
+ request to say "web" is a byte per call to tell the server
61
+ what it already assumes. */
62
+ ...config.surface === "mobile" ? { "X-Visitor-Surface": "mobile" } : {}
59
63
  };
60
64
  },
61
65
  fetch(url, options) {
@@ -66,6 +70,9 @@ function createWidgetClient(config) {
66
70
  });
67
71
  }
68
72
 
73
+ // ../types/src/visitor.ts
74
+ var ONLINE_WINDOW_MS = 5 * 6e4;
75
+
69
76
  // ../types/src/model-registry.ts
70
77
  var AI_MODELS = {
71
78
  "openai/gpt-5.5": {
@@ -373,8 +380,12 @@ var DOC_NAV_ICON_MAP = Object.fromEntries(
373
380
  DOC_NAV_ICONS.map((i) => [i.name, i])
374
381
  );
375
382
 
383
+ // ../types/src/upload.ts
384
+ var MAX_FILE_SIZE = 10 * 1024 * 1024;
385
+ var MAX_BASE64_LENGTH = Math.ceil(MAX_FILE_SIZE * 1.37);
386
+
376
387
  // ../widget-core/src/version.ts
377
- var SDK_VERSION = "0.17.0".length > 0 ? "0.17.0" : "dev";
388
+ var SDK_VERSION = "0.17.1".length > 0 ? "0.17.1" : "dev";
378
389
 
379
390
  // ../widget-core/src/ws.ts
380
391
  var WebSocketManager = class {
@@ -859,6 +870,7 @@ function latestAssignee(items) {
859
870
  return null;
860
871
  }
861
872
  var AI_INDICATOR_MAX_MS = 45e3;
873
+ var TYPING_IDLE_MS = 5e3;
862
874
  function createWidgetStore() {
863
875
  const indicatorWatchdogs = /* @__PURE__ */ new Map();
864
876
  const clearWatchdog = (conversationId) => {
@@ -868,6 +880,14 @@ function createWidgetStore() {
868
880
  indicatorWatchdogs.delete(conversationId);
869
881
  }
870
882
  };
883
+ const typingTimers = /* @__PURE__ */ new Map();
884
+ const clearTypingTimer = (conversationId) => {
885
+ const timer = typingTimers.get(conversationId);
886
+ if (timer !== void 0) {
887
+ clearTimeout(timer);
888
+ typingTimers.delete(conversationId);
889
+ }
890
+ };
871
891
  const store = createStore((set, get) => ({
872
892
  // Initial state
873
893
  isReady: false,
@@ -1027,6 +1047,7 @@ function createWidgetStore() {
1027
1047
  });
1028
1048
  },
1029
1049
  remapConversationId(oldId, newId) {
1050
+ clearTypingTimer(oldId);
1030
1051
  if (indicatorWatchdogs.has(oldId)) {
1031
1052
  clearWatchdog(oldId);
1032
1053
  indicatorWatchdogs.set(
@@ -1233,7 +1254,11 @@ function createWidgetStore() {
1233
1254
  },
1234
1255
  // ── Content Cache ────────────────────────────────
1235
1256
  setContentCache(key, data) {
1236
- get().contentCache.set(key, { data, ts: Date.now() });
1257
+ set((s) => {
1258
+ const next = new Map(s.contentCache);
1259
+ next.set(key, { data, ts: Date.now() });
1260
+ return { contentCache: next };
1261
+ });
1237
1262
  },
1238
1263
  // ── Realtime Event Handler ───────────────────────
1239
1264
  handleRealtimeEvent(event) {
@@ -1309,10 +1334,15 @@ function createWidgetStore() {
1309
1334
  case WsEventType.ConversationTyping: {
1310
1335
  if (!event.visitorId) {
1311
1336
  state.setTyping(event.conversationId, event.isTyping);
1337
+ clearTypingTimer(event.conversationId);
1312
1338
  if (event.isTyping) {
1313
- setTimeout(() => {
1314
- state.setTyping(event.conversationId, false);
1315
- }, 5e3);
1339
+ typingTimers.set(
1340
+ event.conversationId,
1341
+ setTimeout(() => {
1342
+ typingTimers.delete(event.conversationId);
1343
+ state.setTyping(event.conversationId, false);
1344
+ }, TYPING_IDLE_MS)
1345
+ );
1316
1346
  }
1317
1347
  }
1318
1348
  break;
@@ -1396,7 +1426,7 @@ function installCallable(methods) {
1396
1426
  return callable;
1397
1427
  }
1398
1428
  function createHelpwayAPI(deps) {
1399
- const { store, emitter, identify, apiKey } = deps;
1429
+ const { store, emitter, identify, apiKey, apiUrl } = deps;
1400
1430
  return {
1401
1431
  open() {
1402
1432
  store.getState().setOpen(true);
@@ -1431,6 +1461,14 @@ function createHelpwayAPI(deps) {
1431
1461
  if (typeof document !== "undefined") {
1432
1462
  document.cookie = "hw_visitor=; Path=/; Max-Age=0";
1433
1463
  }
1464
+ if (apiUrl && typeof fetch !== "undefined") {
1465
+ void fetch(`${apiUrl.replace(/\/+$/, "")}/widget/reset-visitor`, {
1466
+ method: "POST",
1467
+ credentials: "include",
1468
+ headers: { "x-public-key": apiKey }
1469
+ }).catch(() => {
1470
+ });
1471
+ }
1434
1472
  },
1435
1473
  identify,
1436
1474
  newConversation(prefill) {
@@ -1650,6 +1688,7 @@ function useWidgetClient() {
1650
1688
  function SupportProvider({
1651
1689
  apiKey,
1652
1690
  apiUrl,
1691
+ surface,
1653
1692
  locale,
1654
1693
  initialConversationId,
1655
1694
  deepLinkToken,
@@ -1671,7 +1710,8 @@ function SupportProvider({
1671
1710
  const resolvedApiUrl = apiUrl ?? inferApiUrl();
1672
1711
  const client2 = createWidgetClient({
1673
1712
  apiUrl: resolvedApiUrl,
1674
- apiKey
1713
+ apiKey,
1714
+ surface
1675
1715
  });
1676
1716
  const store2 = createWidgetStore();
1677
1717
  const emitter2 = new WidgetEventEmitter();
@@ -1700,7 +1740,7 @@ function SupportProvider({
1700
1740
  console.error("[Helpway] identify failed:", err);
1701
1741
  }
1702
1742
  };
1703
- const api2 = createHelpwayAPI({ store: store2, emitter: emitter2, identify: identify2, apiKey });
1743
+ const api2 = createHelpwayAPI({ store: store2, emitter: emitter2, identify: identify2, apiKey, apiUrl: resolvedApiUrl });
1704
1744
  initRef.current = { client: client2, store: store2, ws: ws2, identify: identify2, api: api2, emitter: emitter2 };
1705
1745
  }
1706
1746
  const { client, store, ws, identify, api, emitter } = initRef.current;
@@ -2083,7 +2123,7 @@ function inferApiUrl() {
2083
2123
  }
2084
2124
 
2085
2125
  // src/themed/default-widget.tsx
2086
- import { createContext as createContext2, useCallback as useCallback13, useContext as useContext2, useEffect as useEffect15, useRef as useRef15, useState as useState15 } from "react";
2126
+ import { createContext as createContext2, useCallback as useCallback14, useContext as useContext2, useEffect as useEffect16, useRef as useRef17, useState as useState16 } from "react";
2087
2127
 
2088
2128
  // src/hooks/use-announcements.ts
2089
2129
  import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2 } from "react";
@@ -2252,7 +2292,7 @@ function useAwaitingReply() {
2252
2292
  }
2253
2293
 
2254
2294
  // src/hooks/use-composer.ts
2255
- import { useCallback as useCallback3, useState as useState2 } from "react";
2295
+ import { useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3, useState as useState2 } from "react";
2256
2296
  function currentPagePayload() {
2257
2297
  if (typeof window === "undefined") return {};
2258
2298
  const url = window.location.href;
@@ -2260,7 +2300,7 @@ function currentPagePayload() {
2260
2300
  return { page: { url, title: document.title || window.location.pathname } };
2261
2301
  }
2262
2302
  var MAX_ATTACHMENTS = 10;
2263
- var MAX_FILE_SIZE = 10 * 1024 * 1024;
2303
+ var MAX_FILE_SIZE2 = 10 * 1024 * 1024;
2264
2304
  var ACCEPTED_TYPES = [
2265
2305
  "image/png",
2266
2306
  "image/jpeg",
@@ -2282,6 +2322,19 @@ function useComposer(boundConversationId) {
2282
2322
  const [text, setText] = useState2("");
2283
2323
  const [isSubmitting, setIsSubmitting] = useState2(false);
2284
2324
  const [attachments, setAttachments] = useState2([]);
2325
+ const liveUrls = useRef3(/* @__PURE__ */ new Set());
2326
+ useEffect3(() => {
2327
+ const urls = liveUrls.current;
2328
+ return () => {
2329
+ for (const url of urls) URL.revokeObjectURL(url);
2330
+ urls.clear();
2331
+ };
2332
+ }, []);
2333
+ const revoke = useCallback3((url) => {
2334
+ if (!url) return;
2335
+ URL.revokeObjectURL(url);
2336
+ liveUrls.current.delete(url);
2337
+ }, []);
2285
2338
  const [sendError, setSendError] = useState2(null);
2286
2339
  const [emailGateConvId, setEmailGateConvId] = useState2(null);
2287
2340
  const addFiles = useCallback3(
@@ -2290,10 +2343,15 @@ function useComposer(boundConversationId) {
2290
2343
  const remaining = MAX_ATTACHMENTS - attachments.length;
2291
2344
  const toAdd = files.slice(0, remaining);
2292
2345
  if (toAdd.length === 0) return;
2346
+ const makePreviewUrl = (file) => {
2347
+ const url = URL.createObjectURL(file);
2348
+ liveUrls.current.add(url);
2349
+ return url;
2350
+ };
2293
2351
  const pending = toAdd.map((file) => ({
2294
2352
  id: `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
2295
2353
  file,
2296
- previewUrl: file.type.startsWith("image/") ? URL.createObjectURL(file) : null,
2354
+ previewUrl: file.type.startsWith("image/") ? makePreviewUrl(file) : null,
2297
2355
  isUploading: true,
2298
2356
  error: null,
2299
2357
  part: null
@@ -2301,7 +2359,7 @@ function useComposer(boundConversationId) {
2301
2359
  setAttachments((prev) => [...prev, ...pending]);
2302
2360
  for (const item of pending) {
2303
2361
  try {
2304
- if (item.file.size > MAX_FILE_SIZE) {
2362
+ if (item.file.size > MAX_FILE_SIZE2) {
2305
2363
  throw new Error(t("widget.file_too_large"));
2306
2364
  }
2307
2365
  const base64 = await fileToBase64(item.file);
@@ -2327,13 +2385,13 @@ function useComposer(boundConversationId) {
2327
2385
  },
2328
2386
  [conversationId, attachments.length, client]
2329
2387
  );
2330
- const removeAttachment = useCallback3((id) => {
2331
- setAttachments((prev) => {
2332
- const item = prev.find((a) => a.id === id);
2333
- if (item?.previewUrl) URL.revokeObjectURL(item.previewUrl);
2334
- return prev.filter((a) => a.id !== id);
2335
- });
2336
- }, []);
2388
+ const removeAttachment = useCallback3(
2389
+ (id) => {
2390
+ revoke(attachments.find((a) => a.id === id)?.previewUrl);
2391
+ setAttachments((prev) => prev.filter((a) => a.id !== id));
2392
+ },
2393
+ [attachments, revoke]
2394
+ );
2337
2395
  const submit = useCallback3(
2338
2396
  async (override) => {
2339
2397
  const conversationId2 = override?.conversationId ?? boundConversationId;
@@ -2432,9 +2490,7 @@ function useComposer(boundConversationId) {
2432
2490
  });
2433
2491
  store.getState().replaceMessage(conversationId2, optimisticId, result.item);
2434
2492
  }
2435
- for (const a of attachmentsSnapshot) {
2436
- if (a.previewUrl) URL.revokeObjectURL(a.previewUrl);
2437
- }
2493
+ for (const a of attachmentsSnapshot) revoke(a.previewUrl);
2438
2494
  } catch (err) {
2439
2495
  console.error("[useComposer] Send failed:", err);
2440
2496
  store.getState().removeMessage(conversationId2, optimisticId);
@@ -2478,16 +2534,16 @@ function fileToBase64(file) {
2478
2534
  }
2479
2535
 
2480
2536
  // src/hooks/use-conversations.ts
2481
- import { useCallback as useCallback4, useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
2537
+ import { useCallback as useCallback4, useEffect as useEffect4, useRef as useRef4, useState as useState3 } from "react";
2482
2538
  function useConversations() {
2483
2539
  const { client, store, getSourceLocale } = useWidgetContext();
2484
2540
  const conversations = useWidgetStore((s) => s.conversations);
2485
2541
  const setActiveConversation = useWidgetStore((s) => s.setActiveConversation);
2486
2542
  const [isCreating, setIsCreating] = useState3(false);
2487
- const clientRef = useRef3(client);
2488
- const storeRef = useRef3(store);
2489
- const getSourceLocaleRef = useRef3(getSourceLocale);
2490
- useEffect3(() => {
2543
+ const clientRef = useRef4(client);
2544
+ const storeRef = useRef4(store);
2545
+ const getSourceLocaleRef = useRef4(getSourceLocale);
2546
+ useEffect4(() => {
2491
2547
  clientRef.current = client;
2492
2548
  storeRef.current = store;
2493
2549
  getSourceLocaleRef.current = getSourceLocale;
@@ -2588,10 +2644,10 @@ function useHeaderIdentity() {
2588
2644
  }
2589
2645
 
2590
2646
  // src/hooks/use-i18n.ts
2591
- import { useEffect as useEffect4, useState as useState4 } from "react";
2647
+ import { useEffect as useEffect5, useState as useState4 } from "react";
2592
2648
  function useI18n() {
2593
2649
  const [rev, setRev] = useState4(() => getI18nRevision());
2594
- useEffect4(() => {
2650
+ useEffect5(() => {
2595
2651
  return onLocaleChange(() => {
2596
2652
  setRev(getI18nRevision());
2597
2653
  });
@@ -2600,7 +2656,7 @@ function useI18n() {
2600
2656
  }
2601
2657
 
2602
2658
  // src/hooks/use-presence.ts
2603
- import { useCallback as useCallback5, useRef as useRef4 } from "react";
2659
+ import { useCallback as useCallback5, useRef as useRef5 } from "react";
2604
2660
  function usePresence(conversationId) {
2605
2661
  const { ws } = useWidgetContext();
2606
2662
  const isTyping = useWidgetStore(
@@ -2609,8 +2665,8 @@ function usePresence(conversationId) {
2609
2665
  const isAiProcessing = useWidgetStore(
2610
2666
  (s) => conversationId ? s.aiProcessing.get(conversationId) ?? false : false
2611
2667
  );
2612
- const typingTimer = useRef4(null);
2613
- const isSendingTyping = useRef4(false);
2668
+ const typingTimer = useRef5(null);
2669
+ const isSendingTyping = useRef5(false);
2614
2670
  const setTyping = useCallback5(
2615
2671
  (typing) => {
2616
2672
  if (!conversationId) return;
@@ -2637,7 +2693,7 @@ function usePresence(conversationId) {
2637
2693
  }
2638
2694
 
2639
2695
  // src/hooks/use-timeline.ts
2640
- import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef5, useState as useState5 } from "react";
2696
+ import { useCallback as useCallback6, useEffect as useEffect6, useRef as useRef6, useState as useState5 } from "react";
2641
2697
  var EMPTY_ITEMS = [];
2642
2698
  function useTimeline(conversationId) {
2643
2699
  const { client, store } = useWidgetContext();
@@ -2646,14 +2702,14 @@ function useTimeline(conversationId) {
2646
2702
  );
2647
2703
  const [isLoading, setIsLoading] = useState5(false);
2648
2704
  const [hasMore, setHasMore] = useState5(false);
2649
- const cursorRef = useRef5(void 0);
2650
- const clientRef = useRef5(client);
2651
- const storeRef = useRef5(store);
2652
- useEffect5(() => {
2705
+ const cursorRef = useRef6(void 0);
2706
+ const clientRef = useRef6(client);
2707
+ const storeRef = useRef6(store);
2708
+ useEffect6(() => {
2653
2709
  clientRef.current = client;
2654
2710
  storeRef.current = store;
2655
2711
  });
2656
- useEffect5(() => {
2712
+ useEffect6(() => {
2657
2713
  if (!conversationId) return;
2658
2714
  if (conversationId.startsWith("temp-")) return;
2659
2715
  let cancelled = false;
@@ -2737,10 +2793,10 @@ function useWidget() {
2737
2793
  }
2738
2794
 
2739
2795
  // src/shell/docked-bar.tsx
2740
- import { useCallback as useCallback8, useEffect as useEffect6, useRef as useRef7, useState as useState7 } from "react";
2796
+ import { useCallback as useCallback8, useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
2741
2797
 
2742
2798
  // src/themed/composer.tsx
2743
- import { useCallback as useCallback7, useRef as useRef6, useState as useState6 } from "react";
2799
+ import { useCallback as useCallback7, useRef as useRef7, useState as useState6 } from "react";
2744
2800
 
2745
2801
  // src/themed/icons.tsx
2746
2802
  import { jsx as jsx2, jsxs } from "react/jsx-runtime";
@@ -2964,25 +3020,6 @@ function StarIcon({ size = 24, ...props }) {
2964
3020
  }
2965
3021
  );
2966
3022
  }
2967
- function DotsIcon({ size = 24, ...props }) {
2968
- return /* @__PURE__ */ jsxs(
2969
- "svg",
2970
- {
2971
- width: size,
2972
- height: size,
2973
- viewBox: "0 0 24 24",
2974
- fill: "none",
2975
- xmlns: "http://www.w3.org/2000/svg",
2976
- "aria-hidden": "true",
2977
- ...props,
2978
- children: [
2979
- /* @__PURE__ */ jsx2("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
2980
- /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
2981
- /* @__PURE__ */ jsx2("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
2982
- ]
2983
- }
2984
- );
2985
- }
2986
3023
 
2987
3024
  // src/themed/composer.tsx
2988
3025
  import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -3001,9 +3038,9 @@ function Composer({
3001
3038
  onRemoveAttachment,
3002
3039
  disabled
3003
3040
  }) {
3004
- const ref = useRef6(null);
3005
- const fileInputRef = useRef6(null);
3006
- const supportsFieldSizing = useRef6(
3041
+ const ref = useRef7(null);
3042
+ const fileInputRef = useRef7(null);
3043
+ const supportsFieldSizing = useRef7(
3007
3044
  typeof CSS !== "undefined" && CSS.supports?.("field-sizing", "content")
3008
3045
  );
3009
3046
  const handleKeyDown = useCallback7(
@@ -3043,7 +3080,7 @@ function Composer({
3043
3080
  [onAddFiles]
3044
3081
  );
3045
3082
  const [isDragging, setIsDragging] = useState6(false);
3046
- const dragCountRef = useRef6(0);
3083
+ const dragCountRef = useRef7(0);
3047
3084
  const handleDragEnter = useCallback7((e) => {
3048
3085
  e.preventDefault();
3049
3086
  dragCountRef.current++;
@@ -3209,13 +3246,13 @@ function recognitionCtor() {
3209
3246
  }
3210
3247
  function useDictation(onText) {
3211
3248
  const [listening, setListening] = useState7(false);
3212
- const recRef = useRef7(null);
3213
- const onTextRef = useRef7(onText);
3214
- useEffect6(() => {
3249
+ const recRef = useRef8(null);
3250
+ const onTextRef = useRef8(onText);
3251
+ useEffect7(() => {
3215
3252
  onTextRef.current = onText;
3216
3253
  }, [onText]);
3217
3254
  const [supported] = useState7(() => recognitionCtor() !== null);
3218
- useEffect6(
3255
+ useEffect7(
3219
3256
  () => () => {
3220
3257
  recRef.current?.stop();
3221
3258
  recRef.current = null;
@@ -3284,9 +3321,9 @@ function DockedBar({
3284
3321
  leading
3285
3322
  }) {
3286
3323
  const [focused, setFocused] = useState7(false);
3287
- const inputRef = useRef7(null);
3288
- const boxRef = useRef7(null);
3289
- const fileInputRef = useRef7(null);
3324
+ const inputRef = useRef8(null);
3325
+ const boxRef = useRef8(null);
3326
+ const fileInputRef = useRef8(null);
3290
3327
  const { questions: visibleQuestions, dismiss: dismissOffer } = useDismissableOffer(suggestions);
3291
3328
  const dictation = useDictation((chunk) => {
3292
3329
  const current = inputRef.current?.value ?? value;
@@ -3302,7 +3339,7 @@ function DockedBar({
3302
3339
  el.style.height = `${next}px`;
3303
3340
  box.dataset.grown = next > GROWN_AT ? "true" : "false";
3304
3341
  }, []);
3305
- useEffect6(grow, [grow, value]);
3342
+ useEffect7(grow, [grow, value]);
3306
3343
  const handleKeyDown = useCallback8(
3307
3344
  (event) => {
3308
3345
  if (event.key !== "Enter" || event.shiftKey) return;
@@ -3600,10 +3637,24 @@ function AnnouncementPreviewItem({
3600
3637
  }
3601
3638
 
3602
3639
  // src/themed/content/content-tab-view.tsx
3603
- import { useCallback as useCallback12, useEffect as useEffect10 } from "react";
3640
+ import { useCallback as useCallback13, useEffect as useEffect11 } from "react";
3641
+
3642
+ // src/hooks/use-content-tab.ts
3643
+ import { useCallback as useCallback10, useEffect as useEffect8, useState as useState10 } from "react";
3644
+
3645
+ // src/hooks/use-mirrored-state.ts
3646
+ import { useCallback as useCallback9, useRef as useRef9, useState as useState9 } from "react";
3647
+ function useMirroredState(initial) {
3648
+ const [value, setValue] = useState9(initial);
3649
+ const ref = useRef9(value);
3650
+ const set = useCallback9((next) => {
3651
+ ref.current = next;
3652
+ setValue(next);
3653
+ }, []);
3654
+ return [value, set, ref];
3655
+ }
3604
3656
 
3605
3657
  // src/hooks/use-content-tab.ts
3606
- import { useCallback as useCallback9, useEffect as useEffect7, useState as useState9 } from "react";
3607
3658
  var EMPTY_TABS2 = [];
3608
3659
  function listKey(tabId, lang) {
3609
3660
  return `flat:${tabId}:${lang}:list`;
@@ -3623,22 +3674,22 @@ function useContentTab(tabId) {
3623
3674
  const tab = contentTabs.find((t2) => t2.id === tabId) ?? null;
3624
3675
  const lang = getLocale();
3625
3676
  const cache = store.getState().contentCache;
3626
- const [entries, setEntries] = useState9(
3677
+ const [entries, setEntries, entriesRef] = useMirroredState(
3627
3678
  () => readCache(cache, listKey(tabId, lang))?.items ?? []
3628
3679
  );
3629
- const [detail, setDetail] = useState9(null);
3630
- const [isLoading, setIsLoading] = useState9(false);
3631
- const [isLoadingDetail, setIsLoadingDetail] = useState9(false);
3632
- const [hasMore, setHasMore] = useState9(
3680
+ const [detail, setDetail] = useState10(null);
3681
+ const [isLoading, setIsLoading] = useState10(false);
3682
+ const [isLoadingDetail, setIsLoadingDetail] = useState10(false);
3683
+ const [hasMore, setHasMore] = useState10(
3633
3684
  () => readCache(cache, listKey(tabId, lang))?.hasMore ?? false
3634
3685
  );
3635
- const [total, setTotal] = useState9(
3686
+ const [total, setTotal] = useState10(
3636
3687
  () => readCache(cache, listKey(tabId, lang))?.total ?? 0
3637
3688
  );
3638
- const [page, setPage] = useState9(
3689
+ const [page, setPage] = useState10(
3639
3690
  () => readCache(cache, listKey(tabId, lang))?.page ?? 1
3640
3691
  );
3641
- const fetchEntries = useCallback9(
3692
+ const fetchEntries = useCallback10(
3642
3693
  async (opts) => {
3643
3694
  if (!tab) return;
3644
3695
  const p = opts?.page ?? 1;
@@ -3653,18 +3704,16 @@ function useContentTab(tabId) {
3653
3704
  language: getLocale()
3654
3705
  });
3655
3706
  if (result.items) {
3656
- setEntries((prev) => {
3657
- const nextItems = reset ? result.items : [...prev, ...result.items];
3658
- if (!opts?.search) {
3659
- store.getState().setContentCache(listKey(tabId, getLocale()), {
3660
- items: nextItems,
3661
- total: result.total,
3662
- hasMore: result.hasMore,
3663
- page: p
3664
- });
3665
- }
3666
- return nextItems;
3667
- });
3707
+ const nextItems = reset ? result.items : [...entriesRef.current, ...result.items];
3708
+ setEntries(nextItems);
3709
+ if (!opts?.search) {
3710
+ store.getState().setContentCache(listKey(tabId, getLocale()), {
3711
+ items: nextItems,
3712
+ total: result.total,
3713
+ hasMore: result.hasMore,
3714
+ page: p
3715
+ });
3716
+ }
3668
3717
  setHasMore(result.hasMore);
3669
3718
  setTotal(result.total);
3670
3719
  setPage(p);
@@ -3675,13 +3724,13 @@ function useContentTab(tabId) {
3675
3724
  setIsLoading(false);
3676
3725
  }
3677
3726
  },
3678
- [client, tabId, tab, store]
3727
+ [client, tabId, tab, store, setEntries, entriesRef]
3679
3728
  );
3680
- const loadMore = useCallback9(() => {
3729
+ const loadMore = useCallback10(() => {
3681
3730
  if (!hasMore || isLoading) return;
3682
3731
  fetchEntries({ page: page + 1 });
3683
3732
  }, [fetchEntries, hasMore, isLoading, page]);
3684
- const fetchDetail = useCallback9(
3733
+ const fetchDetail = useCallback10(
3685
3734
  async (slug) => {
3686
3735
  if (!tab) return;
3687
3736
  const cached = readCache(
@@ -3702,10 +3751,7 @@ function useContentTab(tabId) {
3702
3751
  if (result.entry) {
3703
3752
  const entry = result.entry;
3704
3753
  setDetail(entry);
3705
- store.getState().setContentCache(
3706
- detailKey(tabId, getLocale(), slug),
3707
- entry
3708
- );
3754
+ store.getState().setContentCache(detailKey(tabId, getLocale(), slug), entry);
3709
3755
  }
3710
3756
  } catch (err) {
3711
3757
  console.error("[useContentTab] detail error:", err);
@@ -3715,10 +3761,10 @@ function useContentTab(tabId) {
3715
3761
  },
3716
3762
  [client, tabId, tab, store]
3717
3763
  );
3718
- const clearDetail = useCallback9(() => {
3764
+ const clearDetail = useCallback10(() => {
3719
3765
  setDetail(null);
3720
3766
  }, []);
3721
- useEffect7(() => {
3767
+ useEffect8(() => {
3722
3768
  if (tab && entries.length === 0) {
3723
3769
  fetchEntries({ page: 1, reset: true });
3724
3770
  }
@@ -3739,7 +3785,7 @@ function useContentTab(tabId) {
3739
3785
  }
3740
3786
 
3741
3787
  // src/themed/content/simple-markdown.tsx
3742
- import { useEffect as useEffect8, useRef as useRef8 } from "react";
3788
+ import { useEffect as useEffect9, useRef as useRef10 } from "react";
3743
3789
  import { jsx as jsx6 } from "react/jsx-runtime";
3744
3790
  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>`;
3745
3791
  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>`;
@@ -3854,9 +3900,9 @@ function MarkdownContent({
3854
3900
  bodyMarkdown,
3855
3901
  className
3856
3902
  }) {
3857
- const rootRef = useRef8(null);
3903
+ const rootRef = useRef10(null);
3858
3904
  const html = bodyHtml ?? (bodyMarkdown ? renderMarkdown(bodyMarkdown) : "");
3859
- useEffect8(() => {
3905
+ useEffect9(() => {
3860
3906
  const root = rootRef.current;
3861
3907
  if (!root) return;
3862
3908
  const isWhitespaceOnly = (el) => {
@@ -3875,7 +3921,7 @@ function MarkdownContent({
3875
3921
  };
3876
3922
  removeEmpties();
3877
3923
  }, [html]);
3878
- useEffect8(() => {
3924
+ useEffect9(() => {
3879
3925
  const root = rootRef.current;
3880
3926
  if (!root) return;
3881
3927
  const handler = (e) => {
@@ -4005,7 +4051,7 @@ function SkeletonSection({
4005
4051
  }
4006
4052
 
4007
4053
  // src/themed/content/content-list-view.tsx
4008
- import { useCallback as useCallback10, useRef as useRef9, useState as useState10 } from "react";
4054
+ import { useCallback as useCallback11, useRef as useRef11, useState as useState11 } from "react";
4009
4055
  import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
4010
4056
  function ContentListView({
4011
4057
  entries,
@@ -4017,9 +4063,9 @@ function ContentListView({
4017
4063
  searchPlaceholder,
4018
4064
  display
4019
4065
  }) {
4020
- const [searchText, setSearchText] = useState10("");
4021
- const debounceRef = useRef9(void 0);
4022
- const handleSearch = useCallback10(
4066
+ const [searchText, setSearchText] = useState11("");
4067
+ const debounceRef = useRef11(void 0);
4068
+ const handleSearch = useCallback11(
4023
4069
  (value) => {
4024
4070
  setSearchText(value);
4025
4071
  if (!onSearch) return;
@@ -4099,10 +4145,10 @@ function ContentEntryCard({
4099
4145
  }
4100
4146
 
4101
4147
  // src/themed/content/grouped-content-tab-view.tsx
4102
- import { useEffect as useEffect9, useRef as useRef11 } from "react";
4148
+ import { useEffect as useEffect10, useRef as useRef13 } from "react";
4103
4149
 
4104
4150
  // src/hooks/use-grouped-content-tab.ts
4105
- import { useCallback as useCallback11, useRef as useRef10, useState as useState11 } from "react";
4151
+ import { useCallback as useCallback12, useRef as useRef12, useState as useState12 } from "react";
4106
4152
  var EMPTY_TABS3 = [];
4107
4153
  function categoriesKey(tabId, lang) {
4108
4154
  return `grouped:${tabId}:${lang}:categories`;
@@ -4126,17 +4172,17 @@ function useGroupedContentTab(tabId) {
4126
4172
  const lang = getLocale();
4127
4173
  const cache = store.getState().contentCache;
4128
4174
  const cachedCategories = readCache2(cache, categoriesKey(tabId, lang));
4129
- const [categories, setCategories] = useState11(cachedCategories ?? []);
4130
- const [isCategoriesLoading, setIsCategoriesLoading] = useState11(false);
4131
- const [items, setItems] = useState11([]);
4132
- const [isItemsLoading, setIsItemsLoading] = useState11(false);
4133
- const [itemsHasMore, setItemsHasMore] = useState11(false);
4134
- const itemsPageRef = useRef10(1);
4135
- const [detail, setDetail] = useState11(null);
4136
- const [isLoadingDetail, setIsLoadingDetail] = useState11(false);
4137
- const [activeCategory, setActiveCategory] = useState11(null);
4138
- const allCategoriesRef = useRef10(cachedCategories ?? []);
4139
- const fetchCategories = useCallback11(async () => {
4175
+ const [categories, setCategories] = useState12(cachedCategories ?? []);
4176
+ const [isCategoriesLoading, setIsCategoriesLoading] = useState12(false);
4177
+ const [items, setItems, itemsRef] = useMirroredState([]);
4178
+ const [isItemsLoading, setIsItemsLoading] = useState12(false);
4179
+ const [itemsHasMore, setItemsHasMore] = useState12(false);
4180
+ const itemsPageRef = useRef12(1);
4181
+ const [detail, setDetail] = useState12(null);
4182
+ const [isLoadingDetail, setIsLoadingDetail] = useState12(false);
4183
+ const [activeCategory, setActiveCategory] = useState12(null);
4184
+ const allCategoriesRef = useRef12(cachedCategories ?? []);
4185
+ const fetchCategories = useCallback12(async () => {
4140
4186
  if (!tab) return;
4141
4187
  setIsCategoriesLoading(true);
4142
4188
  try {
@@ -4157,12 +4203,12 @@ function useGroupedContentTab(tabId) {
4157
4203
  setIsCategoriesLoading(false);
4158
4204
  }
4159
4205
  }, [client, tabId, tab, store]);
4160
- const initFetch = useCallback11(() => {
4206
+ const initFetch = useCallback12(() => {
4161
4207
  if (tab && categories.length === 0) {
4162
4208
  fetchCategories();
4163
4209
  }
4164
4210
  }, [fetchCategories, tab, categories.length]);
4165
- const fetchItems = useCallback11(
4211
+ const fetchItems = useCallback12(
4166
4212
  async (opts) => {
4167
4213
  if (!tab?.itemsModelSlug) return;
4168
4214
  const p = opts?.page ?? 1;
@@ -4179,16 +4225,15 @@ function useGroupedContentTab(tabId) {
4179
4225
  language: getLocale()
4180
4226
  });
4181
4227
  if (result.items) {
4182
- setItems((prev) => {
4183
- const nextItems = reset ? result.items : [...prev, ...result.items];
4184
- if (!opts?.search && opts?.groupSlug) {
4185
- store.getState().setContentCache(
4186
- itemsKey(tabId, getLocale(), opts.groupSlug),
4187
- { items: nextItems, hasMore: result.hasMore, page: p }
4188
- );
4189
- }
4190
- return nextItems;
4191
- });
4228
+ const nextItems = reset ? result.items : [...itemsRef.current, ...result.items];
4229
+ setItems(nextItems);
4230
+ if (!opts?.search && opts?.groupSlug) {
4231
+ store.getState().setContentCache(itemsKey(tabId, getLocale(), opts.groupSlug), {
4232
+ items: nextItems,
4233
+ hasMore: result.hasMore,
4234
+ page: p
4235
+ });
4236
+ }
4192
4237
  setItemsHasMore(result.hasMore);
4193
4238
  itemsPageRef.current = p;
4194
4239
  }
@@ -4198,9 +4243,9 @@ function useGroupedContentTab(tabId) {
4198
4243
  setIsItemsLoading(false);
4199
4244
  }
4200
4245
  },
4201
- [client, tabId, tab, store]
4246
+ [client, tabId, tab, store, setItems, itemsRef]
4202
4247
  );
4203
- const selectCategory = useCallback11(
4248
+ const selectCategory = useCallback12(
4204
4249
  (category) => {
4205
4250
  setActiveCategory(category);
4206
4251
  setDetail(null);
@@ -4217,16 +4262,16 @@ function useGroupedContentTab(tabId) {
4217
4262
  setItems([]);
4218
4263
  fetchItems({ page: 1, reset: true, groupSlug: category.slug });
4219
4264
  },
4220
- [fetchItems, store, tabId]
4265
+ [fetchItems, store, tabId, setItems]
4221
4266
  );
4222
- const loadMoreItems = useCallback11(() => {
4267
+ const loadMoreItems = useCallback12(() => {
4223
4268
  if (!itemsHasMore || isItemsLoading || !activeCategory) return;
4224
4269
  fetchItems({
4225
4270
  page: itemsPageRef.current + 1,
4226
4271
  groupSlug: activeCategory.slug
4227
4272
  });
4228
4273
  }, [fetchItems, itemsHasMore, isItemsLoading, activeCategory]);
4229
- const searchItems = useCallback11(
4274
+ const searchItems = useCallback12(
4230
4275
  (query) => {
4231
4276
  setItems([]);
4232
4277
  fetchItems({
@@ -4236,9 +4281,9 @@ function useGroupedContentTab(tabId) {
4236
4281
  groupSlug: query ? void 0 : activeCategory?.slug
4237
4282
  });
4238
4283
  },
4239
- [fetchItems, activeCategory]
4284
+ [fetchItems, activeCategory, setItems]
4240
4285
  );
4241
- const fetchDetail = useCallback11(
4286
+ const fetchDetail = useCallback12(
4242
4287
  async (slug) => {
4243
4288
  if (!tab?.itemsModelSlug) return;
4244
4289
  const cached = readCache2(
@@ -4260,10 +4305,7 @@ function useGroupedContentTab(tabId) {
4260
4305
  if (result.entry) {
4261
4306
  const entry = result.entry;
4262
4307
  setDetail(entry);
4263
- store.getState().setContentCache(
4264
- detailKey2(tabId, getLocale(), slug),
4265
- entry
4266
- );
4308
+ store.getState().setContentCache(detailKey2(tabId, getLocale(), slug), entry);
4267
4309
  }
4268
4310
  } catch (err) {
4269
4311
  console.error("[useGroupedContentTab] detail error:", err);
@@ -4273,29 +4315,26 @@ function useGroupedContentTab(tabId) {
4273
4315
  },
4274
4316
  [client, tabId, tab, store]
4275
4317
  );
4276
- const searchCategories = useCallback11(
4277
- (query) => {
4278
- if (!query.trim()) {
4279
- setCategories(allCategoriesRef.current);
4280
- return;
4281
- }
4282
- const q = query.toLowerCase();
4283
- setCategories(
4284
- allCategoriesRef.current.filter(
4285
- (cat) => cat.title.toLowerCase().includes(q) || (cat.customFields.description ?? "").toLowerCase().includes(q)
4286
- )
4287
- );
4288
- },
4289
- []
4290
- );
4291
- const clearDetail = useCallback11(() => {
4318
+ const searchCategories = useCallback12((query) => {
4319
+ if (!query.trim()) {
4320
+ setCategories(allCategoriesRef.current);
4321
+ return;
4322
+ }
4323
+ const q = query.toLowerCase();
4324
+ setCategories(
4325
+ allCategoriesRef.current.filter(
4326
+ (cat) => cat.title.toLowerCase().includes(q) || (cat.customFields.description ?? "").toLowerCase().includes(q)
4327
+ )
4328
+ );
4329
+ }, []);
4330
+ const clearDetail = useCallback12(() => {
4292
4331
  setDetail(null);
4293
4332
  }, []);
4294
- const clearCategory = useCallback11(() => {
4333
+ const clearCategory = useCallback12(() => {
4295
4334
  setActiveCategory(null);
4296
4335
  setItems([]);
4297
4336
  setDetail(null);
4298
- }, []);
4337
+ }, [setItems]);
4299
4338
  return {
4300
4339
  tab,
4301
4340
  categories,
@@ -4343,16 +4382,16 @@ function GroupedContentTabView({
4343
4382
  fetchDetail,
4344
4383
  clearCategory
4345
4384
  } = useGroupedContentTab(tab.id);
4346
- useEffect9(() => {
4385
+ useEffect10(() => {
4347
4386
  initFetch();
4348
4387
  }, [initFetch]);
4349
- useEffect9(() => {
4388
+ useEffect10(() => {
4350
4389
  if (detailSlug && subView === "content-detail") {
4351
4390
  fetchDetail(detailSlug);
4352
4391
  }
4353
4392
  }, [detailSlug, subView, fetchDetail]);
4354
- const prevSubView = useRef11(subView);
4355
- useEffect9(() => {
4393
+ const prevSubView = useRef13(subView);
4394
+ useEffect10(() => {
4356
4395
  if (prevSubView.current === "content-category" && subView === null) {
4357
4396
  clearCategory();
4358
4397
  }
@@ -4446,10 +4485,10 @@ function FlatContentTabView({
4446
4485
  loadMore,
4447
4486
  fetchDetail
4448
4487
  } = useContentTab(tab.id);
4449
- useEffect10(() => {
4488
+ useEffect11(() => {
4450
4489
  if (detailSlug) fetchDetail(detailSlug);
4451
4490
  }, [detailSlug, fetchDetail]);
4452
- const handleSearch = useCallback12(
4491
+ const handleSearch = useCallback13(
4453
4492
  (query) => {
4454
4493
  fetchEntries({ page: 1, search: query || void 0, reset: true });
4455
4494
  },
@@ -4489,7 +4528,7 @@ function ContentTabIconComponent({ icon }) {
4489
4528
  }
4490
4529
 
4491
4530
  // src/themed/debug-overlay.tsx
4492
- import { useEffect as useEffect11, useMemo as useMemo2, useRef as useRef12, useState as useState12 } from "react";
4531
+ import { useEffect as useEffect12, useMemo as useMemo2, useRef as useRef14, useState as useState13 } from "react";
4493
4532
  import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
4494
4533
  var MAX_EVENTS = 60;
4495
4534
  function isDebugEnabled() {
@@ -4507,16 +4546,16 @@ function senderOf(item) {
4507
4546
  return item.type;
4508
4547
  }
4509
4548
  function WidgetDebugOverlay() {
4510
- const [enabled, setEnabled] = useState12(false);
4511
- const [open, setOpen] = useState12(true);
4512
- const [events, setEvents] = useState12([]);
4513
- const eventsRef = useRef12([]);
4549
+ const [enabled, setEnabled] = useState13(false);
4550
+ const [open, setOpen] = useState13(true);
4551
+ const [events, setEvents] = useState13([]);
4552
+ const eventsRef = useRef14([]);
4514
4553
  const activeId = useWidgetStore((s) => s.activeConversationId);
4515
4554
  const messagesMap = useWidgetStore((s) => s.messages);
4516
4555
  const typingUsers = useWidgetStore((s) => s.typingUsers);
4517
4556
  const aiProcessingMap = useWidgetStore((s) => s.aiProcessing);
4518
4557
  const { store } = useWidgetContext();
4519
- useEffect11(() => {
4558
+ useEffect12(() => {
4520
4559
  setEnabled(isDebugEnabled());
4521
4560
  }, []);
4522
4561
  const pushEvent = useMemo2(
@@ -4531,7 +4570,7 @@ function WidgetDebugOverlay() {
4531
4570
  },
4532
4571
  []
4533
4572
  );
4534
- useEffect11(() => {
4573
+ useEffect12(() => {
4535
4574
  if (!enabled) return;
4536
4575
  if (typeof window === "undefined" || typeof window.fetch !== "function") return;
4537
4576
  const originalFetch = window.fetch.bind(window);
@@ -4563,7 +4602,7 @@ function WidgetDebugOverlay() {
4563
4602
  window.fetch = originalFetch;
4564
4603
  };
4565
4604
  }, [enabled, pushEvent]);
4566
- useEffect11(() => {
4605
+ useEffect12(() => {
4567
4606
  if (!enabled) return;
4568
4607
  const original = store.getState().handleRealtimeEvent;
4569
4608
  store.setState({
@@ -4581,8 +4620,8 @@ function WidgetDebugOverlay() {
4581
4620
  () => activeMessages.map((m) => `${m.id}:${senderOf(m)}:${m.createdAt}`).join("|"),
4582
4621
  [activeMessages]
4583
4622
  );
4584
- const prevSigRef = useRef12(lastMsgSignature);
4585
- useEffect11(() => {
4623
+ const prevSigRef = useRef14(lastMsgSignature);
4624
+ useEffect12(() => {
4586
4625
  if (!enabled) return;
4587
4626
  if (prevSigRef.current !== lastMsgSignature) {
4588
4627
  prevSigRef.current = lastMsgSignature;
@@ -4734,10 +4773,32 @@ var styles = {
4734
4773
  empty: { color: "#52525b", fontStyle: "italic", fontSize: 10 }
4735
4774
  };
4736
4775
 
4776
+ // src/themed/icons-local.tsx
4777
+ import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
4778
+ function DotsIcon({ size = 24, ...props }) {
4779
+ return /* @__PURE__ */ jsxs8(
4780
+ "svg",
4781
+ {
4782
+ width: size,
4783
+ height: size,
4784
+ viewBox: "0 0 24 24",
4785
+ fill: "none",
4786
+ xmlns: "http://www.w3.org/2000/svg",
4787
+ "aria-hidden": "true",
4788
+ ...props,
4789
+ children: [
4790
+ /* @__PURE__ */ jsx13("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
4791
+ /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
4792
+ /* @__PURE__ */ jsx13("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
4793
+ ]
4794
+ }
4795
+ );
4796
+ }
4797
+
4737
4798
  // src/themed/message-bubble.tsx
4738
- import { useEffect as useEffect12, useLayoutEffect, useRef as useRef13, useState as useState13 } from "react";
4799
+ import { useEffect as useEffect13, useLayoutEffect, useRef as useRef15, useState as useState14 } from "react";
4739
4800
  import { createPortal } from "react-dom";
4740
- import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
4801
+ import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
4741
4802
  function MessageBubble({
4742
4803
  text,
4743
4804
  sender,
@@ -4750,7 +4811,7 @@ function MessageBubble({
4750
4811
  streaming
4751
4812
  }) {
4752
4813
  const senderClass = `hw-msg--${sender}`;
4753
- const bubbleRef = useRef13(null);
4814
+ const bubbleRef = useRef15(null);
4754
4815
  const imageParts = parts?.filter((p) => p.type === "image") ?? [];
4755
4816
  const fileParts = parts?.filter((p) => p.type === "file") ?? [];
4756
4817
  const linkPreviews = parts?.filter(
@@ -4760,7 +4821,7 @@ function MessageBubble({
4760
4821
  (p) => p.type === "source"
4761
4822
  ) ?? [];
4762
4823
  const hasText = text.length > 0;
4763
- useEffect12(() => {
4824
+ useEffect13(() => {
4764
4825
  const bubble = bubbleRef.current;
4765
4826
  if (!bubble || sender !== "ai" && sender !== "team") return;
4766
4827
  const handleClick = (event) => {
@@ -4771,23 +4832,23 @@ function MessageBubble({
4771
4832
  bubble.removeEventListener("click", handleClick);
4772
4833
  };
4773
4834
  }, [sender]);
4774
- return /* @__PURE__ */ jsx13("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs8("div", { className: "hw-msg-body", children: [
4775
- imageParts.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx13(PreviewableThumbnail, { src: img.url }, i)) }),
4776
- hasText && /* @__PURE__ */ jsxs8("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
4777
- sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx13(
4835
+ return /* @__PURE__ */ jsx14("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs9("div", { className: "hw-msg-body", children: [
4836
+ imageParts.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx14(PreviewableThumbnail, { src: img.url }, i)) }),
4837
+ hasText && /* @__PURE__ */ jsxs9("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
4838
+ sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx14(
4778
4839
  "span",
4779
4840
  {
4780
4841
  dangerouslySetInnerHTML: {
4781
4842
  __html: renderMarkdown(streaming ? closeDanglingMarkdown(text) : text)
4782
4843
  }
4783
4844
  }
4784
- ) : /* @__PURE__ */ jsx13("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
4785
- streaming && /* @__PURE__ */ jsx13("span", { className: "hw-streaming-cursor" })
4845
+ ) : /* @__PURE__ */ jsx14("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
4846
+ streaming && /* @__PURE__ */ jsx14("span", { className: "hw-streaming-cursor" })
4786
4847
  ] }),
4787
- fileParts.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx13(FileCard, { file }, i)) }),
4788
- linkPreviews.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx13(LinkPreviewCard, { preview: lp }, i)) }),
4789
- sources.length > 0 && /* @__PURE__ */ jsx13("div", { className: "hw-sources", children: sources.map(
4790
- (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs8(
4848
+ fileParts.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx14(FileCard, { file }, i)) }),
4849
+ linkPreviews.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx14(LinkPreviewCard, { preview: lp }, i)) }),
4850
+ sources.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-sources", children: sources.map(
4851
+ (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs9(
4791
4852
  "a",
4792
4853
  {
4793
4854
  href: src.sourceUrl,
@@ -4796,26 +4857,26 @@ function MessageBubble({
4796
4857
  className: "hw-source",
4797
4858
  onClick: (e) => e.stopPropagation(),
4798
4859
  children: [
4799
- /* @__PURE__ */ jsx13("span", { className: "hw-source-n", children: i + 1 }),
4800
- /* @__PURE__ */ jsx13("span", { className: "hw-source-title", children: src.title })
4860
+ /* @__PURE__ */ jsx14("span", { className: "hw-source-n", children: i + 1 }),
4861
+ /* @__PURE__ */ jsx14("span", { className: "hw-source-title", children: src.title })
4801
4862
  ]
4802
4863
  },
4803
4864
  src.knowledgeId
4804
- ) : /* @__PURE__ */ jsxs8("div", { className: "hw-source", children: [
4805
- /* @__PURE__ */ jsx13("span", { className: "hw-source-n", children: i + 1 }),
4806
- /* @__PURE__ */ jsx13("span", { className: "hw-source-title", children: src.title })
4865
+ ) : /* @__PURE__ */ jsxs9("div", { className: "hw-source", children: [
4866
+ /* @__PURE__ */ jsx14("span", { className: "hw-source-n", children: i + 1 }),
4867
+ /* @__PURE__ */ jsx14("span", { className: "hw-source-title", children: src.title })
4807
4868
  ] }, src.knowledgeId)
4808
4869
  ) }),
4809
- metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx13(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
4870
+ metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx14(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
4810
4871
  (() => {
4811
4872
  const isVisitor = sender === "visitor";
4812
4873
  const lead = isVisitor ? null : senderName ?? null;
4813
4874
  const withLead = (showAuthor ?? !!timestamp) && !!lead;
4814
4875
  if (!withLead && !timestamp) return null;
4815
- return /* @__PURE__ */ jsxs8("div", { className: "hw-msg-meta", children: [
4816
- withLead && /* @__PURE__ */ jsx13("span", { className: "hw-msg-author", children: lead }),
4817
- withLead && timestamp && /* @__PURE__ */ jsx13("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
4818
- timestamp && /* @__PURE__ */ jsx13("span", { className: "hw-msg-time", children: timestamp })
4876
+ return /* @__PURE__ */ jsxs9("div", { className: "hw-msg-meta", children: [
4877
+ withLead && /* @__PURE__ */ jsx14("span", { className: "hw-msg-author", children: lead }),
4878
+ withLead && timestamp && /* @__PURE__ */ jsx14("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
4879
+ timestamp && /* @__PURE__ */ jsx14("span", { className: "hw-msg-time", children: timestamp })
4819
4880
  ] });
4820
4881
  })()
4821
4882
  ] }) });
@@ -4824,21 +4885,21 @@ function QuickReplyButtons({
4824
4885
  metadata,
4825
4886
  onTap
4826
4887
  }) {
4827
- const [tappedId, setTappedId] = useState13(null);
4888
+ const [tappedId, setTappedId] = useState14(null);
4828
4889
  const isLocked = metadata.cancelled || tappedId !== null;
4829
4890
  const handleTap = (optionId) => {
4830
4891
  if (isLocked) return;
4831
4892
  setTappedId(optionId);
4832
4893
  onTap?.(optionId, metadata.stepId);
4833
4894
  };
4834
- return /* @__PURE__ */ jsx13(
4895
+ return /* @__PURE__ */ jsx14(
4835
4896
  "div",
4836
4897
  {
4837
4898
  className: "hw-quick-replies",
4838
4899
  "data-cancelled": metadata.cancelled ? "true" : void 0,
4839
4900
  children: metadata.options.map((opt) => {
4840
4901
  const isTapped = tappedId === opt.id;
4841
- return /* @__PURE__ */ jsx13(
4902
+ return /* @__PURE__ */ jsx14(
4842
4903
  "button",
4843
4904
  {
4844
4905
  type: "button",
@@ -4855,10 +4916,10 @@ function QuickReplyButtons({
4855
4916
  );
4856
4917
  }
4857
4918
  function PreviewableThumbnail({ src }) {
4858
- const [hover, setHover] = useState13(false);
4859
- const ref = useRef13(null);
4860
- return /* @__PURE__ */ jsxs8(Fragment3, { children: [
4861
- /* @__PURE__ */ jsx13(
4919
+ const [hover, setHover] = useState14(false);
4920
+ const ref = useRef15(null);
4921
+ return /* @__PURE__ */ jsxs9(Fragment3, { children: [
4922
+ /* @__PURE__ */ jsx14(
4862
4923
  "a",
4863
4924
  {
4864
4925
  ref,
@@ -4869,21 +4930,21 @@ function PreviewableThumbnail({ src }) {
4869
4930
  "aria-label": t("widget.aria_open_image"),
4870
4931
  onMouseEnter: () => setHover(true),
4871
4932
  onMouseLeave: () => setHover(false),
4872
- children: /* @__PURE__ */ jsx13("img", { src, alt: "", className: "hw-msg-image", loading: "lazy" })
4933
+ children: /* @__PURE__ */ jsx14("img", { src, alt: "", className: "hw-msg-image", loading: "lazy" })
4873
4934
  }
4874
4935
  ),
4875
- hover && /* @__PURE__ */ jsx13(AnchoredPreview, { src, anchorRef: ref, href: src })
4936
+ hover && /* @__PURE__ */ jsx14(AnchoredPreview, { src, anchorRef: ref, href: src })
4876
4937
  ] });
4877
4938
  }
4878
4939
  var PREVIEWABLE_EXTS = /* @__PURE__ */ new Set(["pdf", "csv", "png", "jpg", "jpeg", "gif", "webp", "svg"]);
4879
4940
  function FileCard({ file }) {
4880
- const [hover, setHover] = useState13(false);
4881
- const ref = useRef13(null);
4941
+ const [hover, setHover] = useState14(false);
4942
+ const ref = useRef15(null);
4882
4943
  const ext = file.fileName.split(".").pop()?.toLowerCase() ?? "";
4883
4944
  const isPreviewable = PREVIEWABLE_EXTS.has(ext);
4884
4945
  const isImage = file.mimeType.startsWith("image/");
4885
- return /* @__PURE__ */ jsxs8(Fragment3, { children: [
4886
- /* @__PURE__ */ jsxs8(
4946
+ return /* @__PURE__ */ jsxs9(Fragment3, { children: [
4947
+ /* @__PURE__ */ jsxs9(
4887
4948
  "a",
4888
4949
  {
4889
4950
  ref,
@@ -4894,15 +4955,15 @@ function FileCard({ file }) {
4894
4955
  onMouseEnter: () => isPreviewable && setHover(true),
4895
4956
  onMouseLeave: () => setHover(false),
4896
4957
  children: [
4897
- /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx13(FileTypeIcon, { ext }) }),
4898
- /* @__PURE__ */ jsxs8("span", { className: "hw-msg-file-info", children: [
4899
- /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-name", children: file.fileName }),
4900
- /* @__PURE__ */ jsx13("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
4958
+ /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx14(FileTypeIcon, { ext }) }),
4959
+ /* @__PURE__ */ jsxs9("span", { className: "hw-msg-file-info", children: [
4960
+ /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-name", children: file.fileName }),
4961
+ /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
4901
4962
  ] })
4902
4963
  ]
4903
4964
  }
4904
4965
  ),
4905
- 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 }))
4966
+ hover && isPreviewable && (isImage ? /* @__PURE__ */ jsx14(AnchoredPreview, { src: file.url, anchorRef: ref, href: file.url }) : /* @__PURE__ */ jsx14(AnchoredDocPreview, { fileName: file.fileName, ext, anchorRef: ref, href: file.url }))
4906
4967
  ] });
4907
4968
  }
4908
4969
  function AnchoredPreview({
@@ -4911,8 +4972,8 @@ function AnchoredPreview({
4911
4972
  href,
4912
4973
  onOpen
4913
4974
  }) {
4914
- const [style, setStyle] = useState13({ opacity: 0 });
4915
- const [portalTarget, setPortalTarget] = useState13(null);
4975
+ const [style, setStyle] = useState14({ opacity: 0 });
4976
+ const [portalTarget, setPortalTarget] = useState14(null);
4916
4977
  useLayoutEffect(() => {
4917
4978
  const anchor = anchorRef.current;
4918
4979
  if (!anchor) return;
@@ -4936,7 +4997,7 @@ function AnchoredPreview({
4936
4997
  };
4937
4998
  if (!portalTarget) return null;
4938
4999
  return createPortal(
4939
- /* @__PURE__ */ jsx13("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx13("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
5000
+ /* @__PURE__ */ jsx14("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx14("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
4940
5001
  portalTarget
4941
5002
  );
4942
5003
  }
@@ -4946,8 +5007,8 @@ function AnchoredDocPreview({
4946
5007
  anchorRef,
4947
5008
  href
4948
5009
  }) {
4949
- const [style, setStyle] = useState13({ opacity: 0 });
4950
- const [portalTarget, setPortalTarget] = useState13(null);
5010
+ const [style, setStyle] = useState14({ opacity: 0 });
5011
+ const [portalTarget, setPortalTarget] = useState14(null);
4951
5012
  useLayoutEffect(() => {
4952
5013
  const anchor = anchorRef.current;
4953
5014
  if (!anchor) return;
@@ -4967,17 +5028,17 @@ function AnchoredDocPreview({
4967
5028
  }, [anchorRef]);
4968
5029
  if (!portalTarget) return null;
4969
5030
  return createPortal(
4970
- /* @__PURE__ */ jsxs8(
5031
+ /* @__PURE__ */ jsxs9(
4971
5032
  "div",
4972
5033
  {
4973
5034
  className: "hw-hover-preview hw-hover-preview--doc",
4974
5035
  style,
4975
5036
  onClick: () => window.open(href, "_blank", "noopener,noreferrer"),
4976
5037
  children: [
4977
- /* @__PURE__ */ jsx13("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx13(FileTypeIcon, { ext }) }),
4978
- /* @__PURE__ */ jsxs8("div", { className: "hw-hover-preview-doc-info", children: [
4979
- /* @__PURE__ */ jsx13("span", { className: "hw-hover-preview-doc-name", children: fileName }),
4980
- /* @__PURE__ */ jsx13("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
5038
+ /* @__PURE__ */ jsx14("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx14(FileTypeIcon, { ext }) }),
5039
+ /* @__PURE__ */ jsxs9("div", { className: "hw-hover-preview-doc-info", children: [
5040
+ /* @__PURE__ */ jsx14("span", { className: "hw-hover-preview-doc-name", children: fileName }),
5041
+ /* @__PURE__ */ jsx14("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
4981
5042
  ] })
4982
5043
  ]
4983
5044
  }
@@ -5002,7 +5063,7 @@ var FILE_TYPE_COLORS = {
5002
5063
  };
5003
5064
  function FileTypeIcon({ ext }) {
5004
5065
  const color = FILE_TYPE_COLORS[ext] ?? "currentColor";
5005
- return /* @__PURE__ */ jsxs8(
5066
+ return /* @__PURE__ */ jsxs9(
5006
5067
  "svg",
5007
5068
  {
5008
5069
  viewBox: "0 0 24 24",
@@ -5012,10 +5073,10 @@ function FileTypeIcon({ ext }) {
5012
5073
  strokeLinecap: "round",
5013
5074
  strokeLinejoin: "round",
5014
5075
  children: [
5015
- /* @__PURE__ */ jsx13("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
5016
- /* @__PURE__ */ jsx13("polyline", { points: "14 2 14 8 20 8" }),
5017
- ext === "pdf" && /* @__PURE__ */ jsx13("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
5018
- ext === "csv" && /* @__PURE__ */ jsx13("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
5076
+ /* @__PURE__ */ jsx14("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
5077
+ /* @__PURE__ */ jsx14("polyline", { points: "14 2 14 8 20 8" }),
5078
+ ext === "pdf" && /* @__PURE__ */ jsx14("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
5079
+ ext === "csv" && /* @__PURE__ */ jsx14("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
5019
5080
  ]
5020
5081
  }
5021
5082
  );
@@ -5028,7 +5089,7 @@ function LinkPreviewCard({ preview }) {
5028
5089
  return preview.url;
5029
5090
  }
5030
5091
  })();
5031
- return /* @__PURE__ */ jsxs8(
5092
+ return /* @__PURE__ */ jsxs9(
5032
5093
  "a",
5033
5094
  {
5034
5095
  href: preview.url,
@@ -5037,7 +5098,7 @@ function LinkPreviewCard({ preview }) {
5037
5098
  className: "hw-link-preview",
5038
5099
  onClick: (e) => e.stopPropagation(),
5039
5100
  children: [
5040
- preview.imageUrl && /* @__PURE__ */ jsx13(
5101
+ preview.imageUrl && /* @__PURE__ */ jsx14(
5041
5102
  "img",
5042
5103
  {
5043
5104
  src: preview.imageUrl,
@@ -5049,8 +5110,8 @@ function LinkPreviewCard({ preview }) {
5049
5110
  }
5050
5111
  }
5051
5112
  ),
5052
- /* @__PURE__ */ jsxs8("div", { className: "hw-link-preview-body", children: [
5053
- preview.favicon && /* @__PURE__ */ jsx13(
5113
+ /* @__PURE__ */ jsxs9("div", { className: "hw-link-preview-body", children: [
5114
+ preview.favicon && /* @__PURE__ */ jsx14(
5054
5115
  "img",
5055
5116
  {
5056
5117
  src: preview.favicon,
@@ -5063,9 +5124,9 @@ function LinkPreviewCard({ preview }) {
5063
5124
  }
5064
5125
  }
5065
5126
  ),
5066
- preview.title && /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-title", children: preview.title }),
5067
- preview.description && /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-desc", children: preview.description.slice(0, 120) }),
5068
- /* @__PURE__ */ jsx13("div", { className: "hw-link-preview-url", children: hostname })
5127
+ preview.title && /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-title", children: preview.title }),
5128
+ preview.description && /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-desc", children: preview.description.slice(0, 120) }),
5129
+ /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-url", children: hostname })
5069
5130
  ] })
5070
5131
  ]
5071
5132
  }
@@ -5073,8 +5134,8 @@ function LinkPreviewCard({ preview }) {
5073
5134
  }
5074
5135
 
5075
5136
  // src/themed/message-list.tsx
5076
- import React, { useEffect as useEffect13, useRef as useRef14 } from "react";
5077
- import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
5137
+ import React, { useEffect as useEffect14, useRef as useRef16 } from "react";
5138
+ import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
5078
5139
  function parseParts(raw) {
5079
5140
  if (!raw) return null;
5080
5141
  if (Array.isArray(raw)) return raw;
@@ -5108,12 +5169,12 @@ function MessageList({
5108
5169
  onLoadMore,
5109
5170
  renderAfterMessages
5110
5171
  }) {
5111
- const bottomRef = useRef14(null);
5112
- const topRef = useRef14(null);
5113
- const containerRef = useRef14(null);
5114
- const prevItemCountRef = useRef14(items.length);
5115
- const isInitialLoadRef = useRef14(true);
5116
- const hadStreamRef = useRef14(false);
5172
+ const bottomRef = useRef16(null);
5173
+ const topRef = useRef16(null);
5174
+ const containerRef = useRef16(null);
5175
+ const prevItemCountRef = useRef16(items.length);
5176
+ const isInitialLoadRef = useRef16(true);
5177
+ const hadStreamRef = useRef16(false);
5117
5178
  const client = useWidgetClient();
5118
5179
  const activeConversationId = useWidgetStore((s) => s.activeConversationId);
5119
5180
  const handleQuickReplyTap = React.useCallback(
@@ -5125,7 +5186,7 @@ function MessageList({
5125
5186
  },
5126
5187
  [client, activeConversationId]
5127
5188
  );
5128
- useEffect13(() => {
5189
+ useEffect14(() => {
5129
5190
  const prevCount = prevItemCountRef.current;
5130
5191
  const newCount = items.length;
5131
5192
  prevItemCountRef.current = newCount;
@@ -5141,18 +5202,18 @@ function MessageList({
5141
5202
  isInitialLoadRef.current = false;
5142
5203
  }
5143
5204
  }, [items]);
5144
- useEffect13(() => {
5205
+ useEffect14(() => {
5145
5206
  if (streamingText) {
5146
5207
  bottomRef.current?.scrollIntoView({ behavior: "instant" });
5147
5208
  }
5148
5209
  hadStreamRef.current = !!streamingText;
5149
5210
  }, [streamingText]);
5150
- useEffect13(() => {
5211
+ useEffect14(() => {
5151
5212
  if (isTyping || isAiProcessing) {
5152
5213
  bottomRef.current?.scrollIntoView({ behavior: "smooth" });
5153
5214
  }
5154
5215
  }, [isTyping, isAiProcessing]);
5155
- useEffect13(() => {
5216
+ useEffect14(() => {
5156
5217
  if (!hasMore || !onLoadMore || !topRef.current) return;
5157
5218
  const observer = new IntersectionObserver(
5158
5219
  (entries) => {
@@ -5175,16 +5236,16 @@ function MessageList({
5175
5236
  return () => observer.disconnect();
5176
5237
  }, [hasMore, onLoadMore, isLoadingMore]);
5177
5238
  if (items.length === 0) {
5178
- return /* @__PURE__ */ jsx14(
5239
+ return /* @__PURE__ */ jsx15(
5179
5240
  "div",
5180
5241
  {
5181
5242
  className: "hw-messages",
5182
5243
  role: "log",
5183
5244
  "aria-label": t("widget.aria_messages"),
5184
5245
  "aria-live": "polite",
5185
- children: /* @__PURE__ */ jsxs9("div", { className: "hw-empty", children: [
5186
- /* @__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" }) }) }),
5187
- /* @__PURE__ */ jsx14("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
5246
+ children: /* @__PURE__ */ jsxs10("div", { className: "hw-empty", children: [
5247
+ /* @__PURE__ */ jsx15("div", { className: "hw-empty-icon", children: /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ jsx15("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }) }),
5248
+ /* @__PURE__ */ jsx15("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
5188
5249
  ] })
5189
5250
  }
5190
5251
  );
@@ -5194,7 +5255,7 @@ function MessageList({
5194
5255
  const yesterday = /* @__PURE__ */ new Date();
5195
5256
  yesterday.setDate(yesterday.getDate() - 1);
5196
5257
  const yesterdayKey = DATE_KEY_FMT.format(yesterday);
5197
- return /* @__PURE__ */ jsxs9(
5258
+ return /* @__PURE__ */ jsxs10(
5198
5259
  "div",
5199
5260
  {
5200
5261
  ref: containerRef,
@@ -5203,15 +5264,15 @@ function MessageList({
5203
5264
  "aria-label": t("widget.aria_messages"),
5204
5265
  "aria-live": "polite",
5205
5266
  children: [
5206
- /* @__PURE__ */ jsx14("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs9("div", { className: "hw-load-more-spinner", children: [
5207
- /* @__PURE__ */ jsx14("div", {}),
5208
- /* @__PURE__ */ jsx14("div", {}),
5209
- /* @__PURE__ */ jsx14("div", {})
5267
+ /* @__PURE__ */ jsx15("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs10("div", { className: "hw-load-more-spinner", children: [
5268
+ /* @__PURE__ */ jsx15("div", {}),
5269
+ /* @__PURE__ */ jsx15("div", {}),
5270
+ /* @__PURE__ */ jsx15("div", {})
5210
5271
  ] }) }),
5211
5272
  [
5212
5273
  ...items.map((item) => {
5213
5274
  if (item.type === "event") {
5214
- return /* @__PURE__ */ jsx14(
5275
+ return /* @__PURE__ */ jsx15(
5215
5276
  EventCard,
5216
5277
  {
5217
5278
  text: item.text ?? ""
@@ -5226,16 +5287,16 @@ function MessageList({
5226
5287
  const showDateSep = isNewBucket && dateKey !== todayKey;
5227
5288
  const dateLabel = dateKey === yesterdayKey ? t("widget.yesterday") : displayDateFormatter(getLocale()).format(itemDate);
5228
5289
  const sender = item.visitorId ? "visitor" : item.aiAgentId ? "ai" : "team";
5229
- return /* @__PURE__ */ jsxs9(
5290
+ return /* @__PURE__ */ jsxs10(
5230
5291
  React.Fragment,
5231
5292
  {
5232
5293
  children: [
5233
- showDateSep && /* @__PURE__ */ jsxs9("div", { className: "hw-date-sep", children: [
5234
- /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-line" }),
5235
- /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-text", children: dateLabel }),
5236
- /* @__PURE__ */ jsx14("div", { className: "hw-date-sep-line" })
5294
+ showDateSep && /* @__PURE__ */ jsxs10("div", { className: "hw-date-sep", children: [
5295
+ /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-line" }),
5296
+ /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-text", children: dateLabel }),
5297
+ /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-line" })
5237
5298
  ] }),
5238
- /* @__PURE__ */ jsx14(
5299
+ /* @__PURE__ */ jsx15(
5239
5300
  MessageBubble,
5240
5301
  {
5241
5302
  text: item.text ?? "",
@@ -5267,19 +5328,19 @@ function MessageList({
5267
5328
  its place, .hw-msg replayed hw-msg-appear (styles.css:1326), and the
5268
5329
  answer visibly animated in a second time just as it finished. */
5269
5330
  ...streamingText && activeConversationId ? [
5270
- /* @__PURE__ */ jsxs9(React.Fragment, { children: [
5331
+ /* @__PURE__ */ jsxs10(React.Fragment, { children: [
5271
5332
  null,
5272
- /* @__PURE__ */ jsx14(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
5333
+ /* @__PURE__ */ jsx15(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
5273
5334
  ] }, streamingKeyFor(activeConversationId))
5274
5335
  ] : []
5275
5336
  ],
5276
5337
  renderAfterMessages,
5277
- (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx14("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs9("div", { className: "hw-typing-dots", children: [
5278
- /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" }),
5279
- /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" }),
5280
- /* @__PURE__ */ jsx14("div", { className: "hw-typing-dot" })
5338
+ (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx15("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs10("div", { className: "hw-typing-dots", children: [
5339
+ /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" }),
5340
+ /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" }),
5341
+ /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" })
5281
5342
  ] }) }),
5282
- /* @__PURE__ */ jsx14("div", { ref: bottomRef })
5343
+ /* @__PURE__ */ jsx15("div", { ref: bottomRef })
5283
5344
  ]
5284
5345
  }
5285
5346
  );
@@ -5297,8 +5358,8 @@ function EventCard({ text }) {
5297
5358
  const data = parseEventData(text);
5298
5359
  if (data) {
5299
5360
  const message = data.action === "joined" ? t("widget.joined") : t("widget.left");
5300
- return /* @__PURE__ */ jsxs9("div", { className: "hw-event hw-event--card", children: [
5301
- /* @__PURE__ */ jsx14("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx14(
5361
+ return /* @__PURE__ */ jsxs10("div", { className: "hw-event hw-event--card", children: [
5362
+ /* @__PURE__ */ jsx15("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx15(
5302
5363
  "img",
5303
5364
  {
5304
5365
  src: data.image,
@@ -5306,20 +5367,20 @@ function EventCard({ text }) {
5306
5367
  className: "hw-event-avatar-img",
5307
5368
  referrerPolicy: "no-referrer"
5308
5369
  }
5309
- ) : /* @__PURE__ */ jsx14("span", { children: getInitials(data.name) }) }),
5310
- /* @__PURE__ */ jsxs9("div", { className: "hw-event-body", children: [
5311
- /* @__PURE__ */ jsx14("span", { className: "hw-event-name", children: data.name }),
5370
+ ) : /* @__PURE__ */ jsx15("span", { children: getInitials(data.name) }) }),
5371
+ /* @__PURE__ */ jsxs10("div", { className: "hw-event-body", children: [
5372
+ /* @__PURE__ */ jsx15("span", { className: "hw-event-name", children: data.name }),
5312
5373
  " ",
5313
- /* @__PURE__ */ jsx14("span", { className: "hw-event-action", children: message })
5374
+ /* @__PURE__ */ jsx15("span", { className: "hw-event-action", children: message })
5314
5375
  ] })
5315
5376
  ] });
5316
5377
  }
5317
- return /* @__PURE__ */ jsx14("div", { className: "hw-event", children: /* @__PURE__ */ jsx14("div", { className: "hw-event-text", children: text }) });
5378
+ return /* @__PURE__ */ jsx15("div", { className: "hw-event", children: /* @__PURE__ */ jsx15("div", { className: "hw-event-text", children: text }) });
5318
5379
  }
5319
5380
 
5320
5381
  // src/themed/message-preview.tsx
5321
- import { useEffect as useEffect14, useState as useState14 } from "react";
5322
- import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
5382
+ import { useEffect as useEffect15, useState as useState15 } from "react";
5383
+ import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
5323
5384
  function MessagePreview({
5324
5385
  onOpen,
5325
5386
  avatar,
@@ -5334,8 +5395,8 @@ function MessagePreview({
5334
5395
  const client = useWidgetClient();
5335
5396
  const senderName = preview?.senderName || agentName;
5336
5397
  const senderImage = preview?.senderImage || null;
5337
- const [closing, setClosing] = useState14(false);
5338
- useEffect14(() => {
5398
+ const [closing, setClosing] = useState15(false);
5399
+ useEffect15(() => {
5339
5400
  if (!preview || preview.quickReplies) return;
5340
5401
  if (autoDismissMs == null || autoDismissMs <= 0) return;
5341
5402
  const timer = setTimeout(() => {
@@ -5376,7 +5437,7 @@ function MessagePreview({
5376
5437
  );
5377
5438
  const qr = preview.quickReplies && preview.quickReplies.options.length > 0 ? preview.quickReplies : null;
5378
5439
  const placementClass = placement === "anchored" ? "hw-preview--anchored " : "";
5379
- return /* @__PURE__ */ jsxs10(
5440
+ return /* @__PURE__ */ jsxs11(
5380
5441
  "div",
5381
5442
  {
5382
5443
  className: `hw-preview ${placementClass}${closing ? "hw-preview--closing" : ""}`,
@@ -5390,17 +5451,17 @@ function MessagePreview({
5390
5451
  role: "button",
5391
5452
  tabIndex: 0,
5392
5453
  children: [
5393
- /* @__PURE__ */ jsxs10("div", { className: "hw-preview-header", children: [
5394
- /* @__PURE__ */ jsx15("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx15("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
5395
- /* @__PURE__ */ jsx15("div", { className: "hw-preview-name", children: senderName }),
5396
- /* @__PURE__ */ jsx15(
5454
+ /* @__PURE__ */ jsxs11("div", { className: "hw-preview-header", children: [
5455
+ /* @__PURE__ */ jsx16("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx16("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
5456
+ /* @__PURE__ */ jsx16("div", { className: "hw-preview-name", children: senderName }),
5457
+ /* @__PURE__ */ jsx16(
5397
5458
  "button",
5398
5459
  {
5399
5460
  type: "button",
5400
5461
  className: "hw-preview-close",
5401
5462
  onClick: handleClose,
5402
5463
  "aria-label": t("widget.aria_dismiss"),
5403
- children: /* @__PURE__ */ jsx15(XIcon, { size: 20 })
5464
+ children: /* @__PURE__ */ jsx16(XIcon, { size: 20 })
5404
5465
  }
5405
5466
  )
5406
5467
  ] }),
@@ -5409,11 +5470,11 @@ function MessagePreview({
5409
5470
  consecutive messages, so two identical ones would already be a bug
5410
5471
  upstream, and an index key hands React the wrong bubble to reuse the
5411
5472
  moment a new message lands mid-animation. */
5412
- /* @__PURE__ */ jsx15("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
5473
+ /* @__PURE__ */ jsx16("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
5413
5474
  )),
5414
- qr && /* @__PURE__ */ jsxs10(Fragment4, { children: [
5415
- qr.prompt && /* @__PURE__ */ jsx15("div", { className: "hw-preview-body", children: qr.prompt }),
5416
- /* @__PURE__ */ jsx15("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx15(
5475
+ qr && /* @__PURE__ */ jsxs11(Fragment4, { children: [
5476
+ qr.prompt && /* @__PURE__ */ jsx16("div", { className: "hw-preview-body", children: qr.prompt }),
5477
+ /* @__PURE__ */ jsx16("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx16(
5417
5478
  "button",
5418
5479
  {
5419
5480
  type: "button",
@@ -5427,14 +5488,14 @@ function MessagePreview({
5427
5488
  opt.id
5428
5489
  )) })
5429
5490
  ] }),
5430
- footer != null && footer !== false && /* @__PURE__ */ jsx15("div", { className: "hw-preview-footer", children: footer })
5491
+ footer != null && footer !== false && /* @__PURE__ */ jsx16("div", { className: "hw-preview-footer", children: footer })
5431
5492
  ]
5432
5493
  }
5433
5494
  );
5434
5495
  }
5435
5496
 
5436
5497
  // src/themed/default-widget.tsx
5437
- import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
5498
+ import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
5438
5499
  function resolveLabel2(label) {
5439
5500
  if (!label.startsWith("widget.")) return label;
5440
5501
  const resolved = t(label);
@@ -5446,7 +5507,7 @@ var EMPTY_CONTENT_TABS = [];
5446
5507
  var DEFAULT_EN_WELCOME = "Hi there \u{1F44B}\nHow can we help?";
5447
5508
  var DEFAULT_EN_SUBTITLE = "Usually replies in minutes";
5448
5509
  function HelpwayMark({ className }) {
5449
- return /* @__PURE__ */ jsx16(
5510
+ return /* @__PURE__ */ jsx17(
5450
5511
  "svg",
5451
5512
  {
5452
5513
  className,
@@ -5456,7 +5517,7 @@ function HelpwayMark({ className }) {
5456
5517
  fill: "none",
5457
5518
  xmlns: "http://www.w3.org/2000/svg",
5458
5519
  "aria-hidden": "true",
5459
- children: /* @__PURE__ */ jsx16(
5520
+ children: /* @__PURE__ */ jsx17(
5460
5521
  "path",
5461
5522
  {
5462
5523
  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 +5544,7 @@ function WidgetLogo({
5483
5544
  });
5484
5545
  const logoClass = forceAgent ? "hw-agent-img--logo" : "";
5485
5546
  if (!forceAgent && activeId && assignee?.assigneeImage) {
5486
- return /* @__PURE__ */ jsx16(
5547
+ return /* @__PURE__ */ jsx17(
5487
5548
  "img",
5488
5549
  {
5489
5550
  src: assignee.assigneeImage,
@@ -5494,7 +5555,7 @@ function WidgetLogo({
5494
5555
  );
5495
5556
  }
5496
5557
  if (customAvatar) {
5497
- return /* @__PURE__ */ jsx16(
5558
+ return /* @__PURE__ */ jsx17(
5498
5559
  "span",
5499
5560
  {
5500
5561
  className: `hw-agent-icon hw-agent-custom ${className ?? ""}`,
@@ -5504,7 +5565,7 @@ function WidgetLogo({
5504
5565
  );
5505
5566
  }
5506
5567
  if (agentConfig?.avatarUrl) {
5507
- return /* @__PURE__ */ jsx16(
5568
+ return /* @__PURE__ */ jsx17(
5508
5569
  "img",
5509
5570
  {
5510
5571
  src: agentConfig.avatarUrl,
@@ -5514,7 +5575,7 @@ function WidgetLogo({
5514
5575
  );
5515
5576
  }
5516
5577
  if (agentConfig?.avatarPreset) {
5517
- return /* @__PURE__ */ jsx16(
5578
+ return /* @__PURE__ */ jsx17(
5518
5579
  "div",
5519
5580
  {
5520
5581
  className: `hw-agent-icon ${className ?? ""}`,
@@ -5525,20 +5586,20 @@ function WidgetLogo({
5525
5586
  justifyContent: "center",
5526
5587
  borderRadius: 8
5527
5588
  },
5528
- children: /* @__PURE__ */ jsx16(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
5589
+ children: /* @__PURE__ */ jsx17(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
5529
5590
  }
5530
5591
  );
5531
5592
  }
5532
5593
  if (logoUrl) {
5533
- return /* @__PURE__ */ jsx16("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
5594
+ return /* @__PURE__ */ jsx17("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
5534
5595
  }
5535
- return /* @__PURE__ */ jsx16(HelpwayMark, { className });
5596
+ return /* @__PURE__ */ jsx17(HelpwayMark, { className });
5536
5597
  }
5537
5598
  function LauncherIcon({ className }) {
5538
5599
  const agentConfig = useWidgetStore((s) => s.agentConfig);
5539
- const [imgLoaded, setImgLoaded] = useState15(false);
5600
+ const [imgLoaded, setImgLoaded] = useState16(false);
5540
5601
  const imgSrc = agentConfig?.launcherIconUrl ?? null;
5541
- useEffect15(() => {
5602
+ useEffect16(() => {
5542
5603
  if (!imgSrc) return;
5543
5604
  setImgLoaded(false);
5544
5605
  const img = new Image();
@@ -5551,7 +5612,7 @@ function LauncherIcon({ className }) {
5551
5612
  img.onerror = () => setImgLoaded(true);
5552
5613
  }, [imgSrc]);
5553
5614
  if (imgSrc) {
5554
- return /* @__PURE__ */ jsx16(
5615
+ return /* @__PURE__ */ jsx17(
5555
5616
  "img",
5556
5617
  {
5557
5618
  src: imgSrc,
@@ -5561,7 +5622,7 @@ function LauncherIcon({ className }) {
5561
5622
  }
5562
5623
  );
5563
5624
  }
5564
- return /* @__PURE__ */ jsx16(WidgetLogo, { className, forceAgent: true });
5625
+ return /* @__PURE__ */ jsx17(WidgetLogo, { className, forceAgent: true });
5565
5626
  }
5566
5627
  var PRESET_SVG = {
5567
5628
  // Helpway brand mark — octagonal chamfer with stylized "W" inside.
@@ -5620,7 +5681,7 @@ function AgentPresetIcon({ presetId }) {
5620
5681
  const svgContent = PRESET_SVG[presetId] ?? PRESET_SVG.sparkle;
5621
5682
  return (
5622
5683
  // biome-ignore lint: trusted static SVG content from our icon library
5623
- /* @__PURE__ */ jsx16(
5684
+ /* @__PURE__ */ jsx17(
5624
5685
  "svg",
5625
5686
  {
5626
5687
  viewBox: "0 0 24 24",
@@ -5633,8 +5694,8 @@ function AgentPresetIcon({ presetId }) {
5633
5694
  );
5634
5695
  }
5635
5696
  function CloseGlyph({ docked }) {
5636
- if (!docked) return /* @__PURE__ */ jsx16(XIcon, { size: 20 });
5637
- return /* @__PURE__ */ jsx16(
5697
+ if (!docked) return /* @__PURE__ */ jsx17(XIcon, { size: 20 });
5698
+ return /* @__PURE__ */ jsx17(
5638
5699
  "svg",
5639
5700
  {
5640
5701
  width: "20",
@@ -5646,7 +5707,7 @@ function CloseGlyph({ docked }) {
5646
5707
  strokeLinecap: "round",
5647
5708
  strokeLinejoin: "round",
5648
5709
  "aria-hidden": "true",
5649
- children: /* @__PURE__ */ jsx16("path", { d: "M6 9.5 12 15.5 18 9.5" })
5710
+ children: /* @__PURE__ */ jsx17("path", { d: "M6 9.5 12 15.5 18 9.5" })
5650
5711
  }
5651
5712
  );
5652
5713
  }
@@ -5678,22 +5739,22 @@ function DefaultWidget({
5678
5739
  });
5679
5740
  }
5680
5741
  const storeIsOpen = useWidgetStore((s) => s.isOpen);
5681
- const [isClosing, setIsClosing] = useState15(false);
5742
+ const [isClosing, setIsClosing] = useState16(false);
5682
5743
  const isOpen = storeIsOpen || isClosing;
5683
- const [activeTab, setActiveTab] = useState15("home");
5684
- const [subView, setSubView] = useState15(null);
5685
- const [newText, setNewText] = useState15("");
5686
- const [contentDetailSlug, setContentDetailSlug] = useState15(null);
5687
- const [contentCategoryName, setContentCategoryName] = useState15(null);
5688
- const prevActiveIdRef = useRef15(activeId);
5689
- useEffect15(() => {
5744
+ const [activeTab, setActiveTab] = useState16("home");
5745
+ const [subView, setSubView] = useState16(null);
5746
+ const [newText, setNewText] = useState16("");
5747
+ const [contentDetailSlug, setContentDetailSlug] = useState16(null);
5748
+ const [contentCategoryName, setContentCategoryName] = useState16(null);
5749
+ const prevActiveIdRef = useRef17(activeId);
5750
+ useEffect16(() => {
5690
5751
  if (activeId && activeId !== prevActiveIdRef.current && subView !== "conversation") {
5691
5752
  setSubView("conversation");
5692
5753
  }
5693
5754
  prevActiveIdRef.current = activeId;
5694
5755
  }, [activeId, subView]);
5695
5756
  const prefill = useWidgetStore((s) => s.newConversationPrefill);
5696
- useEffect15(() => {
5757
+ useEffect16(() => {
5697
5758
  if (prefill !== null) {
5698
5759
  if (prefill.length > 0) setNewText(prefill);
5699
5760
  setSubView("new");
@@ -5701,18 +5762,18 @@ function DefaultWidget({
5701
5762
  store.getState().setNewConversationPrefill(null);
5702
5763
  }
5703
5764
  }, [prefill, store]);
5704
- const closeTimerRef = useRef15(void 0);
5765
+ const closeTimerRef = useRef17(void 0);
5705
5766
  const welcomeMsgRaw = agentConfig?.welcomeMessage;
5706
5767
  const welcomeIsFactoryDefault = !welcomeMsgRaw || welcomeMsgRaw === DEFAULT_EN_WELCOME;
5707
5768
  const welcomeMessage = welcomeMsgRaw?.startsWith("widget.") ? t(welcomeMsgRaw) : welcomeIsFactoryDefault ? t("widget.welcome_message") : welcomeMsgRaw;
5708
- const openConversation = useCallback13(
5769
+ const openConversation = useCallback14(
5709
5770
  (id) => {
5710
5771
  setActiveConversation(id);
5711
5772
  setSubView("conversation");
5712
5773
  },
5713
5774
  [setActiveConversation]
5714
5775
  );
5715
- const openNewConversation = useCallback13(() => {
5776
+ const openNewConversation = useCallback14(() => {
5716
5777
  const agentId = agentConfig?.id;
5717
5778
  if (!agentId) {
5718
5779
  setSubView("new");
@@ -5738,8 +5799,8 @@ function DefaultWidget({
5738
5799
  setActiveConversation(tempId);
5739
5800
  setSubView("conversation");
5740
5801
  }, [agentConfig?.id, store, setActiveConversation, welcomeMessage]);
5741
- const didAutoOpenRef = useRef15(false);
5742
- useEffect15(() => {
5802
+ const didAutoOpenRef = useRef17(false);
5803
+ useEffect16(() => {
5743
5804
  if (!isOpen) {
5744
5805
  didAutoOpenRef.current = false;
5745
5806
  return;
@@ -5752,19 +5813,19 @@ function DefaultWidget({
5752
5813
  else openNewConversation();
5753
5814
  }, [isOpen, isReady, subView, conversations, openConversation, openNewConversation]);
5754
5815
  const dockComposer = useComposer(activeId);
5755
- const dockRef = useRef15(dockComposer);
5756
- useEffect15(() => {
5816
+ const dockRef = useRef17(dockComposer);
5817
+ useEffect16(() => {
5757
5818
  dockRef.current = dockComposer;
5758
5819
  });
5759
- const pendingDockText = useRef15(null);
5760
- const reopenFromDock = useCallback13(() => {
5820
+ const pendingDockText = useRef17(null);
5821
+ const reopenFromDock = useCallback14(() => {
5761
5822
  const state = store.getState();
5762
5823
  if (state.isOpen) return;
5763
5824
  const resumable = state.conversations.some((conv) => !conv.id.startsWith("temp-"));
5764
5825
  if (!resumable) return;
5765
5826
  state.setOpen(true);
5766
5827
  }, [store]);
5767
- const submitFromDock = useCallback13(
5828
+ const submitFromDock = useCallback14(
5768
5829
  (override) => {
5769
5830
  const text = (override ?? dockRef.current.text).trim();
5770
5831
  const stagedAttachment = dockRef.current.attachments.some((a) => a.part !== null);
@@ -5786,14 +5847,14 @@ function DefaultWidget({
5786
5847
  },
5787
5848
  [activeId, openNewConversation, store]
5788
5849
  );
5789
- useEffect15(() => {
5850
+ useEffect16(() => {
5790
5851
  if (!activeId || pendingDockText.current == null) return;
5791
5852
  const text = pendingDockText.current;
5792
5853
  pendingDockText.current = null;
5793
5854
  void dockRef.current.submit({ text, conversationId: activeId });
5794
5855
  }, [activeId]);
5795
- const [menuOpen, setMenuOpen] = useState15(false);
5796
- useEffect15(() => {
5856
+ const [menuOpen, setMenuOpen] = useState16(false);
5857
+ useEffect16(() => {
5797
5858
  if (!menuOpen) return;
5798
5859
  const close = () => setMenuOpen(false);
5799
5860
  const onKey = (event) => {
@@ -5806,7 +5867,7 @@ function DefaultWidget({
5806
5867
  document.removeEventListener("keydown", onKey);
5807
5868
  };
5808
5869
  }, [menuOpen]);
5809
- const goBack = useCallback13(() => {
5870
+ const goBack = useCallback14(() => {
5810
5871
  if (subView === "content-detail") {
5811
5872
  const tabId = activeTab.startsWith("content:") ? activeTab.slice(8) : null;
5812
5873
  const activeContentTab = tabId ? contentTabs.find((t2) => t2.id === tabId) : null;
@@ -5833,7 +5894,7 @@ function DefaultWidget({
5833
5894
  setActiveConversation(null);
5834
5895
  setSubView(null);
5835
5896
  }, [setActiveConversation, subView, activeTab, contentTabs, contentCategoryName, client, store]);
5836
- const switchTab = useCallback13(
5897
+ const switchTab = useCallback14(
5837
5898
  (tab) => {
5838
5899
  tabStateRef.current[activeTab] = { subView, activeId };
5839
5900
  const saved = tabStateRef.current[tab];
@@ -5848,7 +5909,7 @@ function DefaultWidget({
5848
5909
  [activeTab, subView, activeId, setActiveConversation]
5849
5910
  );
5850
5911
  const pendingContentDetail = useWidgetStore((s) => s.pendingContentDetail);
5851
- useEffect15(() => {
5912
+ useEffect16(() => {
5852
5913
  if (!pendingContentDetail) return;
5853
5914
  const { slug, tabId } = pendingContentDetail;
5854
5915
  markEntrySeen(slug);
@@ -5858,7 +5919,7 @@ function DefaultWidget({
5858
5919
  store.getState().setPendingContentDetail(null);
5859
5920
  }, [pendingContentDetail, markEntrySeen, switchTab, store]);
5860
5921
  const setStoreOpen = useWidgetStore((s) => s.setOpen);
5861
- const handleBubbleClick = useCallback13(() => {
5922
+ const handleBubbleClick = useCallback14(() => {
5862
5923
  if (storeIsOpen) {
5863
5924
  const leavingId = store.getState().activeConversationId;
5864
5925
  if (leavingId && !leavingId.startsWith("temp-")) {
@@ -5878,7 +5939,7 @@ function DefaultWidget({
5878
5939
  setStoreOpen(true);
5879
5940
  }
5880
5941
  }, [storeIsOpen, setStoreOpen, client, store]);
5881
- const handleClose = useCallback13(() => {
5942
+ const handleClose = useCallback14(() => {
5882
5943
  const leavingId = store.getState().activeConversationId;
5883
5944
  if (leavingId && !leavingId.startsWith("temp-")) {
5884
5945
  store.getState().clearUnread(leavingId);
@@ -5891,7 +5952,7 @@ function DefaultWidget({
5891
5952
  setStoreOpen(false);
5892
5953
  }, 200);
5893
5954
  }, [setStoreOpen, client, store]);
5894
- const handleNewConversation = useCallback13(async () => {
5955
+ const handleNewConversation = useCallback14(async () => {
5895
5956
  const trimmed = newText.trim();
5896
5957
  if (!trimmed || isCreating) return;
5897
5958
  const conv = await create(trimmed);
@@ -5900,16 +5961,16 @@ function DefaultWidget({
5900
5961
  setSubView("conversation");
5901
5962
  }
5902
5963
  }, [newText, isCreating, create]);
5903
- const windowRef = useRef15(null);
5904
- const bubbleRef = useRef15(null);
5905
- const tabStateRef = useRef15({});
5906
- const touchStartY = useRef15(0);
5907
- const touchDeltaY = useRef15(0);
5908
- const handleTouchStart = useCallback13((e) => {
5964
+ const windowRef = useRef17(null);
5965
+ const bubbleRef = useRef17(null);
5966
+ const tabStateRef = useRef17({});
5967
+ const touchStartY = useRef17(0);
5968
+ const touchDeltaY = useRef17(0);
5969
+ const handleTouchStart = useCallback14((e) => {
5909
5970
  touchStartY.current = e.touches[0]?.clientY ?? 0;
5910
5971
  touchDeltaY.current = 0;
5911
5972
  }, []);
5912
- const handleTouchMove = useCallback13((e) => {
5973
+ const handleTouchMove = useCallback14((e) => {
5913
5974
  const delta = (e.touches[0]?.clientY ?? 0) - touchStartY.current;
5914
5975
  touchDeltaY.current = delta;
5915
5976
  if (delta > 0 && windowRef.current) {
@@ -5917,7 +5978,7 @@ function DefaultWidget({
5917
5978
  windowRef.current.style.opacity = `${Math.max(1 - delta / 400, 0.5)}`;
5918
5979
  }
5919
5980
  }, []);
5920
- const handleTouchEnd = useCallback13(() => {
5981
+ const handleTouchEnd = useCallback14(() => {
5921
5982
  if (windowRef.current) {
5922
5983
  windowRef.current.style.transform = "";
5923
5984
  windowRef.current.style.opacity = "";
@@ -5926,13 +5987,14 @@ function DefaultWidget({
5926
5987
  handleClose();
5927
5988
  }
5928
5989
  }, [handleClose]);
5929
- useEffect15(() => {
5990
+ useEffect16(() => {
5930
5991
  if (!isOpen || !windowRef.current) return;
5931
5992
  const vv = window.visualViewport;
5932
5993
  if (!vv) return;
5933
5994
  const win = windowRef.current;
5934
5995
  const applyHeight = () => {
5935
5996
  win.style.setProperty("--hw-visible-height", `${vv.height}px`);
5997
+ win.toggleAttribute("data-hw-keyboard", window.innerHeight - vv.height > 120);
5936
5998
  };
5937
5999
  applyHeight();
5938
6000
  vv.addEventListener("resize", applyHeight);
@@ -5941,9 +6003,10 @@ function DefaultWidget({
5941
6003
  vv.removeEventListener("resize", applyHeight);
5942
6004
  vv.removeEventListener("scroll", applyHeight);
5943
6005
  win.style.removeProperty("--hw-visible-height");
6006
+ win.removeAttribute("data-hw-keyboard");
5944
6007
  };
5945
6008
  }, [isOpen]);
5946
- useEffect15(() => {
6009
+ useEffect16(() => {
5947
6010
  if (!isOpen || !windowRef.current) return;
5948
6011
  const win = windowRef.current;
5949
6012
  const handleKeyDown = (e) => {
@@ -5959,7 +6022,7 @@ function DefaultWidget({
5959
6022
  win.addEventListener("keydown", handleKeyDown);
5960
6023
  return () => win.removeEventListener("keydown", handleKeyDown);
5961
6024
  }, [isOpen, subView, handleClose, goBack]);
5962
- useEffect15(() => {
6025
+ useEffect16(() => {
5963
6026
  if (!isOpen || !windowRef.current || hideLauncher) return;
5964
6027
  const win = windowRef.current;
5965
6028
  const getFocusable = () => win.querySelectorAll(
@@ -6002,7 +6065,7 @@ function DefaultWidget({
6002
6065
  const launcherStyle = agentConfig?.launcherStyle ?? "icon";
6003
6066
  const bubbleStyle = agentConfig?.bubbleStyle ?? "rounded";
6004
6067
  const hasUploadedAvatar = !!agentConfig?.avatarUrl;
6005
- return /* @__PURE__ */ jsxs11(
6068
+ return /* @__PURE__ */ jsxs12(
6006
6069
  "div",
6007
6070
  {
6008
6071
  className: "hw-widget",
@@ -6018,7 +6081,7 @@ function DefaultWidget({
6018
6081
  "--hw-window-left": widgetPosition === "bottom-left" ? "0" : "auto"
6019
6082
  },
6020
6083
  children: [
6021
- placement === "docked" && isReady && /* @__PURE__ */ jsx16(
6084
+ placement === "docked" && isReady && /* @__PURE__ */ jsx17(
6022
6085
  DockedBar,
6023
6086
  {
6024
6087
  value: dockComposer.text,
@@ -6036,16 +6099,16 @@ function DefaultWidget({
6036
6099
  leading: customAvatar
6037
6100
  }
6038
6101
  ),
6039
- isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx16("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-loading", children: [
6040
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6041
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
6042
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
6102
+ isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx17("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-loading", children: [
6103
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6104
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
6105
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
6043
6106
  ] }) }),
6044
- isOpen && hasBootstrapError && /* @__PURE__ */ jsx16("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs11("div", { className: "hw-bootstrap-error", children: [
6045
- /* @__PURE__ */ jsx16("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
6046
- /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
6107
+ isOpen && hasBootstrapError && /* @__PURE__ */ jsx17("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs12("div", { className: "hw-bootstrap-error", children: [
6108
+ /* @__PURE__ */ jsx17("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
6109
+ /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
6047
6110
  ] }) }),
6048
- isOpen && isReady && /* @__PURE__ */ jsxs11(
6111
+ isOpen && isReady && /* @__PURE__ */ jsxs12(
6049
6112
  "div",
6050
6113
  {
6051
6114
  ref: windowRef,
@@ -6057,24 +6120,24 @@ function DefaultWidget({
6057
6120
  onTouchMove: handleTouchMove,
6058
6121
  onTouchEnd: handleTouchEnd,
6059
6122
  children: [
6060
- /* @__PURE__ */ jsx16("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx16("div", { className: "hw-drag-handle-pill" }) }),
6061
- wsDisconnected && /* @__PURE__ */ jsxs11("div", { className: "hw-disconnect", children: [
6062
- /* @__PURE__ */ jsx16("div", { className: "hw-disconnect-spinner" }),
6123
+ /* @__PURE__ */ jsx17("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx17("div", { className: "hw-drag-handle-pill" }) }),
6124
+ wsDisconnected && /* @__PURE__ */ jsxs12("div", { className: "hw-disconnect", children: [
6125
+ /* @__PURE__ */ jsx17("div", { className: "hw-disconnect-spinner" }),
6063
6126
  t("widget.reconnecting")
6064
6127
  ] }),
6065
6128
  (subView === "content-detail" || subView === "content-category") && (() => {
6066
6129
  const tabId = activeTab.replace("content:", "");
6067
6130
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6068
6131
  const headerTitle = subView === "content-category" && contentCategoryName ? contentCategoryName : contentTab?.label ? resolveLabel2(contentTab.label) : t("widget.content");
6069
- return /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
6070
- /* @__PURE__ */ jsx16(
6132
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6133
+ /* @__PURE__ */ jsx17(
6071
6134
  "button",
6072
6135
  {
6073
6136
  type: "button",
6074
6137
  className: "hw-header-back",
6075
6138
  onClick: goBack,
6076
6139
  "aria-label": t("widget.aria_back"),
6077
- children: /* @__PURE__ */ jsx16(
6140
+ children: /* @__PURE__ */ jsx17(
6078
6141
  "svg",
6079
6142
  {
6080
6143
  viewBox: "0 0 24 24",
@@ -6083,33 +6146,33 @@ function DefaultWidget({
6083
6146
  strokeWidth: 2,
6084
6147
  strokeLinecap: "round",
6085
6148
  strokeLinejoin: "round",
6086
- children: /* @__PURE__ */ jsx16("path", { d: "M15 18l-6-6 6-6" })
6149
+ children: /* @__PURE__ */ jsx17("path", { d: "M15 18l-6-6 6-6" })
6087
6150
  }
6088
6151
  )
6089
6152
  }
6090
6153
  ),
6091
- /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: headerTitle }),
6092
- /* @__PURE__ */ jsx16(
6154
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: headerTitle }),
6155
+ /* @__PURE__ */ jsx17(
6093
6156
  "button",
6094
6157
  {
6095
6158
  type: "button",
6096
6159
  className: "hw-header-close",
6097
6160
  onClick: handleClose,
6098
6161
  "aria-label": t("widget.aria_close"),
6099
- children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
6162
+ children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6100
6163
  }
6101
6164
  )
6102
6165
  ] });
6103
6166
  })(),
6104
- subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--sub", children: [
6105
- /* @__PURE__ */ jsx16(
6167
+ subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--sub", children: [
6168
+ /* @__PURE__ */ jsx17(
6106
6169
  "button",
6107
6170
  {
6108
6171
  type: "button",
6109
6172
  className: "hw-header-back",
6110
6173
  onClick: goBack,
6111
6174
  "aria-label": t("widget.aria_back"),
6112
- children: /* @__PURE__ */ jsx16(
6175
+ children: /* @__PURE__ */ jsx17(
6113
6176
  "svg",
6114
6177
  {
6115
6178
  viewBox: "0 0 24 24",
@@ -6118,26 +6181,34 @@ function DefaultWidget({
6118
6181
  strokeWidth: 2,
6119
6182
  strokeLinecap: "round",
6120
6183
  strokeLinejoin: "round",
6121
- children: /* @__PURE__ */ jsx16("path", { d: "M15 18l-6-6 6-6" })
6184
+ children: /* @__PURE__ */ jsx17("path", { d: "M15 18l-6-6 6-6" })
6122
6185
  }
6123
6186
  )
6124
6187
  }
6125
6188
  ),
6126
- /* @__PURE__ */ jsxs11("div", { className: "hw-header-identity", children: [
6127
- /* @__PURE__ */ jsx16(
6189
+ /* @__PURE__ */ jsxs12("div", { className: "hw-header-identity", children: [
6190
+ /* @__PURE__ */ jsx17(
6128
6191
  "div",
6129
6192
  {
6130
6193
  className: `hw-header-bot-icon${hasTeamAgent ? " hw-header-bot-icon--team" : ""}`,
6131
- 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, {})
6194
+ children: hasTeamAgent && humanImage ? /* @__PURE__ */ jsx17(
6195
+ "img",
6196
+ {
6197
+ src: humanImage,
6198
+ alt: headerName,
6199
+ className: "hw-header-agent-img",
6200
+ referrerPolicy: "no-referrer"
6201
+ }
6202
+ ) : hasTeamAgent ? /* @__PURE__ */ jsx17("span", { className: "hw-header-agent-initials", children: headerName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx17(WidgetLogo, {})
6132
6203
  }
6133
6204
  ),
6134
- /* @__PURE__ */ jsxs11("div", { className: "hw-header-info", children: [
6135
- /* @__PURE__ */ jsx16("div", { className: "hw-header-name", children: headerName }),
6136
- /* @__PURE__ */ jsx16("div", { className: "hw-header-status", children: subtitleText })
6205
+ /* @__PURE__ */ jsxs12("div", { className: "hw-header-info", children: [
6206
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-name", children: headerName }),
6207
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-status", children: subtitleText })
6137
6208
  ] })
6138
6209
  ] }),
6139
- /* @__PURE__ */ jsxs11("div", { className: "hw-header-actions", children: [
6140
- /* @__PURE__ */ jsx16(
6210
+ /* @__PURE__ */ jsxs12("div", { className: "hw-header-actions", children: [
6211
+ /* @__PURE__ */ jsx17(
6141
6212
  "button",
6142
6213
  {
6143
6214
  type: "button",
@@ -6149,21 +6220,21 @@ function DefaultWidget({
6149
6220
  event.stopPropagation();
6150
6221
  setMenuOpen((open) => !open);
6151
6222
  },
6152
- children: /* @__PURE__ */ jsx16(DotsIcon, { size: 18 })
6223
+ children: /* @__PURE__ */ jsx17(DotsIcon, { size: 18 })
6153
6224
  }
6154
6225
  ),
6155
- /* @__PURE__ */ jsx16(
6226
+ /* @__PURE__ */ jsx17(
6156
6227
  "button",
6157
6228
  {
6158
6229
  type: "button",
6159
6230
  className: "hw-header-close",
6160
6231
  onClick: handleClose,
6161
6232
  "aria-label": t("widget.aria_close"),
6162
- children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
6233
+ children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6163
6234
  }
6164
6235
  ),
6165
- menuOpen && /* @__PURE__ */ jsxs11("div", { className: "hw-header-menu", role: "menu", children: [
6166
- conversations.length > 0 && /* @__PURE__ */ jsx16("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs11(
6236
+ menuOpen && /* @__PURE__ */ jsxs12("div", { className: "hw-header-menu", role: "menu", children: [
6237
+ conversations.length > 0 && /* @__PURE__ */ jsx17("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs12(
6167
6238
  "button",
6168
6239
  {
6169
6240
  type: "button",
@@ -6175,16 +6246,16 @@ function DefaultWidget({
6175
6246
  openConversation(conv.id);
6176
6247
  },
6177
6248
  children: [
6178
- /* @__PURE__ */ jsxs11("span", { className: "hw-header-menu-conv-top", children: [
6179
- /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
6180
- conv.lastMessageAt && /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
6249
+ /* @__PURE__ */ jsxs12("span", { className: "hw-header-menu-conv-top", children: [
6250
+ /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
6251
+ conv.lastMessageAt && /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
6181
6252
  ] }),
6182
- /* @__PURE__ */ jsx16("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
6253
+ /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
6183
6254
  ]
6184
6255
  },
6185
6256
  conv.id
6186
6257
  )) }),
6187
- /* @__PURE__ */ jsxs11(
6258
+ /* @__PURE__ */ jsxs12(
6188
6259
  "button",
6189
6260
  {
6190
6261
  type: "button",
@@ -6194,7 +6265,7 @@ function DefaultWidget({
6194
6265
  openNewConversation();
6195
6266
  },
6196
6267
  children: [
6197
- /* @__PURE__ */ jsx16(NewChatIcon, { size: 16 }),
6268
+ /* @__PURE__ */ jsx17(NewChatIcon, { size: 16 }),
6198
6269
  t("widget.new_conversation")
6199
6270
  ]
6200
6271
  }
@@ -6202,43 +6273,43 @@ function DefaultWidget({
6202
6273
  ] })
6203
6274
  ] })
6204
6275
  ] }),
6205
- subView === null && activeTab === "home" && /* @__PURE__ */ jsxs11(Fragment5, { children: [
6206
- /* @__PURE__ */ jsxs11("div", { className: "hw-hero", children: [
6207
- /* @__PURE__ */ jsxs11("div", { className: "hw-hero-top", children: [
6208
- /* @__PURE__ */ jsx16("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx16(WidgetLogo, {}) }),
6209
- /* @__PURE__ */ jsx16(
6276
+ subView === null && activeTab === "home" && /* @__PURE__ */ jsxs12(Fragment5, { children: [
6277
+ /* @__PURE__ */ jsxs12("div", { className: "hw-hero", children: [
6278
+ /* @__PURE__ */ jsxs12("div", { className: "hw-hero-top", children: [
6279
+ /* @__PURE__ */ jsx17("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx17(WidgetLogo, {}) }),
6280
+ /* @__PURE__ */ jsx17(
6210
6281
  "button",
6211
6282
  {
6212
6283
  type: "button",
6213
6284
  className: "hw-hero-close",
6214
6285
  onClick: handleClose,
6215
6286
  "aria-label": t("widget.aria_close"),
6216
- children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
6287
+ children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6217
6288
  }
6218
6289
  )
6219
6290
  ] }),
6220
- /* @__PURE__ */ jsx16("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs11(
6291
+ /* @__PURE__ */ jsx17("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs12(
6221
6292
  "span",
6222
6293
  {
6223
6294
  className: i === 0 ? "hw-hero-greeting-name" : "hw-hero-greeting-question",
6224
6295
  children: [
6225
- i > 0 && /* @__PURE__ */ jsx16("br", {}),
6296
+ i > 0 && /* @__PURE__ */ jsx17("br", {}),
6226
6297
  line
6227
6298
  ]
6228
6299
  },
6229
6300
  i
6230
6301
  )) }),
6231
- /* @__PURE__ */ jsx16("div", { className: "hw-hero-subtitle", children: subtitleText })
6302
+ /* @__PURE__ */ jsx17("div", { className: "hw-hero-subtitle", children: subtitleText })
6232
6303
  ] }),
6233
- /* @__PURE__ */ jsx16("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs11("div", { className: "hw-sheet-inner", children: [
6234
- /* @__PURE__ */ jsxs11("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
6235
- /* @__PURE__ */ jsxs11("div", { className: "hw-card-body", children: [
6236
- /* @__PURE__ */ jsx16("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
6237
- /* @__PURE__ */ jsx16("div", { className: "hw-card-meta", children: t("widget.reply_time") })
6304
+ /* @__PURE__ */ jsx17("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs12("div", { className: "hw-sheet-inner", children: [
6305
+ /* @__PURE__ */ jsxs12("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
6306
+ /* @__PURE__ */ jsxs12("div", { className: "hw-card-body", children: [
6307
+ /* @__PURE__ */ jsx17("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
6308
+ /* @__PURE__ */ jsx17("div", { className: "hw-card-meta", children: t("widget.reply_time") })
6238
6309
  ] }),
6239
- /* @__PURE__ */ jsx16("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx16(SendIcon, {}) })
6310
+ /* @__PURE__ */ jsx17("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx17(SendIcon, {}) })
6240
6311
  ] }),
6241
- announcementTabs.length > 0 && /* @__PURE__ */ jsx16(
6312
+ announcementTabs.length > 0 && /* @__PURE__ */ jsx17(
6242
6313
  WhatsNewCard,
6243
6314
  {
6244
6315
  getUnseenEntries,
@@ -6254,7 +6325,7 @@ function DefaultWidget({
6254
6325
  }
6255
6326
  }
6256
6327
  ),
6257
- /* @__PURE__ */ jsx16(
6328
+ /* @__PURE__ */ jsx17(
6258
6329
  HomeView,
6259
6330
  {
6260
6331
  conversations,
@@ -6264,17 +6335,17 @@ function DefaultWidget({
6264
6335
  )
6265
6336
  ] }) })
6266
6337
  ] }),
6267
- subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
6268
- /* @__PURE__ */ jsx16("div", { className: "hw-header-spacer" }),
6269
- /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: t("widget.messages") }),
6270
- /* @__PURE__ */ jsx16(
6338
+ subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6339
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-spacer" }),
6340
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: t("widget.messages") }),
6341
+ /* @__PURE__ */ jsx17(
6271
6342
  "button",
6272
6343
  {
6273
6344
  type: "button",
6274
6345
  className: "hw-header-close",
6275
6346
  onClick: handleClose,
6276
6347
  "aria-label": t("widget.aria_close"),
6277
- children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
6348
+ children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6278
6349
  }
6279
6350
  )
6280
6351
  ] }),
@@ -6282,23 +6353,23 @@ function DefaultWidget({
6282
6353
  const tabId = activeTab.replace("content:", "");
6283
6354
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6284
6355
  if (!contentTab) return null;
6285
- return /* @__PURE__ */ jsxs11("div", { className: "hw-header hw-header--centered", children: [
6286
- /* @__PURE__ */ jsx16("div", { className: "hw-header-spacer" }),
6287
- /* @__PURE__ */ jsx16("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
6288
- /* @__PURE__ */ jsx16(
6356
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6357
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-spacer" }),
6358
+ /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
6359
+ /* @__PURE__ */ jsx17(
6289
6360
  "button",
6290
6361
  {
6291
6362
  type: "button",
6292
6363
  className: "hw-header-close",
6293
6364
  onClick: handleClose,
6294
6365
  "aria-label": t("widget.aria_close"),
6295
- children: /* @__PURE__ */ jsx16(CloseGlyph, { docked: placement === "docked" })
6366
+ children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6296
6367
  }
6297
6368
  )
6298
6369
  ] });
6299
6370
  })(),
6300
- (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs11("div", { className: "hw-content", children: [
6301
- subView === null && activeTab === "messages" && /* @__PURE__ */ jsx16(
6371
+ (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs12("div", { className: "hw-content", children: [
6372
+ subView === null && activeTab === "messages" && /* @__PURE__ */ jsx17(
6302
6373
  MessagesView,
6303
6374
  {
6304
6375
  conversations,
@@ -6306,7 +6377,7 @@ function DefaultWidget({
6306
6377
  onNewClick: openNewConversation
6307
6378
  }
6308
6379
  ),
6309
- subView === "new" && /* @__PURE__ */ jsx16(
6380
+ subView === "new" && /* @__PURE__ */ jsx17(
6310
6381
  NewConversationView,
6311
6382
  {
6312
6383
  text: newText,
@@ -6316,12 +6387,12 @@ function DefaultWidget({
6316
6387
  welcomeMessage
6317
6388
  }
6318
6389
  ),
6319
- subView === "conversation" && activeId && /* @__PURE__ */ jsx16(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
6390
+ subView === "conversation" && activeId && /* @__PURE__ */ jsx17(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
6320
6391
  activeTab.startsWith("content:") && (() => {
6321
6392
  const tabId = activeTab.replace("content:", "");
6322
6393
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6323
6394
  if (!contentTab) return null;
6324
- return /* @__PURE__ */ jsx16(
6395
+ return /* @__PURE__ */ jsx17(
6325
6396
  ContentTabView,
6326
6397
  {
6327
6398
  tab: contentTab,
@@ -6341,7 +6412,7 @@ function DefaultWidget({
6341
6412
  );
6342
6413
  })()
6343
6414
  ] }),
6344
- showTabBar && /* @__PURE__ */ jsx16(
6415
+ showTabBar && /* @__PURE__ */ jsx17(
6345
6416
  TabBar,
6346
6417
  {
6347
6418
  activeTab,
@@ -6352,20 +6423,20 @@ function DefaultWidget({
6352
6423
  unseenAnnouncementCount
6353
6424
  }
6354
6425
  ),
6355
- /* @__PURE__ */ jsxs11("div", { className: "hw-powered", children: [
6426
+ /* @__PURE__ */ jsxs12("div", { className: "hw-powered", children: [
6356
6427
  t("widget.powered_by"),
6357
6428
  " ",
6358
- /* @__PURE__ */ jsx16("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
6429
+ /* @__PURE__ */ jsx17("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
6359
6430
  ] })
6360
6431
  ]
6361
6432
  }
6362
6433
  ),
6363
- isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs11("div", { className: "hw-preview-dock", children: [
6364
- /* @__PURE__ */ jsx16(
6434
+ isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs12("div", { className: "hw-preview-dock", children: [
6435
+ /* @__PURE__ */ jsx17(
6365
6436
  AnnouncementPreviews,
6366
6437
  {
6367
6438
  maxVisible: incomingPreview ? 1 : 2,
6368
- avatar: /* @__PURE__ */ jsx16(WidgetLogo, {}),
6439
+ avatar: /* @__PURE__ */ jsx17(WidgetLogo, {}),
6369
6440
  onOpen: (slug, tabId) => {
6370
6441
  markEntrySeen(slug);
6371
6442
  handleBubbleClick();
@@ -6377,10 +6448,10 @@ function DefaultWidget({
6377
6448
  }
6378
6449
  }
6379
6450
  ),
6380
- /* @__PURE__ */ jsx16(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx16(WidgetLogo, {}), autoDismissMs: null })
6451
+ /* @__PURE__ */ jsx17(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx17(WidgetLogo, {}), autoDismissMs: null })
6381
6452
  ] }),
6382
- /* @__PURE__ */ jsx16(WidgetDebugOverlay, {}),
6383
- isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs11(
6453
+ /* @__PURE__ */ jsx17(WidgetDebugOverlay, {}),
6454
+ isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs12(
6384
6455
  "button",
6385
6456
  {
6386
6457
  ref: bubbleRef,
@@ -6397,24 +6468,24 @@ function DefaultWidget({
6397
6468
  "aria-expanded": isOpen,
6398
6469
  "aria-haspopup": "dialog",
6399
6470
  children: [
6400
- /* @__PURE__ */ jsx16(
6471
+ /* @__PURE__ */ jsx17(
6401
6472
  "span",
6402
6473
  {
6403
6474
  className: `hw-bubble-icon hw-bubble-icon--bot ${isOpen ? "hw-bubble-icon--hidden" : ""}`,
6404
- children: /* @__PURE__ */ jsx16(LauncherIcon, {})
6475
+ children: /* @__PURE__ */ jsx17(LauncherIcon, {})
6405
6476
  }
6406
6477
  ),
6407
- /* @__PURE__ */ jsx16(
6478
+ /* @__PURE__ */ jsx17(
6408
6479
  "span",
6409
6480
  {
6410
6481
  className: `hw-bubble-icon hw-bubble-icon--close ${!isOpen ? "hw-bubble-icon--hidden" : ""}`,
6411
- children: /* @__PURE__ */ jsx16(XIcon, { size: 24 })
6482
+ children: /* @__PURE__ */ jsx17(XIcon, { size: 24 })
6412
6483
  }
6413
6484
  ),
6414
- launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx16("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
6415
- !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs11("div", { className: "hw-bubble-badge", children: [
6485
+ launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx17("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
6486
+ !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs12("div", { className: "hw-bubble-badge", children: [
6416
6487
  totalUnread > 0 ? totalUnread : "",
6417
- totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx16("span", { className: "hw-bubble-badge-dot" })
6488
+ totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx17("span", { className: "hw-bubble-badge-dot" })
6418
6489
  ] })
6419
6490
  ]
6420
6491
  }
@@ -6431,8 +6502,8 @@ function TabBar({
6431
6502
  showMessagesTab = true,
6432
6503
  unseenAnnouncementCount = 0
6433
6504
  }) {
6434
- return /* @__PURE__ */ jsxs11("div", { className: "hw-tabs", role: "tablist", children: [
6435
- /* @__PURE__ */ jsxs11(
6505
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-tabs", role: "tablist", children: [
6506
+ /* @__PURE__ */ jsxs12(
6436
6507
  "button",
6437
6508
  {
6438
6509
  type: "button",
@@ -6441,12 +6512,12 @@ function TabBar({
6441
6512
  role: "tab",
6442
6513
  "aria-selected": activeTab === "home",
6443
6514
  children: [
6444
- /* @__PURE__ */ jsx16(HomeIcon, {}),
6445
- /* @__PURE__ */ jsx16("span", { children: t("widget.home") })
6515
+ /* @__PURE__ */ jsx17(HomeIcon, {}),
6516
+ /* @__PURE__ */ jsx17("span", { children: t("widget.home") })
6446
6517
  ]
6447
6518
  }
6448
6519
  ),
6449
- showMessagesTab && /* @__PURE__ */ jsxs11(
6520
+ showMessagesTab && /* @__PURE__ */ jsxs12(
6450
6521
  "button",
6451
6522
  {
6452
6523
  type: "button",
@@ -6455,15 +6526,15 @@ function TabBar({
6455
6526
  role: "tab",
6456
6527
  "aria-selected": activeTab === "messages",
6457
6528
  children: [
6458
- /* @__PURE__ */ jsxs11("span", { className: "hw-tabs-icon-wrap", children: [
6459
- /* @__PURE__ */ jsx16(MessagesIcon, {}),
6460
- unreadCount > 0 && /* @__PURE__ */ jsx16("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
6529
+ /* @__PURE__ */ jsxs12("span", { className: "hw-tabs-icon-wrap", children: [
6530
+ /* @__PURE__ */ jsx17(MessagesIcon, {}),
6531
+ unreadCount > 0 && /* @__PURE__ */ jsx17("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
6461
6532
  ] }),
6462
- /* @__PURE__ */ jsx16("span", { children: t("widget.messages") })
6533
+ /* @__PURE__ */ jsx17("span", { children: t("widget.messages") })
6463
6534
  ]
6464
6535
  }
6465
6536
  ),
6466
- contentTabs.map((tab) => /* @__PURE__ */ jsxs11(
6537
+ contentTabs.map((tab) => /* @__PURE__ */ jsxs12(
6467
6538
  "button",
6468
6539
  {
6469
6540
  type: "button",
@@ -6472,11 +6543,11 @@ function TabBar({
6472
6543
  role: "tab",
6473
6544
  "aria-selected": activeTab === `content:${tab.id}`,
6474
6545
  children: [
6475
- /* @__PURE__ */ jsxs11("span", { className: "hw-tabs-icon-wrap", children: [
6476
- /* @__PURE__ */ jsx16(ContentTabIconComponent, { icon: tab.icon }),
6477
- tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx16("span", { className: "hw-tabs-dot" })
6546
+ /* @__PURE__ */ jsxs12("span", { className: "hw-tabs-icon-wrap", children: [
6547
+ /* @__PURE__ */ jsx17(ContentTabIconComponent, { icon: tab.icon }),
6548
+ tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx17("span", { className: "hw-tabs-dot" })
6478
6549
  ] }),
6479
- /* @__PURE__ */ jsx16("span", { children: resolveLabel2(tab.label) })
6550
+ /* @__PURE__ */ jsx17("span", { children: resolveLabel2(tab.label) })
6480
6551
  ]
6481
6552
  },
6482
6553
  tab.id
@@ -6490,9 +6561,9 @@ function HomeView({
6490
6561
  }) {
6491
6562
  const recent = conversations.slice(0, 3);
6492
6563
  if (recent.length === 0) return null;
6493
- return /* @__PURE__ */ jsxs11("div", { className: "hw-recent-card", children: [
6494
- /* @__PURE__ */ jsx16("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
6495
- recent.map((conv, i) => /* @__PURE__ */ jsx16(
6564
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-recent-card", children: [
6565
+ /* @__PURE__ */ jsx17("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
6566
+ recent.map((conv, i) => /* @__PURE__ */ jsx17(
6496
6567
  ConversationRow,
6497
6568
  {
6498
6569
  conversation: conv,
@@ -6501,7 +6572,7 @@ function HomeView({
6501
6572
  },
6502
6573
  conv.id
6503
6574
  )),
6504
- conversations.length > 3 && /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
6575
+ conversations.length > 3 && /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
6505
6576
  ] });
6506
6577
  }
6507
6578
  function MessagesView({
@@ -6510,14 +6581,14 @@ function MessagesView({
6510
6581
  onNewClick
6511
6582
  }) {
6512
6583
  if (conversations.length === 0) {
6513
- return /* @__PURE__ */ jsxs11("div", { className: "hw-empty-state", children: [
6514
- /* @__PURE__ */ jsx16("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx16(MessagesIcon, {}) }),
6515
- /* @__PURE__ */ jsx16("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
6516
- /* @__PURE__ */ jsx16("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
6517
- /* @__PURE__ */ jsx16("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
6584
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-empty-state", children: [
6585
+ /* @__PURE__ */ jsx17("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx17(MessagesIcon, {}) }),
6586
+ /* @__PURE__ */ jsx17("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
6587
+ /* @__PURE__ */ jsx17("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
6588
+ /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
6518
6589
  ] });
6519
6590
  }
6520
- return /* @__PURE__ */ jsx16("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx16(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
6591
+ return /* @__PURE__ */ jsx17("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx17(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
6521
6592
  }
6522
6593
  function ConvCardBody({ conv }) {
6523
6594
  const agentName = useWidgetStore((s) => s.agentConfig?.name) ?? "Support";
@@ -6525,14 +6596,22 @@ function ConvCardBody({ conv }) {
6525
6596
  const isTeam = !!humanName;
6526
6597
  const displayName = humanName ?? agentName;
6527
6598
  const preview = conv.lastMessageText ?? t("widget.no_preview");
6528
- return /* @__PURE__ */ jsxs11(Fragment5, { children: [
6529
- /* @__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, {}) }),
6530
- /* @__PURE__ */ jsxs11("div", { className: "hw-conv-card-content", children: [
6531
- /* @__PURE__ */ jsxs11("div", { className: "hw-conv-card-top", children: [
6532
- /* @__PURE__ */ jsx16("span", { className: "hw-conv-card-name", children: displayName }),
6533
- conv.lastMessageAt && /* @__PURE__ */ jsx16("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
6599
+ return /* @__PURE__ */ jsxs12(Fragment5, { children: [
6600
+ /* @__PURE__ */ jsx17("div", { className: `hw-conv-card-avatar${isTeam ? " hw-conv-card-avatar--team" : ""}`, children: isTeam ? humanImage ? /* @__PURE__ */ jsx17(
6601
+ "img",
6602
+ {
6603
+ src: humanImage,
6604
+ alt: displayName,
6605
+ className: "hw-conv-card-avatar-img",
6606
+ referrerPolicy: "no-referrer"
6607
+ }
6608
+ ) : /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-avatar-initials", children: displayName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx17(WidgetLogo, {}) }),
6609
+ /* @__PURE__ */ jsxs12("div", { className: "hw-conv-card-content", children: [
6610
+ /* @__PURE__ */ jsxs12("div", { className: "hw-conv-card-top", children: [
6611
+ /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-name", children: displayName }),
6612
+ conv.lastMessageAt && /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
6534
6613
  ] }),
6535
- /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-preview", children: preview })
6614
+ /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-preview", children: preview })
6536
6615
  ] })
6537
6616
  ] });
6538
6617
  }
@@ -6542,16 +6621,16 @@ function ConversationCard({
6542
6621
  }) {
6543
6622
  const hasUnread = conv.unreadCount > 0;
6544
6623
  const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
6545
- return /* @__PURE__ */ jsxs11(
6624
+ return /* @__PURE__ */ jsxs12(
6546
6625
  "button",
6547
6626
  {
6548
6627
  type: "button",
6549
6628
  className: `hw-conv-card ${hasUnread ? "hw-conv-card--unread" : ""}`,
6550
6629
  onClick: () => onSelect(conv.id),
6551
6630
  children: [
6552
- /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx16(ConvCardBody, { conv }) }),
6553
- hasUnread && /* @__PURE__ */ jsx16("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
6554
- awaiting && /* @__PURE__ */ jsx16("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6631
+ /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx17(ConvCardBody, { conv }) }),
6632
+ hasUnread && /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
6633
+ awaiting && /* @__PURE__ */ jsx17("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6555
6634
  ]
6556
6635
  }
6557
6636
  );
@@ -6563,16 +6642,16 @@ function ConversationRow({
6563
6642
  }) {
6564
6643
  const hasUnread = conv.unreadCount > 0;
6565
6644
  const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
6566
- return /* @__PURE__ */ jsxs11(
6645
+ return /* @__PURE__ */ jsxs12(
6567
6646
  "button",
6568
6647
  {
6569
6648
  type: "button",
6570
6649
  className: `hw-recent-row ${hasUnread ? "hw-recent-row--unread" : ""} ${isLast ? "hw-recent-row--last" : ""}`,
6571
6650
  onClick: () => onSelect(conv.id),
6572
6651
  children: [
6573
- /* @__PURE__ */ jsx16(ConvCardBody, { conv }),
6574
- hasUnread && /* @__PURE__ */ jsx16("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
6575
- awaiting && /* @__PURE__ */ jsx16("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6652
+ /* @__PURE__ */ jsx17(ConvCardBody, { conv }),
6653
+ hasUnread && /* @__PURE__ */ jsx17("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
6654
+ awaiting && /* @__PURE__ */ jsx17("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6576
6655
  ]
6577
6656
  }
6578
6657
  );
@@ -6580,10 +6659,10 @@ function ConversationRow({
6580
6659
  function InlineEmailPrompt({ conversationId }) {
6581
6660
  const { client, store } = useWidgetContext();
6582
6661
  const updateContact = useWidgetStore((s) => s.updateVisitorContact);
6583
- const [email, setEmail] = useState15("");
6584
- const [isSubmitting, setIsSubmitting] = useState15(false);
6585
- const [isSuccess, setIsSuccess] = useState15(false);
6586
- const [hasError, setHasError] = useState15(false);
6662
+ const [email, setEmail] = useState16("");
6663
+ const [isSubmitting, setIsSubmitting] = useState16(false);
6664
+ const [isSuccess, setIsSuccess] = useState16(false);
6665
+ const [hasError, setHasError] = useState16(false);
6587
6666
  const handleSubmit = async () => {
6588
6667
  const trimmed = email.trim();
6589
6668
  if (!trimmed || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) {
@@ -6624,8 +6703,8 @@ function InlineEmailPrompt({ conversationId }) {
6624
6703
  }
6625
6704
  };
6626
6705
  if (isSuccess) {
6627
- return /* @__PURE__ */ jsxs11("div", { className: "hw-email-card hw-email-card--success", children: [
6628
- /* @__PURE__ */ jsx16(
6706
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-email-card hw-email-card--success", children: [
6707
+ /* @__PURE__ */ jsx17(
6629
6708
  "svg",
6630
6709
  {
6631
6710
  width: "15",
@@ -6636,17 +6715,17 @@ function InlineEmailPrompt({ conversationId }) {
6636
6715
  strokeWidth: 2.5,
6637
6716
  strokeLinecap: "round",
6638
6717
  strokeLinejoin: "round",
6639
- children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" })
6718
+ children: /* @__PURE__ */ jsx17("polyline", { points: "20 6 9 17 4 12" })
6640
6719
  }
6641
6720
  ),
6642
6721
  t("widget.email_saved")
6643
6722
  ] });
6644
6723
  }
6645
- return /* @__PURE__ */ jsxs11("div", { className: "hw-email-card", children: [
6646
- /* @__PURE__ */ jsx16("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
6647
- /* @__PURE__ */ jsx16("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
6648
- /* @__PURE__ */ jsxs11("div", { className: "hw-email-card-row", children: [
6649
- /* @__PURE__ */ jsx16(
6724
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-email-card", children: [
6725
+ /* @__PURE__ */ jsx17("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
6726
+ /* @__PURE__ */ jsx17("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
6727
+ /* @__PURE__ */ jsxs12("div", { className: "hw-email-card-row", children: [
6728
+ /* @__PURE__ */ jsx17(
6650
6729
  "input",
6651
6730
  {
6652
6731
  type: "email",
@@ -6662,7 +6741,7 @@ function InlineEmailPrompt({ conversationId }) {
6662
6741
  placeholder: t("widget.email_placeholder")
6663
6742
  }
6664
6743
  ),
6665
- /* @__PURE__ */ jsx16(
6744
+ /* @__PURE__ */ jsx17(
6666
6745
  "button",
6667
6746
  {
6668
6747
  type: "button",
@@ -6670,7 +6749,7 @@ function InlineEmailPrompt({ conversationId }) {
6670
6749
  onClick: handleSubmit,
6671
6750
  disabled: isSubmitting || !email.trim(),
6672
6751
  "aria-label": t("widget.email_continue"),
6673
- children: isSubmitting ? /* @__PURE__ */ jsx16(
6752
+ children: isSubmitting ? /* @__PURE__ */ jsx17(
6674
6753
  "svg",
6675
6754
  {
6676
6755
  width: "14",
@@ -6680,7 +6759,7 @@ function InlineEmailPrompt({ conversationId }) {
6680
6759
  stroke: "currentColor",
6681
6760
  strokeWidth: 2,
6682
6761
  "aria-hidden": "true",
6683
- children: /* @__PURE__ */ jsx16("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx16(
6762
+ children: /* @__PURE__ */ jsx17("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx17(
6684
6763
  "animate",
6685
6764
  {
6686
6765
  attributeName: "stroke-dashoffset",
@@ -6690,7 +6769,7 @@ function InlineEmailPrompt({ conversationId }) {
6690
6769
  }
6691
6770
  ) })
6692
6771
  }
6693
- ) : /* @__PURE__ */ jsx16(
6772
+ ) : /* @__PURE__ */ jsx17(
6694
6773
  "svg",
6695
6774
  {
6696
6775
  width: "15",
@@ -6702,7 +6781,7 @@ function InlineEmailPrompt({ conversationId }) {
6702
6781
  strokeLinecap: "round",
6703
6782
  strokeLinejoin: "round",
6704
6783
  "aria-hidden": "true",
6705
- children: /* @__PURE__ */ jsx16("path", { d: "M5 12h13M12 5l7 7-7 7" })
6784
+ children: /* @__PURE__ */ jsx17("path", { d: "M5 12h13M12 5l7 7-7 7" })
6706
6785
  }
6707
6786
  )
6708
6787
  }
@@ -6717,9 +6796,9 @@ function NewConversationView({
6717
6796
  isSubmitting,
6718
6797
  welcomeMessage
6719
6798
  }) {
6720
- return /* @__PURE__ */ jsxs11("div", { className: "hw-new", children: [
6721
- /* @__PURE__ */ jsx16("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx16(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
6722
- /* @__PURE__ */ jsx16(
6799
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-new", children: [
6800
+ /* @__PURE__ */ jsx17("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx17(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
6801
+ /* @__PURE__ */ jsx17(
6723
6802
  Composer,
6724
6803
  {
6725
6804
  text,
@@ -6768,27 +6847,27 @@ function ConversationView({
6768
6847
  const needsEmailPostReply = !!agentConfig?.requireVisitorEmail && !hasEmail && visitorMessageCount >= 2 && hasAiReply;
6769
6848
  const needsEmail = needsEmailPostReply || !!emailGateConvId;
6770
6849
  if (isLoading && items.length === 0) {
6771
- return /* @__PURE__ */ jsx16("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-messages", children: [
6772
- /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-msg", children: [
6773
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6774
- /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-bubble", children: [
6775
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
6776
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
6850
+ return /* @__PURE__ */ jsx17("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-messages", children: [
6851
+ /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-msg", children: [
6852
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6853
+ /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-bubble", children: [
6854
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
6855
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
6777
6856
  ] })
6778
6857
  ] }),
6779
- /* @__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 } }) }) }),
6780
- /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-msg", children: [
6781
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6782
- /* @__PURE__ */ jsxs11("div", { className: "hw-skeleton-bubble", children: [
6783
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
6784
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6785
- /* @__PURE__ */ jsx16("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
6858
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton-msg hw-skeleton-msg--right", children: /* @__PURE__ */ jsx17("div", { className: "hw-skeleton-bubble", style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } }) }) }),
6859
+ /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-msg", children: [
6860
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6861
+ /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-bubble", children: [
6862
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
6863
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6864
+ /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
6786
6865
  ] })
6787
6866
  ] })
6788
6867
  ] }) });
6789
6868
  }
6790
- return /* @__PURE__ */ jsxs11(Fragment5, { children: [
6791
- /* @__PURE__ */ jsx16(
6869
+ return /* @__PURE__ */ jsxs12(Fragment5, { children: [
6870
+ /* @__PURE__ */ jsx17(
6792
6871
  MessageList,
6793
6872
  {
6794
6873
  items,
@@ -6798,12 +6877,12 @@ function ConversationView({
6798
6877
  hasMore,
6799
6878
  isLoadingMore: isLoading,
6800
6879
  onLoadMore: loadMore,
6801
- renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs11(Fragment5, { children: [
6802
- needsEmail && /* @__PURE__ */ jsx16(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
6803
- showStarters && /* @__PURE__ */ jsx16("div", { className: "hw-starters", children: starters?.map((entry, index) => {
6880
+ renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs12(Fragment5, { children: [
6881
+ needsEmail && /* @__PURE__ */ jsx17(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
6882
+ showStarters && /* @__PURE__ */ jsx17("div", { className: "hw-starters", children: starters?.map((entry, index) => {
6804
6883
  const question = typeof entry === "string" ? entry : entry.question;
6805
6884
  const label = typeof entry === "string" ? null : entry.label;
6806
- return /* @__PURE__ */ jsxs11(
6885
+ return /* @__PURE__ */ jsxs12(
6807
6886
  "button",
6808
6887
  {
6809
6888
  type: "button",
@@ -6813,11 +6892,11 @@ function ConversationView({
6813
6892
  void submit({ text: question });
6814
6893
  },
6815
6894
  children: [
6816
- /* @__PURE__ */ jsxs11("span", { className: "hw-starter-text", children: [
6817
- /* @__PURE__ */ jsx16("span", { className: "hw-starter-k", children: label ?? question }),
6818
- label && /* @__PURE__ */ jsx16("span", { className: "hw-starter-q", children: question })
6895
+ /* @__PURE__ */ jsxs12("span", { className: "hw-starter-text", children: [
6896
+ /* @__PURE__ */ jsx17("span", { className: "hw-starter-k", children: label ?? question }),
6897
+ label && /* @__PURE__ */ jsx17("span", { className: "hw-starter-q", children: question })
6819
6898
  ] }),
6820
- /* @__PURE__ */ jsx16(ChevronRightIcon, { size: 14 })
6899
+ /* @__PURE__ */ jsx17(ChevronRightIcon, { size: 14 })
6821
6900
  ]
6822
6901
  },
6823
6902
  question
@@ -6826,10 +6905,10 @@ function ConversationView({
6826
6905
  ] }) : void 0
6827
6906
  }
6828
6907
  ),
6829
- isResolved && /* @__PURE__ */ jsx16(ResolvedBanner, { conversationId }),
6830
- sendError && /* @__PURE__ */ jsxs11("div", { className: "hw-send-error", children: [
6908
+ isResolved && /* @__PURE__ */ jsx17(ResolvedBanner, { conversationId }),
6909
+ sendError && /* @__PURE__ */ jsxs12("div", { className: "hw-send-error", children: [
6831
6910
  sendError,
6832
- /* @__PURE__ */ jsx16(
6911
+ /* @__PURE__ */ jsx17(
6833
6912
  "button",
6834
6913
  {
6835
6914
  type: "button",
@@ -6842,7 +6921,7 @@ function ConversationView({
6842
6921
  }
6843
6922
  )
6844
6923
  ] }),
6845
- /* @__PURE__ */ jsx16(
6924
+ /* @__PURE__ */ jsx17(
6846
6925
  Composer,
6847
6926
  {
6848
6927
  text,
@@ -6860,20 +6939,20 @@ function ConversationView({
6860
6939
  }
6861
6940
  function ResolvedBanner({ conversationId }) {
6862
6941
  const { client } = useWidgetContext();
6863
- const [csatRating, setCsatRating] = useState15(null);
6864
- const [csatSubmitted, setCsatSubmitted] = useState15(false);
6942
+ const [csatRating, setCsatRating] = useState16(null);
6943
+ const [csatSubmitted, setCsatSubmitted] = useState16(false);
6865
6944
  const handleCsat = (rating) => {
6866
6945
  setCsatRating(rating);
6867
6946
  setCsatSubmitted(true);
6868
6947
  client.widget.sendCsat.mutate({ conversationId, rating }).catch(() => {
6869
6948
  });
6870
6949
  };
6871
- return /* @__PURE__ */ jsxs11("div", { className: "hw-resolved", children: [
6872
- /* @__PURE__ */ jsx16("div", { className: "hw-resolved-text", children: t("widget.resolved_text") }),
6873
- !csatSubmitted ? /* @__PURE__ */ jsxs11("div", { className: "hw-csat", children: [
6874
- /* @__PURE__ */ jsx16("div", { className: "hw-csat-label", children: t("widget.csat_label") }),
6875
- /* @__PURE__ */ jsxs11("div", { className: "hw-csat-buttons", children: [
6876
- /* @__PURE__ */ jsx16(
6950
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-resolved", children: [
6951
+ /* @__PURE__ */ jsx17("div", { className: "hw-resolved-text", children: t("widget.resolved_text") }),
6952
+ !csatSubmitted ? /* @__PURE__ */ jsxs12("div", { className: "hw-csat", children: [
6953
+ /* @__PURE__ */ jsx17("div", { className: "hw-csat-label", children: t("widget.csat_label") }),
6954
+ /* @__PURE__ */ jsxs12("div", { className: "hw-csat-buttons", children: [
6955
+ /* @__PURE__ */ jsx17(
6877
6956
  "button",
6878
6957
  {
6879
6958
  type: "button",
@@ -6883,7 +6962,7 @@ function ResolvedBanner({ conversationId }) {
6883
6962
  children: "\u{1F44D}"
6884
6963
  }
6885
6964
  ),
6886
- /* @__PURE__ */ jsx16(
6965
+ /* @__PURE__ */ jsx17(
6887
6966
  "button",
6888
6967
  {
6889
6968
  type: "button",
@@ -6894,7 +6973,7 @@ function ResolvedBanner({ conversationId }) {
6894
6973
  }
6895
6974
  )
6896
6975
  ] })
6897
- ] }) : /* @__PURE__ */ jsx16("div", { className: "hw-csat-thanks", children: t("widget.csat_thanks") })
6976
+ ] }) : /* @__PURE__ */ jsx17("div", { className: "hw-csat-thanks", children: t("widget.csat_thanks") })
6898
6977
  ] });
6899
6978
  }
6900
6979
  function WhatsNewCard({
@@ -6907,34 +6986,34 @@ function WhatsNewCard({
6907
6986
  if (unseen.length === 0) return null;
6908
6987
  const display = unseen.slice(0, 3);
6909
6988
  const badgeFieldMap = new Map(announcementTabs.map((t2) => [t2.id, t2.display?.badgeField]));
6910
- return /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new", children: [
6911
- /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-header", children: [
6912
- /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
6913
- /* @__PURE__ */ jsxs11("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
6989
+ return /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new", children: [
6990
+ /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-header", children: [
6991
+ /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
6992
+ /* @__PURE__ */ jsxs12("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
6914
6993
  resolveLabel2("widget.view_all"),
6915
6994
  " \u2192"
6916
6995
  ] })
6917
6996
  ] }),
6918
- /* @__PURE__ */ jsx16("div", { className: "hw-whats-new-list", children: display.map((entry) => {
6997
+ /* @__PURE__ */ jsx17("div", { className: "hw-whats-new-list", children: display.map((entry) => {
6919
6998
  const badgeField = badgeFieldMap.get(entry.tabId);
6920
- return /* @__PURE__ */ jsxs11(
6999
+ return /* @__PURE__ */ jsxs12(
6921
7000
  "button",
6922
7001
  {
6923
7002
  type: "button",
6924
7003
  className: "hw-whats-new-item",
6925
7004
  onClick: () => onSelect(entry.slug, entry.tabId),
6926
7005
  children: [
6927
- badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-item-top", children: [
6928
- /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
6929
- entry.publishedAt && /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
7006
+ badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-item-top", children: [
7007
+ /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
7008
+ entry.publishedAt && /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
6930
7009
  ] }),
6931
- /* @__PURE__ */ jsxs11("div", { className: "hw-whats-new-item-title", children: [
7010
+ /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-item-title", children: [
6932
7011
  entry.title,
6933
- !badgeField && entry.publishedAt && /* @__PURE__ */ jsx16("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
7012
+ !badgeField && entry.publishedAt && /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
6934
7013
  ] }),
6935
7014
  entry.body && (() => {
6936
7015
  const clean = stripMarkdown(entry.body);
6937
- return /* @__PURE__ */ jsx16("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
7016
+ return /* @__PURE__ */ jsx17("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
6938
7017
  })()
6939
7018
  ]
6940
7019
  },
@@ -6967,10 +7046,10 @@ function styleInject(css, { insertAt } = {}) {
6967
7046
  }
6968
7047
 
6969
7048
  // src/themed/styles.css
6970
- 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');
7049
+ 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: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}\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-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-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');
6971
7050
 
6972
7051
  // src/helpway-widget.tsx
6973
- import { jsx as jsx17 } from "react/jsx-runtime";
7052
+ import { jsx as jsx18 } from "react/jsx-runtime";
6974
7053
  function HelpwayWidget({
6975
7054
  apiKey,
6976
7055
  apiUrl,
@@ -6992,7 +7071,7 @@ function HelpwayWidget({
6992
7071
  src
6993
7072
  }) {
6994
7073
  const resolvedApiUrl = apiUrl ?? (src ? src.replace(/\/widget\.js$/, "") : void 0);
6995
- return /* @__PURE__ */ jsx17(
7074
+ return /* @__PURE__ */ jsx18(
6996
7075
  SupportProvider,
6997
7076
  {
6998
7077
  apiKey,
@@ -7006,7 +7085,7 @@ function HelpwayWidget({
7006
7085
  onClose,
7007
7086
  onUnreadChange,
7008
7087
  theme,
7009
- children: /* @__PURE__ */ jsx17(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx17(
7088
+ children: /* @__PURE__ */ jsx18(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx18(
7010
7089
  DefaultWidget,
7011
7090
  {
7012
7091
  hideLauncher,
@@ -7020,14 +7099,14 @@ function HelpwayWidget({
7020
7099
  }
7021
7100
 
7022
7101
  // src/hooks/use-realtime.ts
7023
- import { useEffect as useEffect16, useRef as useRef16 } from "react";
7102
+ import { useEffect as useEffect17, useRef as useRef18 } from "react";
7024
7103
  function useRealtime(handler) {
7025
7104
  const { ws } = useWidgetContext();
7026
- const handlerRef = useRef16(handler);
7027
- useEffect16(() => {
7105
+ const handlerRef = useRef18(handler);
7106
+ useEffect17(() => {
7028
7107
  handlerRef.current = handler;
7029
7108
  });
7030
- useEffect16(() => {
7109
+ useEffect17(() => {
7031
7110
  return ws.onEvent((event) => handlerRef.current(event));
7032
7111
  }, [ws]);
7033
7112
  }