@sevenfold/setto-client 0.33.0 → 0.34.0

package/dist/modules/chat/site-palette.d.ts

@@ -0,0 +1,71 @@
+import { type CSSProperties } from 'react';
+/**
+ * Barista in the site's own colours, light or dark as the page is now
+ * (Simon, 2026-09-25).
+ *
+ * It used to take the brand colours by position — the first was the soft
+ * surface, the fourth the text — which was setto.no's own order and nobody
+ * else's: one site got a purple canvas, and the many that write their brand
+ * colours as `hsl(var(--primary))` got setto.no's coffee instead. And it had
+ * no dark mode at all.
+ *
+ * So it reads the page, as the page is drawn right now:
+ *
+ * 1. A site with the shadcn tokens (every template since August) is read by
+ *    role — `--background`, `--card`, `--muted`, `--foreground`,
+ *    `--primary` and `--primary-foreground` — resolved on `<html>`,
+ *    so `.dark` is already applied.
+ * 2. Otherwise the page's own ground and text: the computed background and
+ *    colour of `<body>`, and the accent picked from the brand colours as the
+ *    most colourful one that stands out from that ground.
+ * 3. Otherwise Setto's crema and terracotta.
+ *
+ * Read again whenever `<html>` or `<body>` changes class, style or data (a
+ * theme toggle, `data-sky`) and when the
+ * system switches light and dark.
+ */
+export interface ChatPalette {
+    canvas: string;
+    raised: string;
+    crema: string;
+    ink: string;
+    accent: string;
+    onAccent: string;
+    dark: boolean;
+}
+type Rgba = [number, number, number, number];
+export declare const FALLBACK: ChatPalette;
+export declare function paletteStyle(p: ChatPalette): CSSProperties;
+export declare function rgbString([r, g, b, a]: Rgba): string;
+export declare function luminance([r, g, b]: Rgba): number;
+export declare function contrast(a: Rgba, b: Rgba): number;
+/** How colourful: the spread of the channels, 0 for a grey. */
+export declare function chroma([r, g, b]: Rgba): number;
+/** `a` over `b`, `amount` of the way. */
+export declare function mix(a: Rgba, b: Rgba, amount: number): Rgba;
+/** A shadcn token as a CSS colour: a bare `h s% l%` triplet (with or without `/ alpha`), or a colour already. */
+export declare function tokenColor(raw: string): string | null;
+/**
+ * The palette for a ground, a text colour, the site's tokens where it has
+ * them, and brand colours to take an accent from where it has not. Pure: the
+ * hook below does the reading.
+ */
+export declare function buildPalette(input: {
+    background: Rgba | null;
+    foreground: Rgba | null;
+    card?: Rgba | null;
+    muted?: Rgba | null;
+    primary?: Rgba | null;
+    primaryForeground?: Rgba | null;
+    brand?: Rgba[];
+}): ChatPalette;
+/** Any CSS colour the browser understands, as sRGB: drawn on one pixel and read back. */
+export declare function toRgba(color: string | null | undefined): Rgba | null;
+export declare function readPalette(brandColors: Array<{
+    value: string;
+}> | undefined): ChatPalette;
+/** The palette, kept in step with the page's light and dark. */
+export declare function useSitePalette(brandColors: Array<{
+    value: string;
+}> | undefined): CSSProperties;
+export {};

package/dist/setto-client.js

@@ -5869,8 +5869,8 @@ var Push = class {
    * @param {() => Record<string, unknown>} payload - The payload, for example `{user_id: 123}`
    * @param {number} timeout - The push timeout in milliseconds
    */
-  constructor(channel, event, payload, timeout) {
-    this.channel = channel;
+  constructor(channel2, event, payload, timeout) {
+    this.channel = channel2;
     this.event = event;
     this.payload = payload || function() {
       return {};
@@ -6590,12 +6590,12 @@ var Presence = class _Presence {
    * @param {Channel} channel - The Channel
    * @param {PresenceOptions} [opts] - The options, for example `{events: {state: "state", diff: "diff"}}`
    */
-  constructor(channel, opts = {}) {
+  constructor(channel2, opts = {}) {
     let events = opts.events || /** @type {PresenceEvents} */
     { state: "presence_state", diff: "presence_diff" };
     this.state = {};
     this.pendingDiffs = [];
-    this.channel = channel;
+    this.channel = channel2;
     this.joinRef = null;
     this.caller = {
       onJoin: function() {
@@ -7402,9 +7402,9 @@ var Socket = class {
    * @param {unknown} [reason] underlying close/error event forwarded to channel error listeners
    */
   triggerChanError(reason) {
-    this.channels.forEach((channel) => {
-      if (!(channel.isErrored() || channel.isLeaving() || channel.isClosed())) {
-        channel.trigger(CHANNEL_EVENTS.error, reason);
+    this.channels.forEach((channel2) => {
+      if (!(channel2.isErrored() || channel2.isLeaving() || channel2.isClosed())) {
+        channel2.trigger(CHANNEL_EVENTS.error, reason);
       }
     });
   }
@@ -7433,9 +7433,9 @@ var Socket = class {
    *
    * @param {Channel} channel
    */
-  remove(channel) {
-    this.off(channel.stateChangeRefs);
-    this.channels = this.channels.filter((c) => c !== channel);
+  remove(channel2) {
+    this.off(channel2.stateChangeRefs);
+    this.channels = this.channels.filter((c) => c !== channel2);
   }
   /**
    * Removes `onOpen`, `onClose`, `onError,` and `onMessage` registrations.
@@ -7540,11 +7540,11 @@ var Socket = class {
       }
       if (this.hasLogger()) this.log("receive", `${payload.status || ""} ${topic} ${event} ${ref && "(" + ref + ")" || ""}`.trim(), payload);
       for (let i = 0; i < this.channels.length; i++) {
-        const channel = this.channels[i];
-        if (!channel.isMember(topic, event, payload, join_ref)) {
+        const channel2 = this.channels[i];
+        if (!channel2.isMember(topic, event, payload, join_ref)) {
           continue;
         }
-        channel.trigger(event, payload, ref, join_ref);
+        channel2.trigger(event, payload, ref, join_ref);
       }
       this.triggerStateCallbacks("message", msg);
     });
@@ -7578,19 +7578,19 @@ var Socket = class {
   }
 };
 class PresenceAdapter {
-  constructor(channel, opts) {
+  constructor(channel2, opts) {
     const phoenixOptions = phoenixPresenceOptions(opts);
-    this.presence = new Presence(channel.getChannel(), phoenixOptions);
+    this.presence = new Presence(channel2.getChannel(), phoenixOptions);
     this.presence.onJoin((key, currentPresence, newPresence) => {
       const onJoinPayload = PresenceAdapter.onJoinPayload(key, currentPresence, newPresence);
-      channel.getChannel().trigger("presence", onJoinPayload);
+      channel2.getChannel().trigger("presence", onJoinPayload);
     });
     this.presence.onLeave((key, currentPresence, leftPresence) => {
       const onLeavePayload = PresenceAdapter.onLeavePayload(key, currentPresence, leftPresence);
-      channel.getChannel().trigger("presence", onLeavePayload);
+      channel2.getChannel().trigger("presence", onLeavePayload);
     });
     this.presence.onSync(() => {
-      channel.getChannel().trigger("presence", { event: "sync" });
+      channel2.getChannel().trigger("presence", { event: "sync" });
     });
   }
   get state() {
@@ -7692,8 +7692,8 @@ class RealtimePresence {
    * })
    * ```
    */
-  constructor(channel, opts) {
-    this.channel = channel;
+  constructor(channel2, opts) {
+    this.channel = channel2;
     this.presenceAdapter = new PresenceAdapter(this.channel.channelAdapter, opts);
   }
 }
@@ -8842,10 +8842,10 @@ Option 2: Install and provide the "ws" package:
    *
    * @category Realtime
    */
-  async removeChannel(channel) {
-    const status = await channel.unsubscribe();
+  async removeChannel(channel2) {
+    const status = await channel2.unsubscribe();
     if (status === "ok") {
-      channel.teardown();
+      channel2.teardown();
     }
     return status;
   }
@@ -8855,9 +8855,9 @@ Option 2: Install and provide the "ws" package:
    * @category Realtime
    */
   async removeAllChannels() {
-    const promises = this.channels.map(async (channel) => {
-      const result2 = await channel.unsubscribe();
-      channel.teardown();
+    const promises = this.channels.map(async (channel2) => {
+      const result2 = await channel2.unsubscribe();
+      channel2.teardown();
       return result2;
     });
     const result = await Promise.all(promises);
@@ -9007,8 +9007,8 @@ Option 2: Install and provide the "ws" package:
    *
    * @internal
    */
-  _remove(channel) {
-    this.channels = this.channels.filter((c) => c.topic !== channel.topic);
+  _remove(channel2) {
+    this.channels = this.channels.filter((c) => c.topic !== channel2.topic);
     if (this.channels.length === 0) {
       this.log("transport", "no channels remaining, scheduling disconnect");
       this._schedulePendingDisconnect();
@@ -9066,14 +9066,14 @@ Option 2: Install and provide the "ws" package:
     }
     if (this.accessTokenValue != tokenToSend) {
       this.accessTokenValue = tokenToSend;
-      this.channels.forEach((channel) => {
+      this.channels.forEach((channel2) => {
         const payload = {
           access_token: tokenToSend,
           version: DEFAULT_VERSION
         };
-        tokenToSend && channel.updateJoinPayload(payload);
-        if (channel.joinedOnce && channel.channelAdapter.isJoined()) {
-          channel.channelAdapter.push(CHANNEL_EVENTS$1.access_token, {
+        tokenToSend && channel2.updateJoinPayload(payload);
+        if (channel2.joinedOnce && channel2.channelAdapter.isJoined()) {
+          channel2.channelAdapter.push(CHANNEL_EVENTS$1.access_token, {
             access_token: tokenToSend
           });
         }
@@ -20680,8 +20680,8 @@ var SupabaseClient = class {
   * supabase.removeChannel(myChannel)
   * ```
   */
-  removeChannel(channel) {
-    return this.realtime.removeChannel(channel);
+  removeChannel(channel2) {
+    return this.realtime.removeChannel(channel2);
   }
   /**
   * Unsubscribes and removes all Realtime channels from Realtime client.
@@ -22320,6 +22320,184 @@ function EditModeShell({ children, themeStore, active, menu = active }) {
     active && sectionToolbarRoot && themeStore && SectionTools ? createPortal(/* @__PURE__ */ jsx(SectionTools, {}), sectionToolbarRoot) : null
   ] });
 }
+const FALLBACK = {
+  canvas: "rgb(255 255 255)",
+  raised: "rgb(250 246 238)",
+  crema: "rgb(242 235 223)",
+  ink: "rgb(33 23 17)",
+  accent: "rgb(196 80 42)",
+  onAccent: "rgb(250 246 238)",
+  dark: false
+};
+function paletteStyle(p) {
+  return {
+    "--setto-chat-canvas": p.canvas,
+    "--setto-chat-raised": p.raised,
+    "--setto-chat-crema": p.crema,
+    "--setto-chat-ink": p.ink,
+    "--setto-chat-accent": p.accent,
+    "--setto-chat-on-accent": p.onAccent,
+    colorScheme: p.dark ? "dark" : "light"
+  };
+}
+function rgbString([r, g, b, a]) {
+  return a >= 1 ? `rgb(${r} ${g} ${b})` : `rgb(${r} ${g} ${b} / ${Math.round(a * 1e3) / 1e3})`;
+}
+function channel(v) {
+  const c = v / 255;
+  return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+}
+function luminance([r, g, b]) {
+  return 0.2126 * channel(r) + 0.7152 * channel(g) + 0.0722 * channel(b);
+}
+function contrast(a, b) {
+  const [hi, lo] = [luminance(a), luminance(b)].sort((x, y) => y - x);
+  return (hi + 0.05) / (lo + 0.05);
+}
+function chroma([r, g, b]) {
+  return (Math.max(r, g, b) - Math.min(r, g, b)) / 255;
+}
+function mix(a, b, amount) {
+  const t = Math.max(0, Math.min(1, amount));
+  return [0, 1, 2].map((i) => Math.round(a[i] * t + b[i] * (1 - t))).concat(1);
+}
+function tokenColor(raw) {
+  const value = raw.trim();
+  if (!value) return null;
+  if (/^-?[\d.]+(deg)?\s+[\d.]+%\s+[\d.]+%(\s*\/\s*[\d.]+%?)?$/.test(value)) return `hsl(${value})`;
+  return value;
+}
+function buildPalette(input) {
+  const canvas = input.background && input.background[3] > 0.5 ? input.background : null;
+  if (!canvas) return FALLBACK;
+  const dark = luminance(canvas) < 0.2;
+  const ink = input.foreground && contrast(input.foreground, canvas) >= 3 ? input.foreground : dark ? [245, 242, 236, 1] : [33, 23, 17, 1];
+  const raised = input.card && input.card[3] > 0.5 ? input.card : mix(ink, canvas, dark ? 0.06 : 0.025);
+  const crema = input.muted && input.muted[3] > 0.5 ? input.muted : mix(ink, canvas, dark ? 0.1 : 0.05);
+  let accent = input.primary && input.primary[3] > 0.5 && contrast(input.primary, canvas) >= 1.8 ? input.primary : null;
+  if (!accent) {
+    const candidates = (input.brand ?? []).filter((c) => c[3] > 0.5 && contrast(c, canvas) >= 2.2 && chroma(c) > 0.18);
+    accent = candidates.sort((a, b) => chroma(b) * contrast(b, canvas) - chroma(a) * contrast(a, canvas))[0] ?? null;
+  }
+  if (!accent) accent = dark ? [224, 122, 88, 1] : [196, 80, 42, 1];
+  const white = [255, 255, 255, 1];
+  const black = [17, 12, 9, 1];
+  const onAccent = input.primaryForeground && accent === input.primary && contrast(input.primaryForeground, accent) >= 3 ? input.primaryForeground : contrast(white, accent) >= contrast(black, accent) ? white : black;
+  return {
+    canvas: rgbString(canvas),
+    raised: rgbString(raised),
+    crema: rgbString(crema),
+    ink: rgbString(ink),
+    accent: rgbString(accent),
+    onAccent: rgbString(onAccent),
+    dark
+  };
+}
+let probe;
+function toRgba(color2) {
+  if (!color2) return null;
+  const value = color2.trim();
+  if (!value || value === "transparent") return value === "transparent" ? [0, 0, 0, 0] : null;
+  if (typeof CSS !== "undefined" && CSS.supports && !CSS.supports("color", value)) return null;
+  if (probe === void 0) {
+    try {
+      const el = document.createElement("canvas");
+      el.width = el.height = 1;
+      probe = el.getContext("2d", { willReadFrequently: true });
+    } catch {
+      probe = null;
+    }
+  }
+  if (!probe) return null;
+  probe.clearRect(0, 0, 1, 1);
+  probe.fillStyle = "#000";
+  probe.fillStyle = value;
+  probe.fillRect(0, 0, 1, 1);
+  const [r, g, b, a] = probe.getImageData(0, 0, 1, 1).data;
+  return [r, g, b, a / 255];
+}
+function readTokens() {
+  const root2 = getComputedStyle(document.documentElement);
+  const token = (name2) => toRgba(tokenColor(root2.getPropertyValue(name2)));
+  const background = token("--background");
+  const foreground = token("--foreground");
+  if (!background || !foreground) return null;
+  return {
+    background,
+    foreground,
+    card: token("--card"),
+    muted: token("--muted") ?? token("--secondary"),
+    primary: token("--primary"),
+    primaryForeground: token("--primary-foreground")
+  };
+}
+function settled(el, property, now) {
+  try {
+    for (const animation of el.getAnimations?.() ?? []) {
+      if (animation.transitionProperty !== property) continue;
+      const frames = animation.effect?.getKeyframes() ?? [];
+      const end = frames.at(-1)?.[property === "color" ? "color" : "backgroundColor"];
+      if (typeof end === "string" && end) return end;
+    }
+  } catch {
+  }
+  return now;
+}
+function readGround() {
+  const bodyEl = document.body;
+  const htmlEl = document.documentElement;
+  const body = getComputedStyle(bodyEl);
+  const html2 = getComputedStyle(htmlEl);
+  let background = toRgba(settled(bodyEl, "background-color", body.backgroundColor));
+  if (!background || background[3] < 0.5) background = toRgba(settled(htmlEl, "background-color", html2.backgroundColor));
+  if (!background || background[3] < 0.5) {
+    background = /dark/.test(html2.colorScheme ?? "") ? [18, 18, 18, 1] : [255, 255, 255, 1];
+  }
+  return { background, foreground: toRgba(settled(bodyEl, "color", body.color)) };
+}
+function readPalette(brandColors) {
+  try {
+    const tokens = readTokens();
+    if (tokens) return buildPalette(tokens);
+    const brand = (brandColors ?? []).map((c) => toRgba(c.value)).filter((c) => c !== null);
+    return buildPalette({ ...readGround(), brand });
+  } catch {
+    return FALLBACK;
+  }
+}
+function useSitePalette(brandColors) {
+  const [palette, setPalette] = useState(() => typeof document === "undefined" ? FALLBACK : readPalette(brandColors));
+  useEffect(() => {
+    let frame = 0;
+    let last = "";
+    const read = () => {
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => {
+        const next = readPalette(brandColors);
+        const key = JSON.stringify(next);
+        if (key !== last) {
+          last = key;
+          setPalette(next);
+        }
+      });
+    };
+    read();
+    const watch = new MutationObserver(read);
+    const attributes = { attributes: true, attributeFilter: ["class", "style", "data-theme", "data-ground", "data-sky", "data-mode"] };
+    watch.observe(document.documentElement, attributes);
+    watch.observe(document.body, attributes);
+    const system = window.matchMedia?.("(prefers-color-scheme: dark)");
+    system?.addEventListener?.("change", read);
+    window.addEventListener("load", read);
+    return () => {
+      cancelAnimationFrame(frame);
+      watch.disconnect();
+      system?.removeEventListener?.("change", read);
+      window.removeEventListener("load", read);
+    };
+  }, [brandColors]);
+  return paletteStyle(palette);
+}
 function ok$1() {
 }
 function unreachable() {
@@ -35125,14 +35303,14 @@ function createWordRevealer(onReveal) {
   let visibleLength = 0;
   let timer = null;
   let finished = false;
-  let settled = false;
+  let settled2 = false;
   let resolveDrain = () => void 0;
   const drained = new Promise((resolve) => {
     resolveDrain = resolve;
   });
   const settle = () => {
-    if (settled) return;
-    settled = true;
+    if (settled2) return;
+    settled2 = true;
     if (timer) clearTimeout(timer);
     timer = null;
     resolveDrain();
@@ -35148,7 +35326,7 @@ function createWordRevealer(onReveal) {
     if (finished) settle();
   };
   const schedule = () => {
-    if (!timer && !settled) timer = setTimeout(tick, 0);
+    if (!timer && !settled2) timer = setTimeout(tick, 0);
   };
   return {
     push(next) {
@@ -35170,19 +35348,6 @@ function norwegian(locale) {
 function intro(locale, name2, agent = "Barista") {
   return norwegian(locale) ? `Hei! Jeg er ${agent}, ${name2 ? `${name2}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 ${agent}, the AI assistant for ${name2 ?? "this website"}. I answer from what the team has shared here and help you reach them when needed.`;
 }
-function validColor(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((color2) => color2.value) ?? [];
-  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",
@@ -35708,11 +35873,11 @@ function useConversationChannel(supabase, topic, handlers2) {
   useEffect(() => {
     if (!topic) return;
     let active = true;
-    let channel = null;
+    let channel2 = null;
     let changedTimer = 0;
     const join2 = () => {
       if (!active) return;
-      channel = supabase.channel(topic).on("broadcast", { event: "changed" }, () => {
+      channel2 = supabase.channel(topic).on("broadcast", { event: "changed" }, () => {
         window.clearTimeout(changedTimer);
         changedTimer = window.setTimeout(
           () => handlersRef.current.onChanged(),
@@ -35725,8 +35890,8 @@ function useConversationChannel(supabase, topic, handlers2) {
         const signal = parseTypingSignal(message.payload);
         if (signal) handlersRef.current.onTyping(signal);
       });
-      channelRef.current = channel;
-      channel.subscribe((status) => {
+      channelRef.current = channel2;
+      channel2.subscribe((status) => {
         if (active) handlersRef.current.onStatus(status === "SUBSCRIBED");
       });
     };
@@ -35736,11 +35901,11 @@ function useConversationChannel(supabase, topic, handlers2) {
     return () => {
       active = false;
       window.clearTimeout(changedTimer);
-      if (!channel) return;
+      if (!channel2) return;
       handlersRef.current.onLeave();
       channelRef.current = null;
       handlersRef.current.onStatus(false);
-      const removal = supabase.removeChannel(channel).catch(() => void 0).finally(() => {
+      const removal = supabase.removeChannel(channel2).catch(() => void 0).finally(() => {
         if (channelRemovals.get(topic) === removal) channelRemovals.delete(topic);
       });
       channelRemovals.set(topic, removal);
@@ -35807,7 +35972,7 @@ function SettoChat() {
   const refreshRef = useRef(async () => void 0);
   const typingSenderRef = useRef(null);
   const formId = useId();
-  const palette = useMemo(() => chatPalette(config.brandColors), [config.brandColors]);
+  const palette = useSitePalette(config.brandColors);
   const desktopPopup = useDesktopPopup();
   const pageVisible = usePageVisible();
   const channelRef = useConversationChannel(supabase, mounted ? realtime?.topic ?? null : null, {
@@ -35835,9 +36000,9 @@ function SettoChat() {
   });
   function typingSender() {
     return typingSenderRef.current ??= createTypingSender((typing) => {
-      const channel = channelRef.current;
-      if (!channel || !subscribedRef.current || channel.state !== "joined") return false;
-      void channel.send({ type: "broadcast", event: "typing", payload: { side: "visitor", typing } }).catch(() => void 0);
+      const channel2 = channelRef.current;
+      if (!channel2 || !subscribedRef.current || channel2.state !== "joined") return false;
+      void channel2.send({ type: "broadcast", event: "typing", payload: { side: "visitor", typing } }).catch(() => void 0);
       return true;
     });
   }
@@ -36528,11 +36693,11 @@ function useChatStyles() {
 .setto-chat{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:2147483000;overscroll-behavior:contain;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:0;right:auto;bottom:auto;left:0;width:100vw;height:var(--setto-chat-layout-height,100lvh);overflow:hidden;background:var(--setto-chat-canvas);opacity:0;transition:opacity ${CLOSE_MS}ms ease}.setto-chat--visible{opacity:1}.setto-chat__shell{position:absolute;top:var(--setto-chat-top,0);left:0;width:100%;height:var(--setto-chat-height,100svh);display:flex;overflow:hidden;overscroll-behavior:contain;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:absolute;inset:0 0 auto;z-index:30;min-height:58px;padding:.35rem .75rem;display:flex;align-items:center;gap:.5rem;background:linear-gradient(to bottom,color-mix(in srgb,var(--setto-chat-crema) 88%,transparent),color-mix(in srgb,var(--setto-chat-crema) 72%,transparent));border-bottom:1px solid color-mix(in srgb,var(--setto-chat-ink) 12%,transparent);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);isolation:isolate}.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__body{position:relative;display:flex;flex:1 1 auto;min-height:0;height:100%;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:calc(58px + 1.3rem) .75rem var(--setto-chat-composer-space,8rem);scroll-padding-bottom:var(--setto-chat-composer-space,8rem);scroll-behavior:auto;-webkit-overflow-scrolling:touch}.setto-chat__message-list{display:flex;flex-direction:column}.setto-chat__message{--setto-chat-bubble:color-mix(in srgb,var(--setto-chat-ink) 7%,var(--setto-chat-canvas));display:flex;align-items:flex-end;gap:.55rem;width:100%;margin-bottom:1rem;color:color-mix(in srgb,var(--setto-chat-ink) 92%,transparent);font-size:16px;line-height:1.5;overflow-wrap:anywhere}.setto-chat__message-stack{display:flex;min-width:0;max-width:min(78%,36rem);flex-direction:column;align-items:flex-start}.setto-chat__message-bubble{position:relative;min-width:2.5rem;padding:.58rem .82rem;border-radius:19px 19px 19px 5px;background:var(--setto-chat-bubble);white-space:pre-wrap}.setto-chat__message--assistant .setto-chat__message-bubble::before,.setto-chat__message--human .setto-chat__message-bubble::before{content:"";position:absolute;z-index:0;left:-7px;bottom:0;width:16px;height:17px;border-bottom-right-radius:14px;background:var(--setto-chat-bubble)}.setto-chat__message--assistant .setto-chat__message-bubble::after,.setto-chat__message--human .setto-chat__message-bubble::after{content:"";position:absolute;z-index:1;left:-10px;bottom:0;width:10px;height:18px;border-bottom-right-radius:10px;background:var(--setto-chat-canvas)}.setto-chat__message-copy,.setto-chat__image{position:relative;z-index:2}.setto-chat__message--visitor{--setto-chat-bubble:#0a84ff;justify-content:flex-end;color:#fff}.setto-chat__message--visitor .setto-chat__message-stack{align-items:flex-end}.setto-chat__message--visitor .setto-chat__message-bubble{border-radius:19px 19px 5px 19px}.setto-chat__message--visitor .setto-chat__message-bubble::before{content:"";position:absolute;z-index:0;right:-7px;bottom:0;width:16px;height:17px;border-bottom-left-radius:14px;background:var(--setto-chat-bubble)}.setto-chat__message--visitor .setto-chat__message-bubble::after{content:"";position:absolute;z-index:1;right:-10px;bottom:0;width:10px;height:18px;border-bottom-left-radius:10px;background:var(--setto-chat-canvas)}.setto-chat__message--system{justify-content:center;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent);font-size:.78rem;line-height:1.45;text-align:center}.setto-chat__message--system .setto-chat__message-stack{max-width:85%;align-items:center}.setto-chat__message--system .setto-chat__message-bubble{padding:.25rem .6rem;background:transparent}.setto-chat__avatar{position:relative;z-index:3;display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;margin-bottom:1px;overflow:hidden;border:2px solid var(--setto-chat-canvas);border-radius:50%;background:var(--setto-chat-crema);color:var(--setto-chat-ink);box-shadow:0 2px 8px color-mix(in srgb,var(--setto-chat-ink) 14%,transparent)}.setto-chat__avatar--assistant{background:var(--setto-chat-accent);color:var(--setto-chat-raised)}.setto-chat__avatar img{display:block;width:100%;height:100%;object-fit:cover}.setto-chat__speaker{display:block;margin:0 0 .2rem .4rem;color:color-mix(in srgb,var(--setto-chat-ink) 52%,transparent);font-size:.69rem;font-weight:500;line-height:1.2}.setto-chat__typing{display:inline-block;min-width:1.8rem;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:13px}.setto-chat__image img{display:block;width:min(280px,100%);max-height:260px;object-fit:cover}
+.setto-chat__body{position:relative;display:flex;flex:1 1 auto;min-height:0;height:100%;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:calc(58px + 1.3rem) .75rem var(--setto-chat-composer-space,8rem);scroll-padding-bottom:var(--setto-chat-composer-space,8rem);scroll-behavior:auto;-webkit-overflow-scrolling:touch}.setto-chat__message-list{display:flex;flex-direction:column}.setto-chat__message{--setto-chat-bubble:color-mix(in srgb,var(--setto-chat-ink) 7%,var(--setto-chat-canvas));display:flex;align-items:flex-end;gap:.55rem;width:100%;margin-bottom:1rem;color:color-mix(in srgb,var(--setto-chat-ink) 92%,transparent);font-size:16px;line-height:1.5;overflow-wrap:anywhere}.setto-chat__message-stack{display:flex;min-width:0;max-width:min(78%,36rem);flex-direction:column;align-items:flex-start}.setto-chat__message-bubble{position:relative;min-width:2.5rem;padding:.58rem .82rem;border-radius:19px 19px 19px 5px;background:var(--setto-chat-bubble);white-space:pre-wrap}.setto-chat__message--assistant .setto-chat__message-bubble::before,.setto-chat__message--human .setto-chat__message-bubble::before{content:"";position:absolute;z-index:0;left:-7px;bottom:0;width:16px;height:17px;border-bottom-right-radius:14px;background:var(--setto-chat-bubble)}.setto-chat__message--assistant .setto-chat__message-bubble::after,.setto-chat__message--human .setto-chat__message-bubble::after{content:"";position:absolute;z-index:1;left:-10px;bottom:0;width:10px;height:18px;border-bottom-right-radius:10px;background:var(--setto-chat-canvas)}.setto-chat__message-copy,.setto-chat__image{position:relative;z-index:2}.setto-chat__message--visitor{--setto-chat-bubble:var(--setto-chat-accent);justify-content:flex-end;color:var(--setto-chat-on-accent)}.setto-chat__message--visitor .setto-chat__message-stack{align-items:flex-end}.setto-chat__message--visitor .setto-chat__message-bubble{border-radius:19px 19px 5px 19px}.setto-chat__message--visitor .setto-chat__message-bubble::before{content:"";position:absolute;z-index:0;right:-7px;bottom:0;width:16px;height:17px;border-bottom-left-radius:14px;background:var(--setto-chat-bubble)}.setto-chat__message--visitor .setto-chat__message-bubble::after{content:"";position:absolute;z-index:1;right:-10px;bottom:0;width:10px;height:18px;border-bottom-left-radius:10px;background:var(--setto-chat-canvas)}.setto-chat__message--system{justify-content:center;color:color-mix(in srgb,var(--setto-chat-ink) 55%,transparent);font-size:.78rem;line-height:1.45;text-align:center}.setto-chat__message--system .setto-chat__message-stack{max-width:85%;align-items:center}.setto-chat__message--system .setto-chat__message-bubble{padding:.25rem .6rem;background:transparent}.setto-chat__avatar{position:relative;z-index:3;display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;margin-bottom:1px;overflow:hidden;border:2px solid var(--setto-chat-canvas);border-radius:50%;background:var(--setto-chat-crema);color:var(--setto-chat-ink);box-shadow:0 2px 8px color-mix(in srgb,var(--setto-chat-ink) 14%,transparent)}.setto-chat__avatar--assistant{background:var(--setto-chat-accent);color:var(--setto-chat-on-accent)}.setto-chat__avatar img{display:block;width:100%;height:100%;object-fit:cover}.setto-chat__speaker{display:block;margin:0 0 .2rem .4rem;color:color-mix(in srgb,var(--setto-chat-ink) 52%,transparent);font-size:.69rem;font-weight:500;line-height:1.2}.setto-chat__typing{display:inline-block;min-width:1.8rem;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:13px}.setto-chat__image img{display:block;width:min(280px,100%);max-height:260px;object-fit:cover}
 .setto-chat__message--agent-joined{justify-content:flex-start;align-items:center;gap:.55rem;padding:.1rem .4rem;color:color-mix(in srgb,var(--setto-chat-ink) 62%,transparent);font-size:.8rem;line-height:1.4;text-align:left}.setto-chat__message--agent-joined .setto-chat__message-stack{max-width:calc(100% - 38px);align-items:flex-start}.setto-chat__message--agent-joined .setto-chat__message-bubble{min-width:0;padding:.2rem 0;background:transparent;white-space:normal}.setto-chat__avatar--joined{flex-basis:30px;width:30px;height:30px;margin:0;border-width:1px;box-shadow:0 2px 7px color-mix(in srgb,var(--setto-chat-ink) 12%,transparent)}
 .setto-chat__receipt{display:block;margin:.26rem .45rem 0 0;color:color-mix(in srgb,var(--setto-chat-ink) 52%,transparent);font-size:.69rem;font-weight:500;line-height:1.2}.setto-chat__message--typing{animation:setto-chat-typing-in 180ms cubic-bezier(.2,.8,.2,1) both}.setto-chat__message--typing .setto-chat__message-bubble{min-width:3.25rem;text-align:center}.setto-chat__message--typing .setto-chat__typing{font-weight:700;letter-spacing:.06em}@keyframes setto-chat-typing-in{from{opacity:0;transform:translateY(4px)}}@media(prefers-reduced-motion:reduce){.setto-chat__message--typing{animation:none}}
-.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;background:linear-gradient(to bottom,transparent 0%,color-mix(in srgb,var(--setto-chat-canvas) 82%,transparent) 46%,var(--setto-chat-canvas) 66%);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:2px 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,.setto-chat__composer textarea:hover,.setto-chat__composer textarea:focus,.setto-chat__composer textarea:focus-visible{width:100%;min-height:36px;max-height:${MAX_COMPOSER_HEIGHT}px;overflow-y:auto;padding:.45rem .25rem;resize:none;-webkit-appearance:none!important;appearance:none!important;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;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 textarea::-webkit-scrollbar{width:6px}.setto-chat__composer textarea::-webkit-scrollbar-track{background:transparent}.setto-chat__composer textarea::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--setto-chat-ink) 24%,transparent)}.setto-chat__composer textarea::-webkit-scrollbar-button{display:none;height:0}@supports not selector(::-webkit-scrollbar){.setto-chat__composer textarea{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--setto-chat-ink) 24%,transparent) 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;background:var(--setto-chat-canvas)}
-.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 span{overflow:hidden}.setto-chat__launcher span img{width:100%;height:100%}.setto-chat__launcher:focus-visible,.setto-chat button: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}}
+.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;background:linear-gradient(to bottom,transparent 0%,color-mix(in srgb,var(--setto-chat-canvas) 82%,transparent) 46%,var(--setto-chat-canvas) 66%);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:2px 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,.setto-chat__composer textarea:hover,.setto-chat__composer textarea:focus,.setto-chat__composer textarea:focus-visible{width:100%;min-height:36px;max-height:${MAX_COMPOSER_HEIGHT}px;overflow-y:auto;padding:.45rem .25rem;resize:none;-webkit-appearance:none!important;appearance:none!important;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;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 textarea::-webkit-scrollbar{width:6px}.setto-chat__composer textarea::-webkit-scrollbar-track{background:transparent}.setto-chat__composer textarea::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--setto-chat-ink) 24%,transparent)}.setto-chat__composer textarea::-webkit-scrollbar-button{display:none;height:0}@supports not selector(::-webkit-scrollbar){.setto-chat__composer textarea{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--setto-chat-ink) 24%,transparent) 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-on-accent);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:var(--setto-chat-canvas);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;background:var(--setto-chat-canvas)}
+.setto-chat__launcher{width:58px;height:58px;padding:3px;border:1px solid color-mix(in srgb,var(--setto-chat-canvas) 54%,transparent);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-on-accent)}.setto-chat__launcher img{display:block;width:50px;height:50px;border-radius:50%;object-fit:cover}.setto-chat__launcher span{overflow:hidden}.setto-chat__launcher span img{width:100%;height:100%}.setto-chat__launcher:focus-visible,.setto-chat button: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__log{padding-left:.75rem;padding-right:.75rem}}@media(min-width:701px){.setto-chat--mounted{top:auto;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));left:auto;width:min(440px,calc(100vw - 36px));height:min(720px,calc(100dvh - 36px));overflow:visible;background:transparent}.setto-chat__shell{position:relative;top:auto;left:auto;width:100%;height:100%;border:1px solid color-mix(in srgb,var(--setto-chat-ink) 14%,transparent);border-radius:26px;background:var(--setto-chat-canvas);box-shadow:0 28px 80px -24px color-mix(in srgb,var(--setto-chat-ink) 42%,transparent),0 8px 24px -12px color-mix(in srgb,var(--setto-chat-ink) 24%,transparent);transform:translateY(16px) scale(.975);transform-origin:right bottom}.setto-chat--visible .setto-chat__shell{transform:none}.setto-chat__chats{position:absolute;inset:0 auto 0 0;width:min(82%,280px);height:100%;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__header,.setto-chat__log{padding-left:.9rem;padding-right:.9rem}.setto-chat__composer-shell{padding-left:.9rem;padding-right:.9rem}.setto-chat__composer-floor{width:calc(100% + 1.8rem);height:.45rem;margin-left:-.9rem}.setto-chat__message{font-size:15.5px}.setto-chat__message-stack{max-width:82%}}@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}}
 `;
     style.textContent += "@media(prefers-reduced-motion:reduce){.setto-chat__markdown.is-revealing .setto-chat__word{opacity:1;transform:none;filter:none;animation:none}}";