@sevenfold/setto-client 0.24.0 → 0.24.2

package/dist/setto-client.js

@@ -22035,6 +22035,8 @@ function EditModeShell({ children, themeStore, active }) {
 }
 const VISITOR_KEY = "setto-chat-visitor";
 const CLOSE_MS = 210;
+const MIN_COMPOSER_HEIGHT = 36;
+const MAX_COMPOSER_HEIGHT = 200;
 function visitorId() {
   try {
     const stored = window.localStorage.getItem(VISITOR_KEY);
@@ -22053,17 +22055,268 @@ function intro(locale, name) {
   return norwegian(locale) ? `Hei! Jeg er Barista, ${name ? `${name}s` : "nettstedets"} AI-assistent. Jeg svarer ut fra det teamet har delt her, og hjelper deg videre til dem når det trengs.` : `Hello! I’m Barista, the AI assistant for ${name ?? "this website"}. I answer from what the team has shared here and help you reach them when needed.`;
 }
 function contactTeam() {
-  const link = document.querySelector('a[href*="kontakt" i], a[href*="contact" i], a[href^="mailto:"]');
+  const link = document.querySelector(
+    'a[href*="kontakt" i], a[href*="contact" i], a[href^="mailto:"]'
+  );
   if (link) link.click();
   else window.location.hash = "kontakt";
 }
 function validColor(value, fallback) {
-  return value && (/^#[0-9a-f]{3,8}$/i.test(value) || /^rgb/.test(value)) ? value : fallback;
+  return value && (/^#[0-9a-f]{3,8}$/i.test(value) || /^rgba?\(/i.test(value)) ? value : fallback;
 }
 function chatPalette(colors) {
   const values = colors?.map((color) => color.value) ?? [];
-  const ink = values.find((value) => /^#(?:[0-2][0-9a-f]){3}$/i.test(value));
-  return { "--setto-chat-pale": validColor(values[0], "#F2EBDF"), "--setto-chat-paper": validColor(values[1], "#FAF6EE"), "--setto-chat-ink": validColor(ink, "#211711"), "--setto-chat-accent": validColor(values[values.length - 2] ?? values.at(-1), "#C4502A") };
+  return {
+    "--setto-chat-crema": validColor(values[0], "#F2EBDF"),
+    "--setto-chat-raised": validColor(values[1], "#FAF6EE"),
+    "--setto-chat-canvas": validColor(values[2], "#FFFFFF"),
+    "--setto-chat-ink": validColor(values[3], "#211711"),
+    "--setto-chat-accent": validColor(values.at(-2) ?? values.at(-1), "#C4502A")
+  };
+}
+function MenuIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "22", height: "22", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M4 7h16M4 12h16M4 17h16",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+function CloseIcon({ size = 22 }) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: size, height: size, "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M6 6l12 12M18 6L6 18",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2.25",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+function PlusIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "18", height: "18", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M12 5v14M5 12h14",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+function ArrowIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "18", height: "18", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M12 19V5M5 12l7-7 7 7",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinejoin: "round",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+function BaristaIcon() {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "20", height: "20", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M12 2.8c.65 5.25 3.95 8.55 9.2 9.2-5.25.65-8.55 3.95-9.2 9.2-.65-5.25-3.95-8.55-9.2-9.2 5.25-.65 8.55-3.95 9.2-9.2Z",
+      fill: "currentColor"
+    }
+  ) });
+}
+function SiteChatComposer({
+  value,
+  onChange,
+  onSubmit,
+  busy,
+  queued,
+  placeholder,
+  attachLabel,
+  sendLabel,
+  removeLabel,
+  locale,
+  attachments,
+  onAttach,
+  onRemoveAttachment
+}) {
+  const textareaRef = useRef(null);
+  const fileRef = useRef(null);
+  const [focused, setFocused] = useState(false);
+  useEffect(() => {
+    const textarea = textareaRef.current;
+    if (!textarea) return;
+    textarea.style.height = "auto";
+    const height = Math.min(
+      Math.max(textarea.scrollHeight, MIN_COMPOSER_HEIGHT),
+      MAX_COMPOSER_HEIGHT
+    );
+    textarea.style.height = `${height}px`;
+  }, [value]);
+  useEffect(() => {
+    if (!busy) textareaRef.current?.focus();
+  }, [busy]);
+  function send() {
+    if (!value.trim() && attachments.length === 0) return;
+    onSubmit();
+  }
+  function handleSubmit(event) {
+    event.preventDefault();
+    send();
+  }
+  function handleKeyDown(event) {
+    if (event.key === "Enter" && !event.shiftKey) {
+      event.preventDefault();
+      send();
+    }
+  }
+  const canSend = value.trim().length > 0 || attachments.length > 0;
+  const open = focused || value.length > 0 || attachments.length > 0;
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: `setto-chat__composer${open ? " is-open" : ""}`,
+      onSubmit: handleSubmit,
+      onPointerDown: (event) => {
+        if (event.target === event.currentTarget) textareaRef.current?.focus();
+      },
+      children: [
+        attachments.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "setto-chat__attachments", children: attachments.map((attachment, index) => /* @__PURE__ */ jsxs("li", { children: [
+          /* @__PURE__ */ jsx("img", { src: attachment.preview, alt: attachment.file.name }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onRemoveAttachment(index),
+              "aria-label": `${removeLabel} ${attachment.file.name}`,
+              children: /* @__PURE__ */ jsx(CloseIcon, { size: 12 })
+            }
+          )
+        ] }, `${attachment.file.name}-${attachment.preview}`)) }) : null,
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            ref: textareaRef,
+            lang: norwegian(locale) ? "nb" : "en",
+            spellCheck: true,
+            value,
+            onChange: (event) => onChange(event.target.value),
+            onKeyDown: handleKeyDown,
+            onFocus: () => setFocused(true),
+            onBlur: () => setFocused(false),
+            placeholder,
+            rows: 1,
+            maxLength: 1500
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "setto-chat__composer-tools", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: fileRef,
+              type: "file",
+              accept: "image/*",
+              multiple: true,
+              hidden: true,
+              onChange: (event) => {
+                const selected = Array.from(event.target.files ?? []);
+                event.target.value = "";
+                if (selected.length) onAttach(selected);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "setto-chat__attach",
+              onClick: () => fileRef.current?.click(),
+              disabled: busy,
+              "aria-label": attachLabel,
+              title: attachLabel,
+              children: /* @__PURE__ */ jsx(PlusIcon, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "submit",
+              className: `setto-chat__send${queued ? " is-queued" : ""}`,
+              disabled: !canSend,
+              "aria-busy": queued,
+              "aria-label": sendLabel,
+              children: /* @__PURE__ */ jsx(ArrowIcon, {})
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function useChatViewport(active, logRef) {
+  useEffect(() => {
+    if (!active) return;
+    const root = document.documentElement;
+    const body = document.body;
+    const visualViewport = window.visualViewport;
+    const savedScrollY = window.scrollY;
+    const previous = {
+      rootOverflow: root.style.overflow,
+      rootOverscroll: root.style.overscrollBehavior,
+      bodyPosition: body.style.position,
+      bodyTop: body.style.top,
+      bodyLeft: body.style.left,
+      bodyRight: body.style.right,
+      bodyWidth: body.style.width,
+      bodyOverflow: body.style.overflow
+    };
+    root.style.overflow = "hidden";
+    root.style.overscrollBehavior = "none";
+    body.style.position = "fixed";
+    body.style.top = `-${savedScrollY}px`;
+    body.style.left = "0";
+    body.style.right = "0";
+    body.style.width = "100%";
+    body.style.overflow = "hidden";
+    const update = () => {
+      const height = Math.round(visualViewport?.height ?? window.innerHeight);
+      const top = Math.round(visualViewport?.offsetTop ?? 0);
+      root.style.setProperty("--setto-chat-height", `${height}px`);
+      root.style.setProperty("--setto-chat-top", `${top}px`);
+      if (window.scrollY !== 0) window.scrollTo(0, 0);
+      window.requestAnimationFrame(() => {
+        const log = logRef.current;
+        if (log) log.scrollTop = log.scrollHeight;
+      });
+    };
+    update();
+    visualViewport?.addEventListener("resize", update);
+    visualViewport?.addEventListener("scroll", update);
+    window.addEventListener("orientationchange", update);
+    return () => {
+      visualViewport?.removeEventListener("resize", update);
+      visualViewport?.removeEventListener("scroll", update);
+      window.removeEventListener("orientationchange", update);
+      root.style.removeProperty("--setto-chat-height");
+      root.style.removeProperty("--setto-chat-top");
+      root.style.overflow = previous.rootOverflow;
+      root.style.overscrollBehavior = previous.rootOverscroll;
+      body.style.position = previous.bodyPosition;
+      body.style.top = previous.bodyTop;
+      body.style.left = previous.bodyLeft;
+      body.style.right = previous.bodyRight;
+      body.style.width = previous.bodyWidth;
+      body.style.overflow = previous.bodyOverflow;
+      window.scrollTo(0, savedScrollY);
+    };
+  }, [active, logRef]);
 }
 function SettoChat() {
   const { config } = useSetto();
@@ -22078,37 +22331,119 @@ function SettoChat() {
   const [draft, setDraft] = useState("");
   const [files, setFiles] = useState([]);
   const [sending, setSending] = useState(false);
+  const [queued, setQueued] = useState(false);
   const [loadingConversation, setLoadingConversation] = useState(false);
-  const [availability, setAvailability] = useState({ humanAvailable: false, avatarUrl: null });
+  const [availability, setAvailability] = useState({
+    humanAvailable: false,
+    avatarUrl: null
+  });
   const [leadOpen, setLeadOpen] = useState(false);
   const [leadStatus, setLeadStatus] = useState("idle");
-  const [lead, setLead] = useState({ name: "", email: "", phone: "", interest: "", consent: false });
+  const [lead, setLead] = useState({
+    name: "",
+    email: "",
+    phone: "",
+    interest: "",
+    consent: false
+  });
   const conversationId = useRef(null);
   const visitor = useRef(null);
   const logRef = useRef(null);
-  const fileInput = useRef(null);
+  const filesRef = useRef([]);
   const formId = useId();
   const palette = useMemo(() => chatPalette(config.brandColors), [config.brandColors]);
   useChatStyles();
+  useChatViewport(mounted, logRef);
   const locale = i18n.language || "no";
   const isNo = norwegian(locale);
   const siteName = settings?.displayName?.trim() || config.displayName?.trim() || null;
-  const labels = isNo ? { open: siteName ? `Åpne chat med ${siteName}` : "Åpne chat", close: "Lukk chatten", title: "Spør Barista", chats: "Chats", newChat: "Ny chat", disclosure: "AI-assistent · svarer fra nettstedets godkjente informasjon", placeholder: "Hva vil du spørre om?", send: "Send", sending: "Svarer …", attach: "Legg ved bilde", contact: "Kontakt teamet", followUp: "Be om oppfølging", followUpTitle: "La teamet følge opp", followUpDetail: "Legg igjen kontaktinformasjon hvis du vil at teamet skal følge opp denne samtalen.", name: "Navn", email: "E-post", phone: "Telefon", interest: "Hva vil du ha hjelp med?", consent: "Ja, teamet kan bruke opplysningene mine til å følge opp denne henvendelsen.", leadSend: "Send forespørsel", leadSent: "Takk — forespørselen er sendt til teamet.", leadFailed: "Kunne ikke lagre forespørselen. Prøv igjen eller kontakt teamet direkte.", leadConversation: "Still et spørsmål først, så kan vi knytte oppfølgingen til samtalen.", failed: "Jeg får ikke svart akkurat nå. Kontakt gjerne teamet direkte.", image: "Bilde", team: "Teamet", emptyChats: "Nye samtaler du starter her vises i denne listen." } : { open: siteName ? `Open chat with ${siteName}` : "Open chat", close: "Close chat", title: "Ask Barista", chats: "Chats", newChat: "New chat", disclosure: "AI assistant · answers from this website’s approved information", placeholder: "What would you like to ask?", send: "Send", sending: "Replying …", attach: "Attach image", contact: "Contact the team", followUp: "Ask for follow-up", followUpTitle: "Let the team follow up", followUpDetail: "Leave contact details if you want the team to follow up on this conversation.", name: "Name", email: "Email", phone: "Phone", interest: "What would you like help with?", consent: "Yes, the team may use my details to follow up on this enquiry.", leadSend: "Send request", leadSent: "Thanks — your request has been sent to the team.", leadFailed: "We could not save your request. Please try again or contact the team directly.", leadConversation: "Ask a question first so we can link the follow-up to this conversation.", failed: "I cannot reply right now. Please contact the team directly.", image: "Image", team: "The team", emptyChats: "New conversations you start here will appear in this list." };
-  const ensureVisitor = () => visitor.current ??= visitorId();
-  const loadChats = async () => {
+  const labels = isNo ? {
+    open: siteName ? `Åpne chat med ${siteName}` : "Åpne chat",
+    close: "Lukk chatten",
+    title: "Spør Barista",
+    chats: "Chats",
+    newChat: "Ny chat",
+    disclosure: "AI-assistent · svarer fra nettstedets godkjente informasjon",
+    placeholder: "Hva vil du spørre om?",
+    send: "Send melding",
+    sending: "Svarer …",
+    attach: "Legg ved bilde",
+    remove: "Fjern",
+    contact: "Kontakt teamet",
+    followUp: "Be om oppfølging",
+    followUpTitle: "La teamet følge opp",
+    followUpDetail: "Legg igjen kontaktinformasjon hvis du vil at teamet skal følge opp denne samtalen.",
+    name: "Navn",
+    email: "E-post",
+    phone: "Telefon",
+    interest: "Hva vil du ha hjelp med?",
+    consent: "Ja, teamet kan bruke opplysningene mine til å følge opp denne henvendelsen.",
+    leadSend: "Send forespørsel",
+    leadSent: "Takk — forespørselen er sendt til teamet.",
+    leadFailed: "Kunne ikke lagre forespørselen. Prøv igjen eller kontakt teamet direkte.",
+    leadConversation: "Still et spørsmål først, så kan vi knytte oppfølgingen til samtalen.",
+    failed: "Jeg får ikke svart akkurat nå. Kontakt gjerne teamet direkte.",
+    image: "Bilde",
+    team: "Teamet",
+    emptyChats: "Nye samtaler du starter her vises i denne listen."
+  } : {
+    open: siteName ? `Open chat with ${siteName}` : "Open chat",
+    close: "Close chat",
+    title: "Ask Barista",
+    chats: "Chats",
+    newChat: "New chat",
+    disclosure: "AI assistant · answers from this website’s approved information",
+    placeholder: "What would you like to ask?",
+    send: "Send message",
+    sending: "Replying …",
+    attach: "Attach image",
+    remove: "Remove",
+    contact: "Contact the team",
+    followUp: "Ask for follow-up",
+    followUpTitle: "Let the team follow up",
+    followUpDetail: "Leave contact details if you want the team to follow up on this conversation.",
+    name: "Name",
+    email: "Email",
+    phone: "Phone",
+    interest: "What would you like help with?",
+    consent: "Yes, the team may use my details to follow up on this enquiry.",
+    leadSend: "Send request",
+    leadSent: "Thanks — your request has been sent to the team.",
+    leadFailed: "We could not save your request. Please try again or contact the team directly.",
+    leadConversation: "Ask a question first so we can link the follow-up to this conversation.",
+    failed: "I cannot reply right now. Please contact the team directly.",
+    image: "Image",
+    team: "The team",
+    emptyChats: "New conversations you start here will appear in this list."
+  };
+  function ensureVisitor() {
+    return visitor.current ??= visitorId();
+  }
+  async function loadChats() {
     const id = visitor.current;
     if (!id) return;
     try {
-      const response = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/public?${new URLSearchParams({ visitorId: id })}`, { headers: { Accept: "application/json" } });
-      if (response.ok) setConversations((await response.json()).conversations);
+      const query = new URLSearchParams({ visitorId: id });
+      const response = await fetch(
+        `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/public?${query}`,
+        { headers: { Accept: "application/json" } }
+      );
+      if (response.ok) {
+        const body = await response.json();
+        setConversations(body.conversations);
+      }
     } catch {
     }
-  };
-  const loadConversation = async (id) => {
+  }
+  async function loadConversation(id) {
     const visitorIdValue = ensureVisitor();
     setLoadingConversation(true);
     try {
-      const response = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/${encodeURIComponent(id)}/public?${new URLSearchParams({ visitorId: visitorIdValue })}`, { headers: { Accept: "application/json" } });
+      const query = new URLSearchParams({ visitorId: visitorIdValue });
+      const response = await fetch(
+        `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/${encodeURIComponent(id)}/public?${query}`,
+        { headers: { Accept: "application/json" } }
+      );
       if (!response.ok) return;
       const next = await response.json();
       conversationId.current = next.conversationId;
@@ -22118,11 +22453,13 @@ function SettoChat() {
     } finally {
       setLoadingConversation(false);
     }
-  };
+  }
   useEffect(() => {
     if (window.location.pathname.startsWith("/setto")) return;
     let cancelled = false;
-    fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/settings/public`, { headers: { Accept: "application/json" } }).then(async (response) => response.ok ? await response.json() : null).then((next) => {
+    fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/settings/public`, {
+      headers: { Accept: "application/json" }
+    }).then(async (response) => response.ok ? await response.json() : null).then((next) => {
       if (!cancelled && next?.enabled) setSettings(next);
     }).catch(() => void 0);
     return () => {
@@ -22132,7 +22469,9 @@ function SettoChat() {
   useEffect(() => {
     if (!settings) return;
     let cancelled = false;
-    const refresh = () => fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/availability/public`, { headers: { Accept: "application/json" } }).then(async (response) => response.ok ? await response.json() : null).then((next) => {
+    const refresh = () => fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/availability/public`, {
+      headers: { Accept: "application/json" }
+    }).then(async (response) => response.ok ? await response.json() : null).then((next) => {
       if (!cancelled && next) setAvailability(next);
     }).catch(() => void 0);
     void refresh();
@@ -22143,18 +22482,40 @@ function SettoChat() {
     };
   }, [apiUrl, config.siteId, settings]);
   useEffect(() => {
-    if (mounted && messages.length === 0 && settings) setMessages([{ role: "assistant", content: intro(locale, settings.displayName ?? void 0) }]);
-  }, [mounted, messages.length, settings, locale]);
+    if (!mounted || !settings || conversationId.current) return;
+    const welcome = intro(locale, settings.displayName ?? void 0);
+    setMessages((current) => {
+      if (current.length === 0) return [{ role: "assistant", content: welcome }];
+      if (current.length === 1 && current[0]?.role === "assistant" && !current[0].id) {
+        return current[0].content === welcome ? current : [{ role: "assistant", content: welcome }];
+      }
+      return current;
+    });
+  }, [mounted, settings, locale]);
   useEffect(() => {
-    if (mounted) logRef.current?.scrollTo({ top: logRef.current.scrollHeight, behavior: "smooth" });
-  }, [messages, mounted, sending]);
-  useEffect(() => () => files.forEach((image) => URL.revokeObjectURL(image.preview)), [files]);
+    if (!mounted) return;
+    const log = logRef.current;
+    if (log) log.scrollTo({ top: log.scrollHeight, behavior: sending ? "auto" : "smooth" });
+  }, [messages, mounted, sending, leadOpen]);
+  useEffect(() => {
+    filesRef.current = files;
+  }, [files]);
+  useEffect(
+    () => () => {
+      for (const image of filesRef.current) URL.revokeObjectURL(image.preview);
+    },
+    []
+  );
   useEffect(() => {
     if (!mounted || !conversationId.current || !visitor.current || sending) return;
     let cancelled = false;
     const refresh = async () => {
       try {
-        const response = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/${encodeURIComponent(conversationId.current)}/public?${new URLSearchParams({ visitorId: visitor.current })}`, { headers: { Accept: "application/json" } });
+        const query = new URLSearchParams({ visitorId: visitor.current });
+        const response = await fetch(
+          `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/conversations/${encodeURIComponent(conversationId.current)}/public?${query}`,
+          { headers: { Accept: "application/json" } }
+        );
         if (!response.ok || cancelled) return;
         const next = await response.json();
         if (!cancelled) setMessages(next.messages);
@@ -22167,53 +22528,122 @@ function SettoChat() {
       window.clearInterval(timer);
     };
   }, [apiUrl, config.siteId, mounted, sending]);
+  useEffect(() => {
+    if (!sending && queued) {
+      setQueued(false);
+      void sendTurn();
+    }
+  }, [sending, queued]);
+  useEffect(() => {
+    if (!mounted) return;
+    const closeOnEscape = (event) => {
+      if (event.key === "Escape") hide();
+    };
+    window.addEventListener("keydown", closeOnEscape);
+    return () => window.removeEventListener("keydown", closeOnEscape);
+  }, [mounted]);
   if (!settings || window.location.pathname.startsWith("/setto")) return null;
-  const show = () => {
+  function show() {
     setMounted(true);
     window.requestAnimationFrame(() => setVisible(true));
     ensureVisitor();
     void loadChats();
-  };
-  const hide = () => {
+  }
+  function hide() {
+    if (document.activeElement instanceof HTMLElement) document.activeElement.blur();
     setVisible(false);
     window.setTimeout(() => {
       setMounted(false);
       setDrawer(false);
     }, CLOSE_MS);
-  };
-  const startNew = () => {
+  }
+  function clearPendingFiles() {
+    setFiles((current) => {
+      for (const image of current) URL.revokeObjectURL(image.preview);
+      return [];
+    });
+  }
+  function startNew() {
     conversationId.current = null;
-    setMessages([{ role: "assistant", content: intro(locale, settings.displayName ?? void 0) }]);
+    setMessages([{ role: "assistant", content: intro(locale, settings?.displayName ?? void 0) }]);
+    setDraft("");
+    setQueued(false);
     setLeadOpen(false);
     setDrawer(false);
-    setFiles([]);
-  };
-  const submit = async (event) => {
-    event.preventDefault();
+    clearPendingFiles();
+  }
+  function addFiles(selected) {
+    setFiles((current) => {
+      const available = Math.max(0, 4 - current.length);
+      const accepted = selected.filter((file) => file.type.startsWith("image/")).slice(0, available).map((file) => ({ file, preview: URL.createObjectURL(file) }));
+      return [...current, ...accepted];
+    });
+  }
+  function removeFile(index) {
+    setFiles((current) => {
+      const removed = current[index];
+      if (removed) URL.revokeObjectURL(removed.preview);
+      return current.filter((_, itemIndex) => itemIndex !== index);
+    });
+  }
+  function queueOrSend() {
+    if (!draft.trim() && files.length === 0) return;
+    if (sending) {
+      setQueued(true);
+      return;
+    }
+    void sendTurn();
+  }
+  async function sendTurn() {
     const content = draft.trim();
-    if (!content && !files.length || sending) return;
+    const turnFiles = files;
+    if (!content && turnFiles.length === 0) return;
     setDraft("");
+    setFiles([]);
     setSending(true);
     const visitorIdValue = ensureVisitor();
     try {
       const uploaded = [];
-      for (const image of files) {
-        const file = image.file;
+      for (const image of turnFiles) {
         const form = new FormData();
         form.set("visitorId", visitorIdValue);
         if (conversationId.current) form.set("conversationId", conversationId.current);
         form.set("locale", locale);
         form.set("page", window.location.href);
-        form.set("file", file, file.name);
-        const response2 = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/attachments`, { method: "POST", body: form });
+        form.set("file", image.file, image.file.name);
+        const response2 = await fetch(
+          `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/attachments`,
+          { method: "POST", body: form }
+        );
         if (!response2.ok) throw new Error("image_upload_failed");
         const body = await response2.json();
         conversationId.current = body.conversationId;
         uploaded.push(body.attachment);
       }
-      setFiles([]);
-      setMessages((previous) => [...previous, { role: "visitor", content: content || `[${labels.image}]`, attachments: uploaded }, { role: "assistant", content: "" }]);
-      const response = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/messages`, { method: "POST", headers: { "Content-Type": "application/json", Accept: "text/plain, application/json" }, body: JSON.stringify({ conversationId: conversationId.current ?? void 0, visitorId: visitorIdValue, locale, page: window.location.href, message: content || void 0, attachmentIds: uploaded.map((attachment) => attachment.id) }) });
+      setMessages((previous) => [
+        ...previous,
+        {
+          role: "visitor",
+          content: content || `[${labels.image}]`,
+          attachments: uploaded
+        },
+        { role: "assistant", content: "" }
+      ]);
+      const response = await fetch(
+        `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/messages`,
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json", Accept: "text/plain, application/json" },
+          body: JSON.stringify({
+            conversationId: conversationId.current ?? void 0,
+            visitorId: visitorIdValue,
+            locale,
+            page: window.location.href,
+            message: content || void 0,
+            attachmentIds: uploaded.map((attachment) => attachment.id)
+          })
+        }
+      );
       const headerConversation = response.headers.get("X-Setto-Conversation");
       if (headerConversation) conversationId.current = headerConversation;
       if (!response.ok) throw new Error(`chat_failed_${response.status}`);
@@ -22233,16 +22663,19 @@ function SettoChat() {
           setMessages((previous) => replaceLastAssistant(previous, answer));
         }
         answer += decoder.decode();
-        if (!answer.trim()) setMessages((previous) => replaceLastAssistant(previous, labels.failed));
+        if (!answer.trim()) {
+          setMessages((previous) => replaceLastAssistant(previous, labels.failed));
+        }
       }
       void loadChats();
     } catch {
       setMessages((previous) => replaceLastAssistant(previous, labels.failed));
     } finally {
+      for (const image of turnFiles) URL.revokeObjectURL(image.preview);
       setSending(false);
     }
-  };
-  const submitLead = async (event) => {
+  }
+  async function submitLead(event) {
     event.preventDefault();
     if (leadStatus === "sending" || !conversationId.current || !visitor.current) {
       setLeadStatus("failed");
@@ -22250,109 +22683,284 @@ function SettoChat() {
     }
     setLeadStatus("sending");
     try {
-      const response = await fetch(`${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/leads`, { method: "POST", headers: { "Content-Type": "application/json", Accept: "application/json" }, body: JSON.stringify({ conversationId: conversationId.current, visitorId: visitor.current, consent: lead.consent, name: lead.name.trim() || void 0, email: lead.email.trim() || void 0, phone: lead.phone.trim() || void 0, interest: lead.interest.trim() || void 0 }) });
+      const response = await fetch(
+        `${apiUrl}/sites/${encodeURIComponent(config.siteId)}/chat/leads`,
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json", Accept: "application/json" },
+          body: JSON.stringify({
+            conversationId: conversationId.current,
+            visitorId: visitor.current,
+            consent: lead.consent,
+            name: lead.name.trim() || void 0,
+            email: lead.email.trim() || void 0,
+            phone: lead.phone.trim() || void 0,
+            interest: lead.interest.trim() || void 0
+          })
+        }
+      );
       if (!response.ok) throw new Error("lead_failed");
       setLeadStatus("sent");
     } catch {
       setLeadStatus("failed");
     }
-  };
-  return /* @__PURE__ */ jsxs("aside", { className: `setto-chat${mounted ? " setto-chat--mounted" : ""}${visible ? " setto-chat--visible" : ""}`, style: palette, "aria-label": labels.title, "data-setto-ui": true, children: [
-    mounted ? /* @__PURE__ */ jsxs("section", { className: "setto-chat__shell", role: "dialog", "aria-modal": "true", "aria-labelledby": `${formId}-title`, children: [
-      /* @__PURE__ */ jsxs("nav", { className: `setto-chat__chats${drawer ? " setto-chat__chats--open" : ""}`, "aria-label": labels.chats, children: [
-        /* @__PURE__ */ jsxs("div", { className: "setto-chat__chats-heading", children: [
-          /* @__PURE__ */ jsx("span", { children: labels.chats }),
-          /* @__PURE__ */ jsx("button", { type: "button", onClick: startNew, "aria-label": labels.newChat, children: "＋" })
-        ] }),
-        /* @__PURE__ */ jsxs("button", { className: "setto-chat__new", type: "button", onClick: startNew, children: [
-          "＋ ",
-          labels.newChat
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "setto-chat__chat-list", children: conversations.length ? conversations.map((chat) => /* @__PURE__ */ jsxs("button", { className: `setto-chat__chat-row${conversationId.current === chat.id ? " is-active" : ""}`, type: "button", onClick: () => void loadConversation(chat.id), children: [
-          /* @__PURE__ */ jsx("span", { children: chat.preview }),
-          /* @__PURE__ */ jsx("time", { children: new Date(chat.lastActivityAt).toLocaleDateString(isNo ? "nb-NO" : "en-GB", { day: "numeric", month: "short" }) })
-        ] }, chat.id)) : /* @__PURE__ */ jsx("p", { children: labels.emptyChats }) })
-      ] }),
-      /* @__PURE__ */ jsxs("main", { className: "setto-chat__main", children: [
-        /* @__PURE__ */ jsxs("header", { className: "setto-chat__header", children: [
-          /* @__PURE__ */ jsx("button", { className: "setto-chat__round-button", type: "button", onClick: () => setDrawer((current) => !current), "aria-label": labels.chats, "aria-expanded": drawer, children: "☰" }),
-          /* @__PURE__ */ jsxs("div", { className: "setto-chat__brand", children: [
-            /* @__PURE__ */ jsx("h2", { id: `${formId}-title`, children: labels.title }),
-            /* @__PURE__ */ jsx("p", { children: siteName ?? "Barista" })
-          ] }),
-          /* @__PURE__ */ jsx("button", { className: "setto-chat__round-button", type: "button", onClick: hide, "aria-label": labels.close, children: "×" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "setto-chat__disclosure", children: [
-          /* @__PURE__ */ jsx("span", { children: "BARISTA" }),
-          /* @__PURE__ */ jsx("p", { children: labels.disclosure })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "setto-chat__log", ref: logRef, "aria-live": "polite", "aria-busy": loadingConversation, children: messages.map((item, index) => /* @__PURE__ */ jsxs("div", { className: `setto-chat__message setto-chat__message--${item.role}`, children: [
-          item.role === "human" ? /* @__PURE__ */ jsx("span", { className: "setto-chat__speaker", children: labels.team }) : null,
-          item.content || /* @__PURE__ */ jsx("span", { className: "setto-chat__typing", children: "···" }),
-          item.attachments?.map((attachment) => /* @__PURE__ */ jsx("a", { className: "setto-chat__image", href: attachment.url, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx("img", { src: attachment.url, alt: labels.image }) }, attachment.id))
-        ] }, item.id ?? `${item.role}-${index}`)) }),
-        /* @__PURE__ */ jsxs("div", { className: "setto-chat__actions", children: [
-          /* @__PURE__ */ jsxs("button", { type: "button", onClick: contactTeam, children: [
-            labels.contact,
-            " ",
-            /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "↗" })
-          ] }),
-          /* @__PURE__ */ jsx("button", { type: "button", onClick: () => {
-            setLeadOpen((value) => !value);
-            setLeadStatus("idle");
-          }, children: labels.followUp })
-        ] }),
-        leadOpen ? /* @__PURE__ */ jsxs("form", { className: "setto-chat__lead", onSubmit: submitLead, children: [
-          /* @__PURE__ */ jsx("strong", { children: labels.followUpTitle }),
-          /* @__PURE__ */ jsx("p", { children: labels.followUpDetail }),
-          /* @__PURE__ */ jsxs("div", { className: "setto-chat__lead-grid", children: [
-            /* @__PURE__ */ jsxs("label", { children: [
-              labels.name,
-              /* @__PURE__ */ jsx("input", { value: lead.name, maxLength: 160, onChange: (event) => setLead((current) => ({ ...current, name: event.target.value })) })
-            ] }),
-            /* @__PURE__ */ jsxs("label", { children: [
-              labels.email,
-              /* @__PURE__ */ jsx("input", { type: "email", value: lead.email, maxLength: 320, onChange: (event) => setLead((current) => ({ ...current, email: event.target.value })) })
-            ] }),
-            /* @__PURE__ */ jsxs("label", { children: [
-              labels.phone,
-              /* @__PURE__ */ jsx("input", { type: "tel", value: lead.phone, maxLength: 64, onChange: (event) => setLead((current) => ({ ...current, phone: event.target.value })) })
-            ] }),
-            /* @__PURE__ */ jsxs("label", { children: [
-              labels.interest,
-              /* @__PURE__ */ jsx("input", { value: lead.interest, maxLength: 500, onChange: (event) => setLead((current) => ({ ...current, interest: event.target.value })) })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("label", { className: "setto-chat__consent", children: [
-            /* @__PURE__ */ jsx("input", { type: "checkbox", checked: lead.consent, onChange: (event) => setLead((current) => ({ ...current, consent: event.target.checked })) }),
-            labels.consent
-          ] }),
-          leadStatus === "sent" ? /* @__PURE__ */ jsx("p", { className: "setto-chat__lead-success", children: labels.leadSent }) : null,
-          leadStatus === "failed" ? /* @__PURE__ */ jsx("p", { className: "setto-chat__lead-error", children: conversationId.current ? labels.leadFailed : labels.leadConversation }) : null,
-          leadStatus !== "sent" ? /* @__PURE__ */ jsx("button", { type: "submit", disabled: leadStatus === "sending" || !lead.consent || !lead.email.trim() && !lead.phone.trim(), children: leadStatus === "sending" ? labels.sending : labels.leadSend }) : null
-        ] }) : null,
-        /* @__PURE__ */ jsxs("form", { className: "setto-chat__composer", onSubmit: submit, children: [
-          files.length ? /* @__PURE__ */ jsx("div", { className: "setto-chat__previews", children: files.map((image, index) => /* @__PURE__ */ jsxs("span", { children: [
-            /* @__PURE__ */ jsx("img", { src: image.preview, alt: image.file.name }),
-            /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setFiles((current) => current.filter((_, itemIndex) => itemIndex !== index)), "aria-label": `Remove ${image.file.name}`, children: "×" })
-          ] }, `${image.file.name}-${index}`)) }) : null,
-          /* @__PURE__ */ jsxs("div", { className: "setto-chat__composer-row", children: [
-            /* @__PURE__ */ jsx("input", { ref: fileInput, className: "setto-chat__file", type: "file", accept: "image/jpeg,image/png,image/webp,image/gif", multiple: true, onChange: (event) => setFiles(Array.from(event.target.files ?? []).slice(0, 4).map((file) => ({ file, preview: URL.createObjectURL(file) }))) }),
-            /* @__PURE__ */ jsx("button", { className: "setto-chat__attach", type: "button", onClick: () => fileInput.current?.click(), "aria-label": labels.attach, children: "＋" }),
-            /* @__PURE__ */ jsx("label", { className: "setto-chat__sr", htmlFor: `${formId}-input`, children: labels.placeholder }),
-            /* @__PURE__ */ jsx("textarea", { id: `${formId}-input`, value: draft, rows: 1, maxLength: 1500, onChange: (event) => setDraft(event.target.value), placeholder: labels.placeholder, disabled: sending, onKeyDown: (event) => {
-              if (event.key === "Enter" && !event.shiftKey) {
-                event.preventDefault();
-                event.currentTarget.form?.requestSubmit();
-              }
-            } }),
-            /* @__PURE__ */ jsx("button", { className: "setto-chat__send", type: "submit", disabled: !draft.trim() && !files.length || sending, "aria-label": labels.send, children: sending ? "…" : "↑" })
-          ] })
-        ] })
-      ] })
-    ] }) : null,
-    !mounted ? /* @__PURE__ */ jsx("button", { className: "setto-chat__launcher", type: "button", onClick: show, "aria-label": labels.open, title: labels.open, children: availability.humanAvailable && availability.avatarUrl ? /* @__PURE__ */ jsx("img", { src: availability.avatarUrl, alt: "" }) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "✦" }) }) : null
-  ] });
+  }
+  return /* @__PURE__ */ jsxs(
+    "aside",
+    {
+      className: `setto-chat${mounted ? " setto-chat--mounted" : ""}${visible ? " setto-chat--visible" : ""}`,
+      style: palette,
+      "aria-label": labels.title,
+      "data-setto-ui": true,
+      children: [
+        mounted ? /* @__PURE__ */ jsxs(
+          "section",
+          {
+            className: "setto-chat__shell",
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-labelledby": `${formId}-title`,
+            children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  className: `setto-chat__scrim${drawer ? " is-open" : ""}`,
+                  type: "button",
+                  onClick: () => setDrawer(false),
+                  "aria-label": labels.close,
+                  tabIndex: drawer ? 0 : -1
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "nav",
+                {
+                  className: `setto-chat__chats${drawer ? " setto-chat__chats--open" : ""}`,
+                  "aria-label": labels.chats,
+                  children: [
+                    /* @__PURE__ */ jsxs("div", { className: "setto-chat__chats-heading", children: [
+                      /* @__PURE__ */ jsx("span", { children: labels.chats }),
+                      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setDrawer(false), "aria-label": labels.close, children: /* @__PURE__ */ jsx(CloseIcon, { size: 18 }) })
+                    ] }),
+                    /* @__PURE__ */ jsxs("button", { className: "setto-chat__new", type: "button", onClick: startNew, children: [
+                      /* @__PURE__ */ jsx(PlusIcon, {}),
+                      labels.newChat
+                    ] }),
+                    /* @__PURE__ */ jsx("div", { className: "setto-chat__chat-list", children: conversations.length ? conversations.map((chat) => /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        className: `setto-chat__chat-row${conversationId.current === chat.id ? " is-active" : ""}`,
+                        type: "button",
+                        onClick: () => void loadConversation(chat.id),
+                        children: [
+                          /* @__PURE__ */ jsx("span", { children: chat.preview }),
+                          /* @__PURE__ */ jsx("time", { children: new Date(chat.lastActivityAt).toLocaleDateString(
+                            isNo ? "nb-NO" : "en-GB",
+                            { day: "numeric", month: "short" }
+                          ) })
+                        ]
+                      },
+                      chat.id
+                    )) : /* @__PURE__ */ jsx("p", { children: labels.emptyChats }) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs("main", { className: "setto-chat__main", children: [
+                /* @__PURE__ */ jsxs("header", { className: "setto-chat__header", children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      className: "setto-chat__round-button",
+                      type: "button",
+                      onClick: () => setDrawer((current) => !current),
+                      "aria-label": labels.chats,
+                      "aria-expanded": drawer,
+                      children: /* @__PURE__ */ jsx(MenuIcon, {})
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("div", { className: "setto-chat__brand", children: [
+                    /* @__PURE__ */ jsx("h2", { id: `${formId}-title`, children: labels.title }),
+                    /* @__PURE__ */ jsx("p", { children: siteName ?? "Barista" })
+                  ] }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      className: "setto-chat__round-button",
+                      type: "button",
+                      onClick: hide,
+                      "aria-label": labels.close,
+                      children: /* @__PURE__ */ jsx(CloseIcon, {})
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "setto-chat__disclosure", children: [
+                  /* @__PURE__ */ jsx("span", { children: "BARISTA" }),
+                  /* @__PURE__ */ jsx("p", { children: labels.disclosure })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "setto-chat__body", children: [
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: "setto-chat__log",
+                      ref: logRef,
+                      "aria-live": "polite",
+                      "aria-busy": loadingConversation,
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: "setto-chat__message-list", children: messages.map((item, index) => /* @__PURE__ */ jsxs(
+                          "div",
+                          {
+                            className: `setto-chat__message setto-chat__message--${item.role}`,
+                            children: [
+                              item.role === "human" ? /* @__PURE__ */ jsx("span", { className: "setto-chat__speaker", children: labels.team }) : null,
+                              /* @__PURE__ */ jsx("span", { className: "setto-chat__message-copy", children: item.content || /* @__PURE__ */ jsx("span", { className: "setto-chat__typing", children: "···" }) }),
+                              item.attachments?.map((attachment) => /* @__PURE__ */ jsx(
+                                "a",
+                                {
+                                  className: "setto-chat__image",
+                                  href: attachment.url,
+                                  target: "_blank",
+                                  rel: "noreferrer",
+                                  children: /* @__PURE__ */ jsx("img", { src: attachment.url, alt: labels.image })
+                                },
+                                attachment.id
+                              ))
+                            ]
+                          },
+                          item.id ?? `${item.role}-${index}`
+                        )) }),
+                        /* @__PURE__ */ jsxs("div", { className: "setto-chat__actions", children: [
+                          /* @__PURE__ */ jsxs("button", { type: "button", onClick: contactTeam, children: [
+                            labels.contact,
+                            /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "↗" })
+                          ] }),
+                          /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "button",
+                              onClick: () => {
+                                setLeadOpen((value) => !value);
+                                setLeadStatus("idle");
+                              },
+                              "aria-expanded": leadOpen,
+                              children: labels.followUp
+                            }
+                          )
+                        ] }),
+                        leadOpen ? /* @__PURE__ */ jsxs("form", { className: "setto-chat__lead", onSubmit: submitLead, children: [
+                          /* @__PURE__ */ jsx("strong", { children: labels.followUpTitle }),
+                          /* @__PURE__ */ jsx("p", { children: labels.followUpDetail }),
+                          /* @__PURE__ */ jsxs("div", { className: "setto-chat__lead-grid", children: [
+                            /* @__PURE__ */ jsxs("label", { children: [
+                              labels.name,
+                              /* @__PURE__ */ jsx(
+                                "input",
+                                {
+                                  value: lead.name,
+                                  maxLength: 160,
+                                  onChange: (event) => setLead((current) => ({ ...current, name: event.target.value }))
+                                }
+                              )
+                            ] }),
+                            /* @__PURE__ */ jsxs("label", { children: [
+                              labels.email,
+                              /* @__PURE__ */ jsx(
+                                "input",
+                                {
+                                  type: "email",
+                                  value: lead.email,
+                                  maxLength: 320,
+                                  onChange: (event) => setLead((current) => ({ ...current, email: event.target.value }))
+                                }
+                              )
+                            ] }),
+                            /* @__PURE__ */ jsxs("label", { children: [
+                              labels.phone,
+                              /* @__PURE__ */ jsx(
+                                "input",
+                                {
+                                  type: "tel",
+                                  value: lead.phone,
+                                  maxLength: 64,
+                                  onChange: (event) => setLead((current) => ({ ...current, phone: event.target.value }))
+                                }
+                              )
+                            ] }),
+                            /* @__PURE__ */ jsxs("label", { children: [
+                              labels.interest,
+                              /* @__PURE__ */ jsx(
+                                "input",
+                                {
+                                  value: lead.interest,
+                                  maxLength: 500,
+                                  onChange: (event) => setLead((current) => ({ ...current, interest: event.target.value }))
+                                }
+                              )
+                            ] })
+                          ] }),
+                          /* @__PURE__ */ jsxs("label", { className: "setto-chat__consent", children: [
+                            /* @__PURE__ */ jsx(
+                              "input",
+                              {
+                                type: "checkbox",
+                                checked: lead.consent,
+                                onChange: (event) => setLead((current) => ({ ...current, consent: event.target.checked }))
+                              }
+                            ),
+                            labels.consent
+                          ] }),
+                          leadStatus === "sent" ? /* @__PURE__ */ jsx("p", { className: "setto-chat__lead-success", children: labels.leadSent }) : null,
+                          leadStatus === "failed" ? /* @__PURE__ */ jsx("p", { className: "setto-chat__lead-error", children: conversationId.current ? labels.leadFailed : labels.leadConversation }) : null,
+                          leadStatus !== "sent" ? /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "submit",
+                              disabled: leadStatus === "sending" || !lead.consent || !lead.email.trim() && !lead.phone.trim(),
+                              children: leadStatus === "sending" ? labels.sending : labels.leadSend
+                            }
+                          ) : null
+                        ] }) : null
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("div", { className: "setto-chat__composer-shell", children: [
+                    /* @__PURE__ */ jsx(
+                      SiteChatComposer,
+                      {
+                        value: draft,
+                        onChange: setDraft,
+                        onSubmit: queueOrSend,
+                        busy: sending,
+                        queued,
+                        placeholder: labels.placeholder,
+                        attachLabel: labels.attach,
+                        sendLabel: labels.send,
+                        removeLabel: labels.remove,
+                        locale,
+                        attachments: files,
+                        onAttach: addFiles,
+                        onRemoveAttachment: removeFile
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("div", { className: "setto-chat__composer-floor", "aria-hidden": "true" })
+                  ] })
+                ] })
+              ] })
+            ]
+          }
+        ) : null,
+        !mounted ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: "setto-chat__launcher",
+            type: "button",
+            onClick: show,
+            "aria-label": labels.open,
+            title: labels.open,
+            children: availability.humanAvailable && availability.avatarUrl ? /* @__PURE__ */ jsx("img", { src: availability.avatarUrl, alt: "" }) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: /* @__PURE__ */ jsx(BaristaIcon, {}) })
+          }
+        ) : null
+      ]
+    }
+  );
 }
 function replaceLastAssistant(messages, content) {
   for (let index = messages.length - 1; index >= 0; index -= 1) {
@@ -22370,14 +22978,14 @@ function useChatStyles() {
     const style = document.createElement("style");
     style.dataset.settoChat = "";
     style.textContent = `
-.setto-chat{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:2147483000;color:var(--setto-chat-ink);font-family:Archivo,ui-sans-serif,sans-serif}.setto-chat *,.setto-chat *::before,.setto-chat *::after{box-sizing:border-box}.setto-chat--mounted{inset:0;right:0;bottom:0;width:100vw;height:100dvh;background:color-mix(in srgb,var(--setto-chat-paper) 88%,transparent);backdrop-filter:blur(8px);opacity:0;transition:opacity ${CLOSE_MS}ms ease}.setto-chat--visible{opacity:1}.setto-chat__shell{width:100%;height:100%;display:flex;overflow:hidden;opacity:0;transform:translateY(14px) scale(.992);transition:opacity ${CLOSE_MS}ms ease,transform ${CLOSE_MS}ms cubic-bezier(.2,.8,.2,1);background:var(--setto-chat-paper)}.setto-chat--visible .setto-chat__shell{opacity:1;transform:none}
-.setto-chat__chats{width:274px;flex:0 0 274px;padding:calc(25px + env(safe-area-inset-top)) 14px 22px;background:color-mix(in srgb,var(--setto-chat-pale) 72%,white);border-right:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);display:flex;flex-direction:column;gap:18px}.setto-chat__chats-heading{padding:0 7px;display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.setto-chat__chats-heading button{border:0;background:transparent;font-size:22px;cursor:pointer;color:var(--setto-chat-ink)}.setto-chat__new{border:1px solid color-mix(in srgb,var(--setto-chat-ink) 18%,transparent);border-radius:14px;padding:11px 13px;background:rgba(255,255,255,.45);color:var(--setto-chat-ink);font:600 13px Archivo,sans-serif;text-align:left;cursor:pointer}.setto-chat__chat-list{display:grid;gap:5px;overflow:auto}.setto-chat__chat-list p{margin:7px;padding:0;color:color-mix(in srgb,var(--setto-chat-ink) 57%,transparent);font-size:12px;line-height:1.45}.setto-chat__chat-row{border:0;border-radius:11px;padding:10px;background:transparent;color:var(--setto-chat-ink);display:grid;gap:4px;text-align:left;cursor:pointer}.setto-chat__chat-row:hover,.setto-chat__chat-row.is-active{background:color-mix(in srgb,var(--setto-chat-paper) 75%,transparent)}.setto-chat__chat-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 13px Archivo,sans-serif}.setto-chat__chat-row time{font-size:11px;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent)}
-.setto-chat__main{min-width:0;flex:1;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto auto;background:var(--setto-chat-paper)}.setto-chat__header{min-height:86px;padding:calc(14px + env(safe-area-inset-top)) 26px 12px;display:grid;grid-template-columns:46px 1fr 46px;align-items:center;border-bottom:1px solid color-mix(in srgb,var(--setto-chat-ink) 10%,transparent)}.setto-chat__round-button{width:46px;height:46px;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 11%,transparent);border-radius:50%;background:color-mix(in srgb,var(--setto-chat-paper) 72%,white);color:var(--setto-chat-ink);font:500 23px/1 Archivo,sans-serif;cursor:pointer}.setto-chat__brand{text-align:center}.setto-chat__brand h2{margin:0;font:400 26px/1.05 "Instrument Serif",Georgia,serif;letter-spacing:-.025em}.setto-chat__brand p{margin:3px 0 0;color:color-mix(in srgb,var(--setto-chat-ink) 57%,transparent);font-size:12px}.setto-chat__disclosure{padding:14px max(32px,6vw) 6px;display:flex;align-items:baseline;gap:10px}.setto-chat__disclosure span{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--setto-chat-accent)}.setto-chat__disclosure p{margin:0;color:color-mix(in srgb,var(--setto-chat-ink) 60%,transparent);font-size:12px}
-.setto-chat__log{min-height:0;overflow:auto;padding:28px max(32px,10vw);display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}.setto-chat__message{max-width:min(620px,82%);padding:14px 16px;border-radius:18px;font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.setto-chat__message--assistant{align-self:flex-start;background:color-mix(in srgb,var(--setto-chat-pale) 82%,white);border-bottom-left-radius:4px}.setto-chat__message--visitor{align-self:flex-end;background:var(--setto-chat-ink);color:var(--setto-chat-paper);border-bottom-right-radius:4px}.setto-chat__message--human{align-self:flex-start;background:color-mix(in srgb,var(--setto-chat-accent) 20%,var(--setto-chat-paper));border-bottom-left-radius:4px}.setto-chat__message--system{align-self:center;padding:3px 10px;background:transparent;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent);font-size:12px;text-align:center}.setto-chat__speaker{display:block;margin-bottom:4px;color:var(--setto-chat-accent);font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.setto-chat__typing{animation:setto-chat-pulse 1s ease-in-out infinite}.setto-chat__image{display:block;margin-top:9px;overflow:hidden;border-radius:11px}.setto-chat__image img{display:block;width:min(280px,100%);max-height:260px;object-fit:cover}
-.setto-chat__actions{padding:8px max(30px,6vw) 11px;display:flex;gap:20px}.setto-chat__actions button{border:0;background:transparent;color:var(--setto-chat-accent);font:700 13px Archivo,sans-serif;cursor:pointer}.setto-chat__lead{margin:0 max(30px,6vw) 10px;padding:16px;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 13%,transparent);border-radius:16px;background:color-mix(in srgb,var(--setto-chat-pale) 55%,white);display:grid;gap:9px}.setto-chat__lead strong{font-size:15px}.setto-chat__lead p{margin:0;color:color-mix(in srgb,var(--setto-chat-ink) 65%,transparent);font-size:12px;line-height:1.4}.setto-chat__lead-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.setto-chat__lead label{display:grid;gap:4px;font-size:11px;font-weight:700}.setto-chat__lead input{min-width:0;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 18%,transparent);border-radius:8px;padding:8px;background:var(--setto-chat-paper);color:var(--setto-chat-ink);font:13px Archivo,sans-serif}.setto-chat__consent{display:flex!important;grid-template-columns:auto 1fr;align-items:start;font-weight:400!important;line-height:1.35}.setto-chat__lead>button{justify-self:start;border:0;border-radius:9px;padding:9px 12px;background:var(--setto-chat-accent);color:white;font:700 12px Archivo,sans-serif;cursor:pointer}.setto-chat__lead-success{color:#28633d!important;font-weight:700}.setto-chat__lead-error{color:#a33024!important;font-weight:700}
-.setto-chat__composer{padding:0 max(24px,6vw) max(17px,env(safe-area-inset-bottom));background:var(--setto-chat-paper)}.setto-chat__composer-row{min-height:78px;padding:12px 14px;display:grid;grid-template-columns:36px 1fr 44px;gap:8px;align-items:end;border:1.5px solid color-mix(in srgb,var(--setto-chat-accent) 80%,var(--setto-chat-ink));border-radius:25px;background:color-mix(in srgb,var(--setto-chat-paper) 82%,white);box-shadow:0 9px 26px color-mix(in srgb,var(--setto-chat-ink) 8%,transparent)}.setto-chat__composer textarea{width:100%;min-height:38px;max-height:100px;resize:none;border:0;background:transparent;color:var(--setto-chat-ink);padding:8px 0;font:15px/1.4 Archivo,sans-serif;outline:none}.setto-chat__composer textarea::placeholder{color:color-mix(in srgb,var(--setto-chat-ink) 45%,transparent)}.setto-chat__file,.setto-chat__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.setto-chat__attach{width:32px;height:32px;align-self:end;border:0;border-radius:50%;background:transparent;color:color-mix(in srgb,var(--setto-chat-ink) 70%,transparent);font-size:28px;line-height:1;cursor:pointer}.setto-chat__send{width:44px;height:44px;border:0;border-radius:50%;background:color-mix(in srgb,var(--setto-chat-accent) 36%,var(--setto-chat-paper));color:var(--setto-chat-accent);font:400 27px/1 Georgia,serif;cursor:pointer}.setto-chat__send:disabled{opacity:.45;cursor:default}.setto-chat__previews{display:flex;gap:8px;padding:0 10px 8px}.setto-chat__previews span{position:relative;width:42px;height:42px}.setto-chat__previews img{display:block;width:42px;height:42px;object-fit:cover;border-radius:9px}.setto-chat__previews button{position:absolute;right:-5px;top:-5px;width:17px;height:17px;border:0;border-radius:50%;background:var(--setto-chat-ink);color:white;line-height:15px;cursor:pointer}
-.setto-chat__launcher{width:58px;height:58px;padding:3px;border:1px solid rgba(255,255,255,.54);border-radius:50%;background:color-mix(in srgb,var(--setto-chat-paper) 35%,transparent);box-shadow:0 10px 30px color-mix(in srgb,var(--setto-chat-ink) 24%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--setto-chat-ink) 9%,transparent);backdrop-filter:blur(14px) saturate(1.15);color:var(--setto-chat-ink);display:grid;place-items:center;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.setto-chat__launcher:hover{transform:translateY(-2px);box-shadow:0 15px 35px color-mix(in srgb,var(--setto-chat-ink) 28%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--setto-chat-ink) 9%,transparent)}.setto-chat__launcher span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--setto-chat-accent);color:var(--setto-chat-paper);font-size:19px}.setto-chat__launcher img{width:50px;height:50px;border-radius:50%;object-fit:cover}.setto-chat__launcher:focus-visible,.setto-chat button:focus-visible,.setto-chat textarea:focus-visible,.setto-chat input:focus-visible{outline:3px solid color-mix(in srgb,var(--setto-chat-accent) 45%,white);outline-offset:3px}@keyframes setto-chat-pulse{50%{opacity:.35}}
-@media(max-width:700px){.setto-chat__chats{position:absolute;z-index:2;top:0;bottom:0;left:0;transform:translateX(-104%);transition:transform ${CLOSE_MS}ms ease;box-shadow:14px 0 35px color-mix(in srgb,var(--setto-chat-ink) 16%,transparent)}.setto-chat__chats--open{transform:none}.setto-chat__header{padding-left:16px;padding-right:16px}.setto-chat__disclosure{padding:13px 20px 5px}.setto-chat__log{padding:24px 20px}.setto-chat__message{max-width:91%;font-size:14px}.setto-chat__actions{padding-left:20px;padding-right:20px;gap:15px}.setto-chat__composer{padding-left:14px;padding-right:14px}.setto-chat__lead{margin-left:20px;margin-right:20px}.setto-chat__lead-grid{grid-template-columns:1fr}.setto-chat__round-button{width:42px;height:42px}.setto-chat__brand h2{font-size:24px}}@media(prefers-reduced-motion:reduce){.setto-chat,.setto-chat__shell,.setto-chat__chats,.setto-chat__launcher{transition:none!important}.setto-chat__typing{animation:none}}
+.setto-chat{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:2147483000;color:var(--setto-chat-ink);font-family:"Archivo Variable",Archivo,system-ui,sans-serif;-webkit-font-smoothing:antialiased}.setto-chat *,.setto-chat *::before,.setto-chat *::after{box-sizing:border-box}.setto-chat button,.setto-chat input,.setto-chat textarea{font:inherit}.setto-chat--mounted{top:var(--setto-chat-top,0);right:auto;bottom:auto;left:0;width:100vw;height:var(--setto-chat-height,100svh);overflow:hidden;background:var(--setto-chat-canvas);opacity:0;transition:opacity ${CLOSE_MS}ms ease}.setto-chat--visible{opacity:1}.setto-chat__shell{position:relative;width:100%;height:100%;display:flex;overflow:hidden;background:var(--setto-chat-canvas);opacity:0;transform:translateY(12px) scale(.994);transform-origin:center bottom;transition:opacity ${CLOSE_MS}ms ease,transform ${CLOSE_MS}ms cubic-bezier(.16,1,.3,1)}.setto-chat--visible .setto-chat__shell{opacity:1;transform:none}
+.setto-chat__scrim{position:absolute;inset:0;z-index:45;border:0;background:rgba(33,23,17,.32);opacity:0;pointer-events:none;transition:opacity 220ms ease}.setto-chat__scrim.is-open{opacity:1;pointer-events:auto}.setto-chat__chats{position:relative;z-index:50;width:min(84vw,280px);height:100%;flex:0 0 280px;padding:1rem .85rem calc(1rem + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:.9rem;background:color-mix(in srgb,var(--setto-chat-crema) 32%,var(--setto-chat-canvas));border-right:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);overflow:hidden}.setto-chat__chats-heading{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:34px;font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--setto-chat-ink) 58%,transparent)}.setto-chat__chats-heading button{width:34px;height:34px;padding:0;border:0;border-radius:8px;background:transparent;color:color-mix(in srgb,var(--setto-chat-ink) 58%,transparent);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.setto-chat__new{display:flex;align-items:center;gap:.55rem;width:100%;padding:.5rem .55rem;border:0;border-radius:8px;background:transparent;color:var(--setto-chat-ink);font-weight:600;font-size:.9rem;text-align:left;cursor:pointer;transition:background 140ms ease}.setto-chat__new:hover{background:color-mix(in srgb,var(--setto-chat-ink) 5%,transparent)}.setto-chat__chat-list{display:flex;flex-direction:column;gap:.1rem;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;margin-right:-.85rem;padding-right:.3rem}.setto-chat__chat-list p{margin:.35rem .55rem;font-size:.85rem;line-height:1.5;color:color-mix(in srgb,var(--setto-chat-ink) 58%,transparent)}.setto-chat__chat-row{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.4rem;padding:.55rem;border:0;border-radius:8px;background:transparent;color:var(--setto-chat-ink);text-align:left;cursor:pointer}.setto-chat__chat-row:hover,.setto-chat__chat-row.is-active{background:color-mix(in srgb,var(--setto-chat-ink) 7.5%,transparent)}.setto-chat__chat-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;font-weight:600}.setto-chat__chat-row time{font-size:.72rem;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent)}
+.setto-chat__main{position:relative;z-index:1;display:flex;flex:1;min-width:0;max-width:820px;height:100%;margin:0 auto;flex-direction:column;background:var(--setto-chat-canvas)}.setto-chat__header{position:relative;z-index:30;min-height:58px;padding:.35rem .75rem;display:flex;align-items:center;gap:.5rem;flex:0 0 auto;background:transparent;isolation:isolate}.setto-chat__header::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:color-mix(in srgb,var(--setto-chat-crema) 70%,transparent);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 45%,rgba(0,0,0,.45) 78%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 45%,rgba(0,0,0,.45) 78%,rgba(0,0,0,0) 100%)}.setto-chat__round-button{flex:none;width:46px;height:46px;padding:0;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);border-radius:50%;background:var(--setto-chat-raised);color:var(--setto-chat-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background 160ms ease,border-color 160ms ease,color 160ms ease}.setto-chat__round-button:hover{background:var(--setto-chat-crema);border-color:var(--setto-chat-accent);color:var(--setto-chat-accent)}.setto-chat__round-button:active{transform:scale(.96)}.setto-chat__brand{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;line-height:1.15;text-align:center}.setto-chat__brand h2{margin:0;color:var(--setto-chat-ink);font-size:1.02rem;font-weight:600;line-height:1.15}.setto-chat__brand p{max-width:100%;margin:2px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:color-mix(in srgb,var(--setto-chat-ink) 56%,transparent);font-size:.78rem;line-height:1.15}.setto-chat__disclosure{display:flex;align-items:baseline;gap:.65rem;padding:.9rem .75rem .35rem;flex:0 0 auto}.setto-chat__disclosure span{flex:none;color:var(--setto-chat-accent);font-size:.68rem;font-weight:700;letter-spacing:.12em}.setto-chat__disclosure p{margin:0;color:color-mix(in srgb,var(--setto-chat-ink) 62%,transparent);font-size:.9rem;line-height:1.45}
+.setto-chat__body{position:relative;display:flex;flex:1 1 auto;min-height:0;flex-direction:column}.setto-chat__log{display:flex;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;flex-direction:column;padding:1.3rem .75rem 8rem;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.setto-chat__message-list{display:flex;flex-direction:column}.setto-chat__message{display:block;margin-bottom:1.5rem;font-size:16px;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap;color:color-mix(in srgb,var(--setto-chat-ink) 88%,transparent)}.setto-chat__message--assistant{align-self:stretch;max-width:100%;padding:0;background:transparent}.setto-chat__message--visitor{align-self:flex-end;max-width:85%;margin-bottom:1.25rem;padding:.65rem .95rem;background:var(--setto-chat-crema);color:var(--setto-chat-ink);border:1px solid color-mix(in srgb,var(--setto-chat-ink) 7%,transparent);border-radius:20px 20px 4px 20px;font-size:.95rem;line-height:1.55;box-shadow:0 1px 2px color-mix(in srgb,var(--setto-chat-ink) 6%,transparent)}.setto-chat__message--human{align-self:stretch;max-width:100%;padding-left:.8rem;border-left:2px solid var(--setto-chat-accent)}.setto-chat__message--system{align-self:center;max-width:85%;padding:.25rem .6rem;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent);font-size:.78rem;line-height:1.45;text-align:center}.setto-chat__speaker{display:block;margin-bottom:.15rem;color:var(--setto-chat-accent);font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.setto-chat__typing{display:inline-block;animation:setto-chat-pulse 1s ease-in-out infinite}.setto-chat__image{display:block;width:max-content;max-width:100%;margin-top:.65rem;overflow:hidden;border-radius:14px;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 10%,transparent)}.setto-chat__image img{display:block;width:min(280px,100%);max-height:260px;object-fit:cover}
+.setto-chat__actions{display:flex;flex-wrap:wrap;gap:1.35rem;margin-top:auto;padding:1.2rem 0 .65rem}.setto-chat__actions button{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem 0;border:0;background:transparent;color:var(--setto-chat-accent);font-size:.9rem;font-weight:700;cursor:pointer}.setto-chat__lead{display:grid;gap:.6rem;margin:.5rem 0 1rem;padding:1rem;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);border-radius:16px;background:color-mix(in srgb,var(--setto-chat-crema) 58%,var(--setto-chat-canvas))}.setto-chat__lead strong{font-size:.95rem}.setto-chat__lead p{margin:0;color:color-mix(in srgb,var(--setto-chat-ink) 65%,transparent);font-size:.8rem;line-height:1.45}.setto-chat__lead-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.setto-chat__lead label{display:grid;gap:.25rem;font-size:.72rem;font-weight:700}.setto-chat__lead input{min-width:0;padding:.55rem .6rem;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 18%,transparent);border-radius:8px;background:var(--setto-chat-canvas);color:var(--setto-chat-ink);font-size:.85rem}.setto-chat__consent{display:flex!important;align-items:flex-start;gap:.45rem;font-weight:400!important;line-height:1.4}.setto-chat__lead>button{justify-self:start;padding:.55rem .8rem;border:0;border-radius:9px;background:var(--setto-chat-accent);color:var(--setto-chat-raised);font-size:.78rem;font-weight:700;cursor:pointer}.setto-chat__lead>button:disabled{opacity:.4;cursor:default}.setto-chat__lead-success{color:#28633d!important;font-weight:700}.setto-chat__lead-error{color:#a33024!important;font-weight:700}
+.setto-chat__composer-shell{position:absolute;left:0;right:0;bottom:0;z-index:25;display:grid;grid-template-columns:minmax(0,1fr);padding:1.5rem .75rem 0;background:transparent;isolation:isolate}.setto-chat__composer-shell::before{content:"";position:absolute;inset:0;pointer-events:none;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,.4) 34%,rgba(0,0,0,1) 66%);mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,.4) 34%,rgba(0,0,0,1) 66%)}.setto-chat__composer{position:relative;z-index:1;display:flex;flex-direction:column;gap:.15rem;width:100%;min-width:0;margin:0;padding:.35rem .4rem;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 10%,transparent);border-radius:24px;background:var(--setto-chat-canvas);box-shadow:0 8px 24px -16px color-mix(in srgb,var(--setto-chat-ink) 28%,transparent);transition:padding 220ms cubic-bezier(.16,1,.3,1),border-color 200ms ease,box-shadow 360ms cubic-bezier(.16,1,.3,1)}.setto-chat__composer.is-open{padding:.55rem .5rem}.setto-chat__composer:focus-within{border-color:var(--setto-chat-accent)}.setto-chat__composer textarea{width:100%;min-height:36px;max-height:200px;padding:.45rem .25rem;resize:none;border:0;outline:none;background:transparent;color:var(--setto-chat-ink);font-family:"Archivo Variable",Archivo,system-ui,sans-serif;font-size:16px;line-height:1.35;transition:min-height 220ms cubic-bezier(.16,1,.3,1)}.setto-chat__composer.is-open textarea{min-height:40px}.setto-chat__composer textarea::placeholder{color:color-mix(in srgb,var(--setto-chat-ink) 52%,transparent)}.setto-chat__composer-tools{display:flex;align-items:center;gap:.4rem;width:100%;min-width:0}.setto-chat__attach{flex:none;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:color-mix(in srgb,var(--setto-chat-ink) 58%,transparent);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background 160ms ease,color 160ms ease}.setto-chat__attach:hover:not(:disabled){background:color-mix(in srgb,var(--setto-chat-ink) 6%,transparent);color:var(--setto-chat-ink)}.setto-chat__attach:disabled{opacity:.4;cursor:default}.setto-chat__send{flex:none;width:36px;height:36px;margin-left:auto;padding:0;border:0;border-radius:50%;background:var(--setto-chat-accent);color:var(--setto-chat-raised);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform 360ms cubic-bezier(.16,1,.3,1),box-shadow 360ms cubic-bezier(.16,1,.3,1),background 200ms ease,opacity 200ms ease}.setto-chat__send:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 24px -12px color-mix(in srgb,var(--setto-chat-ink) 45%,transparent)}.setto-chat__send:active:not(:disabled){transform:translateY(0);box-shadow:0 4px 10px -8px color-mix(in srgb,var(--setto-chat-ink) 40%,transparent);transition-duration:90ms}.setto-chat__send:disabled{opacity:.35;cursor:default}.setto-chat__send.is-queued{animation:setto-chat-queued 1.1s ease-in-out infinite}.setto-chat__attachments{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:0;padding:.15rem .15rem 0}.setto-chat__attachments li{position:relative;width:56px;height:56px;border-radius:10px;overflow:hidden;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);background:var(--setto-chat-crema)}.setto-chat__attachments img{display:block;width:100%;height:100%;object-fit:cover}.setto-chat__attachments button{position:absolute;top:2px;right:2px;width:18px;height:18px;padding:0;border:0;border-radius:50%;background:color-mix(in srgb,var(--setto-chat-ink) 72%,transparent);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.setto-chat__composer-floor{position:relative;z-index:1;width:calc(100% + 1.5rem);height:max(.35rem,env(safe-area-inset-bottom));margin-left:-.75rem}
+.setto-chat__launcher{width:58px;height:58px;padding:3px;border:1px solid rgba(255,255,255,.54);border-radius:50%;background:color-mix(in srgb,var(--setto-chat-raised) 35%,transparent);box-shadow:0 10px 30px color-mix(in srgb,var(--setto-chat-ink) 24%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--setto-chat-ink) 9%,transparent);backdrop-filter:blur(14px) saturate(115%);-webkit-backdrop-filter:blur(14px) saturate(115%);color:var(--setto-chat-ink);display:grid;place-items:center;cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.setto-chat__launcher:hover{transform:translateY(-2px);box-shadow:0 15px 35px color-mix(in srgb,var(--setto-chat-ink) 28%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--setto-chat-ink) 9%,transparent)}.setto-chat__launcher span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--setto-chat-accent);color:var(--setto-chat-raised)}.setto-chat__launcher img{display:block;width:50px;height:50px;border-radius:50%;object-fit:cover}.setto-chat__launcher:focus-visible,.setto-chat button:focus-visible,.setto-chat textarea:focus-visible,.setto-chat input:focus-visible{outline:2px solid var(--setto-chat-accent);outline-offset:2px}@keyframes setto-chat-pulse{50%{opacity:.35}}@keyframes setto-chat-queued{50%{opacity:.55}}
+@media(max-width:700px){.setto-chat__chats{position:absolute;inset:0 auto 0 0;transform:translateX(-100%);transition:transform 260ms cubic-bezier(.16,1,.3,1);box-shadow:14px 0 35px color-mix(in srgb,var(--setto-chat-ink) 16%,transparent)}.setto-chat__chats--open{transform:none}.setto-chat__main{width:100%;max-width:none;margin:0}.setto-chat__disclosure{padding-left:.75rem;padding-right:.75rem}.setto-chat__log{padding-left:.75rem;padding-right:.75rem}.setto-chat__lead-grid{grid-template-columns:1fr}.setto-chat__actions{gap:1.1rem}.setto-chat__actions button{font-size:.88rem}}@media(min-width:700px){.setto-chat__header,.setto-chat__disclosure,.setto-chat__log{padding-left:1.25rem;padding-right:1.25rem}.setto-chat__composer-shell{padding-left:1.25rem;padding-right:1.25rem}.setto-chat__composer-floor{width:calc(100% + 2.5rem);margin-left:-1.25rem}.setto-chat__message{font-size:16.5px}}@media(prefers-reduced-motion:reduce){.setto-chat,.setto-chat__shell,.setto-chat__chats,.setto-chat__launcher,.setto-chat__composer,.setto-chat__composer textarea,.setto-chat__send{transition:none!important}.setto-chat__typing,.setto-chat__send.is-queued{animation:none}}
 `;
     document.head.appendChild(style);
     return () => style.remove();