@skippr/live-agent-sdk 0.30.0 → 0.31.0

package/dist/esm/lib-exports.js

@@ -316,632 +316,235 @@ var DOM_SNAPSHOT_TOPIC = "skippr.dom-snapshot";
 var DOM_EVENTS_TOPIC = "skippr.dom-events";
 var HIGHLIGHT_TOPIC = "skippr.highlight";
 var NAME_MAX_CHARS = 80;
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
-import { forwardRef as forwardRef2, createElement as createElement3 } from "react";
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.js
-var mergeClasses = (...classes) => classes.filter((className, index, array) => {
-  return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
-}).join(" ").trim();
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.js
-var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.js
-var toCamelCase = (string) => string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase());
 
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.js
-var toPascalCase = (string) => {
-  const camelCase = toCamelCase(string);
-  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
-};
+// src/components/AutoStartMedia.tsx
+import { useConnectionState, useLocalParticipant } from "@livekit/components-react/hooks";
+import { ConnectionState, Track } from "livekit-client";
+import { useEffect as useEffect3, useRef } from "react";
+function AutoStartMedia({ pendingScreenStream }) {
+  const { localParticipant } = useLocalParticipant();
+  const connectionState = useConnectionState();
+  const didStartRef = useRef(false);
+  useEffect3(() => {
+    if (didStartRef.current)
+      return;
+    if (connectionState !== ConnectionState.Connected)
+      return;
+    didStartRef.current = true;
+    localParticipant.setMicrophoneEnabled(true).catch((error) => console.error("Failed to enable microphone:", error));
+    if (pendingScreenStream) {
+      const videoTrack = pendingScreenStream.getVideoTracks()[0];
+      if (videoTrack) {
+        videoTrack.contentHint = "detail";
+        localParticipant.publishTrack(videoTrack, { source: Track.Source.ScreenShare }).catch((error) => {
+          console.error("Failed to publish screen share track:", error);
+          for (const track of pendingScreenStream.getTracks())
+            track.stop();
+        });
+      }
+    }
+  }, [connectionState, localParticipant, pendingScreenStream]);
+  return null;
+}
 
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
-import { forwardRef, createElement as createElement2 } from "react";
+// src/components/DomCapture.tsx
+import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
+import { ConnectionState as ConnectionState2, ScreenSharePresets, Track as Track2 } from "livekit-client";
+import { useEffect as useEffect4, useRef as useRef2 } from "react";
 
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/defaultAttributes.js
-var defaultAttributes = {
-  xmlns: "http://www.w3.org/2000/svg",
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  fill: "none",
-  stroke: "currentColor",
-  strokeWidth: 2,
-  strokeLinecap: "round",
-  strokeLinejoin: "round"
+// src/capture/a11yUtils.ts
+var ROLE_BY_TAG = {
+  a: "link",
+  button: "button",
+  input: "input",
+  select: "select",
+  textarea: "textarea",
+  label: "label",
+  nav: "navigation",
+  main: "main",
+  header: "header",
+  footer: "footer",
+  aside: "complementary",
+  form: "form",
+  h1: "heading",
+  h2: "heading",
+  h3: "heading",
+  h4: "heading",
+  h5: "heading",
+  h6: "heading",
+  img: "image",
+  ul: "list",
+  ol: "list",
+  li: "listitem",
+  table: "table",
+  tr: "row",
+  td: "cell",
+  th: "columnheader",
+  video: "video",
+  iframe: "iframe",
+  canvas: "canvas",
+  audio: "audio",
+  embed: "embed",
+  object: "object"
 };
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.js
-var hasA11yProp = (props) => {
-  for (const prop in props) {
-    if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
-      return true;
+function inferRole(element) {
+  const explicitRole = element.getAttribute("role");
+  if (explicitRole)
+    return explicitRole;
+  const tagName = element.tagName.toLowerCase();
+  if (tagName === "input") {
+    const inputType = element.type;
+    if (inputType === "checkbox")
+      return "checkbox";
+    if (inputType === "radio")
+      return "radio";
+    if (inputType === "submit" || inputType === "button")
+      return "button";
+    return "input";
+  }
+  return ROLE_BY_TAG[tagName] ?? null;
+}
+function accessibleName(element, options = {}) {
+  const ariaLabel = element.getAttribute("aria-label");
+  if (ariaLabel)
+    return ariaLabel.trim().slice(0, NAME_MAX_CHARS);
+  if (!options.quick) {
+    const labelledBy = element.getAttribute("aria-labelledby");
+    if (labelledBy) {
+      const labelElement = document.getElementById(labelledBy);
+      if (labelElement)
+        return (labelElement.textContent || "").trim().slice(0, NAME_MAX_CHARS);
+    }
+    if (element.tagName === "INPUT" || element.tagName === "SELECT" || element.tagName === "TEXTAREA") {
+      const elementId = element.id;
+      if (elementId) {
+        const associatedLabel = document.querySelector(`label[for="${CSS.escape(elementId)}"]`);
+        if (associatedLabel?.textContent) {
+          return associatedLabel.textContent.trim().slice(0, NAME_MAX_CHARS);
+        }
+      }
+      const placeholder = element.getAttribute("placeholder");
+      if (placeholder)
+        return placeholder.trim().slice(0, NAME_MAX_CHARS);
     }
   }
-  return false;
-};
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
-import { createContext as createContext2, useContext, useMemo, createElement } from "react";
-"use client";
-var LucideContext = createContext2({});
-var useLucideContext = () => useContext(LucideContext);
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
-"use client";
-var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
-  const {
-    size: contextSize = 24,
-    strokeWidth: contextStrokeWidth = 2,
-    absoluteStrokeWidth: contextAbsoluteStrokeWidth = false,
-    color: contextColor = "currentColor",
-    className: contextClass = ""
-  } = useLucideContext() ?? {};
-  const calculatedStrokeWidth = absoluteStrokeWidth ?? contextAbsoluteStrokeWidth ? Number(strokeWidth ?? contextStrokeWidth) * 24 / Number(size ?? contextSize) : strokeWidth ?? contextStrokeWidth;
-  return createElement2("svg", {
-    ref,
-    ...defaultAttributes,
-    width: size ?? contextSize ?? defaultAttributes.width,
-    height: size ?? contextSize ?? defaultAttributes.height,
-    stroke: color ?? contextColor,
-    strokeWidth: calculatedStrokeWidth,
-    className: mergeClasses("lucide", contextClass, className),
-    ...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
-    ...rest
-  }, [
-    ...iconNode.map(([tag, attrs]) => createElement2(tag, attrs)),
-    ...Array.isArray(children) ? children : [children]
-  ]);
-});
-
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
-var createLucideIcon = (iconName, iconNode) => {
-  const Component = forwardRef2(({ className, ...props }, ref) => createElement3(Icon, {
-    ref,
-    iconNode,
-    className: mergeClasses(`lucide-${toKebabCase(toPascalCase(iconName))}`, `lucide-${iconName}`, className),
-    ...props
-  }));
-  Component.displayName = toPascalCase(iconName);
-  return Component;
-};
+  if (element.tagName === "IMG") {
+    const altText = element.getAttribute("alt");
+    if (altText)
+      return altText.trim().slice(0, NAME_MAX_CHARS);
+  }
+  const titleAttr = element.getAttribute("title");
+  if (titleAttr)
+    return titleAttr.trim().slice(0, NAME_MAX_CHARS);
+  const textContent = (element.textContent || "").replace(/\s+/g, " ").trim();
+  if (textContent)
+    return textContent.slice(0, NAME_MAX_CHARS);
+  return "";
+}
 
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle-check.js
-var __iconNode = [
-  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
-  ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
-];
-var CircleCheck = createLucideIcon("circle-check", __iconNode);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/loader-circle.js
-var __iconNode2 = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
-var LoaderCircle = createLucideIcon("loader-circle", __iconNode2);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/sparkles.js
-var __iconNode3 = [
-  [
-    "path",
-    {
-      d: "M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z",
-      key: "1s2grr"
-    }
-  ],
-  ["path", { d: "M20 2v4", key: "1rf3ol" }],
-  ["path", { d: "M22 4h-4", key: "gwowj6" }],
-  ["circle", { cx: "4", cy: "20", r: "2", key: "6kqj1y" }]
-];
-var Sparkles = createLucideIcon("sparkles", __iconNode3);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/calendar.js
-var __iconNode4 = [
-  ["path", { d: "M8 2v4", key: "1cmpym" }],
-  ["path", { d: "M16 2v4", key: "4m81vk" }],
-  ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
-  ["path", { d: "M3 10h18", key: "8toen8" }]
+// src/capture/a11yTree.ts
+var REF_PREFIX = "r-";
+var VALUE_MAX_CHARS = 80;
+var HREF_MAX_CHARS = 60;
+var PAGE_CONTENT_MAX_BYTES = 14000;
+var NODE_LIMIT = 1500;
+var SENSITIVE_IFRAME_HOSTS = [
+  "js.stripe.com",
+  "checkout.stripe.com",
+  "connect.stripe.com",
+  "plaid.com",
+  "production.plaid.com",
+  "cdn.plaid.com",
+  "auth0.com",
+  "login.auth0.com",
+  "recaptcha.net",
+  "www.google.com",
+  "hcaptcha.com",
+  "newassets.hcaptcha.com",
+  "challenges.cloudflare.com"
 ];
-var Calendar = createLucideIcon("calendar", __iconNode4);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/chevron-down.js
-var __iconNode5 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-var ChevronDown = createLucideIcon("chevron-down", __iconNode5);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
-var __iconNode6 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
-var Circle = createLucideIcon("circle", __iconNode6);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/eye.js
-var __iconNode7 = [
-  [
-    "path",
-    {
-      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
-      key: "1nclc0"
-    }
-  ],
-  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-];
-var Eye = createLucideIcon("eye", __iconNode7);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
-var __iconNode8 = [
-  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
-  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
-];
-var Mail = createLucideIcon("mail", __iconNode8);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
-var __iconNode9 = [
-  [
-    "path",
-    {
-      d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719",
-      key: "1sd12s"
-    }
-  ]
-];
-var MessageCircle = createLucideIcon("message-circle", __iconNode9);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
-var __iconNode10 = [
-  ["path", { d: "M12 19v3", key: "npa21l" }],
-  ["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
-  ["path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2", key: "cqa7eg" }],
-  ["path", { d: "M18.89 13.23A7 7 0 0 0 19 12v-2", key: "16hl24" }],
-  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
-  ["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }]
-];
-var MicOff = createLucideIcon("mic-off", __iconNode10);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
-var __iconNode11 = [
-  ["path", { d: "M12 19v3", key: "npa21l" }],
-  ["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
-  ["rect", { x: "9", y: "2", width: "6", height: "13", rx: "3", key: "s6n7sd" }]
-];
-var Mic = createLucideIcon("mic", __iconNode11);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/minimize-2.js
-var __iconNode12 = [
-  ["path", { d: "m14 10 7-7", key: "oa77jy" }],
-  ["path", { d: "M20 10h-6V4", key: "mjg0md" }],
-  ["path", { d: "m3 21 7-7", key: "tjx5ai" }],
-  ["path", { d: "M4 14h6v6", key: "rmj7iw" }]
-];
-var Minimize2 = createLucideIcon("minimize-2", __iconNode12);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
-var __iconNode13 = [
-  ["path", { d: "M12 17v4", key: "1riwvh" }],
-  ["path", { d: "M17 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 1.184-1.826", key: "cv7jms" }],
-  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
-  ["path", { d: "M8 21h8", key: "1ev6f3" }],
-  ["path", { d: "M8.656 3H20a2 2 0 0 1 2 2v10a2 2 0 0 1-.293 1.042", key: "z8ni2w" }]
-];
-var MonitorOff = createLucideIcon("monitor-off", __iconNode13);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
-var __iconNode14 = [
-  ["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
-  ["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
-  ["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
-];
-var Monitor = createLucideIcon("monitor", __iconNode14);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/phone-off.js
-var __iconNode15 = [
-  [
-    "path",
-    {
-      d: "M10.1 13.9a14 14 0 0 0 3.732 2.668 1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2 18 18 0 0 1-12.728-5.272",
-      key: "1wngk7"
-    }
-  ],
-  ["path", { d: "M22 2 2 22", key: "y4kqgn" }],
-  [
-    "path",
-    {
-      d: "M4.76 13.582A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 .244.473",
-      key: "10hv5p"
-    }
-  ]
-];
-var PhoneOff = createLucideIcon("phone-off", __iconNode15);
-// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send.js
-var __iconNode16 = [
-  [
-    "path",
-    {
-      d: "M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z",
-      key: "1ffxy3"
-    }
-  ],
-  ["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
-];
-var Send = createLucideIcon("send", __iconNode16);
-// src/hooks/useAgentVoiceState.ts
-import { useVoiceAssistant } from "@livekit/components-react/hooks";
-function useAgentVoiceState() {
-  const { state } = useVoiceAssistant();
-  return {
-    state,
-    isSpeaking: state === "speaking",
-    isListening: state === "listening"
-  };
+var MASK_AUTOCOMPLETE_VALUES = new Set([
+  "cc-number",
+  "cc-exp",
+  "cc-exp-month",
+  "cc-exp-year",
+  "cc-csc",
+  "cc-name",
+  "cc-given-name",
+  "cc-family-name",
+  "current-password",
+  "new-password",
+  "one-time-code"
+]);
+var MASK_INPUT_TYPES = new Set(["password", "hidden"]);
+var MASK_NAME_PATTERN = /password|secret|token|api[_-]?key|ssn|tax[_-]?id|social[_-]?security|cvv|cvc|pin/i;
+var refCounter = 0;
+function generateNextRef() {
+  refCounter += 1;
+  return `${REF_PREFIX}${refCounter}`;
 }
-
-// src/hooks/useLiveAgent.ts
-import { use } from "react";
-function useLiveAgent() {
-  const ctx = use(LiveAgentContext);
-  if (!ctx) {
-    throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
+function advanceCounterPastExisting(ref) {
+  const parsedRefNumber = Number.parseInt(ref.slice(REF_PREFIX.length), 10);
+  if (Number.isFinite(parsedRefNumber) && parsedRefNumber > refCounter) {
+    refCounter = parsedRefNumber;
   }
-  const { connection, shouldConnect, ...publicValue } = ctx;
-  return publicValue;
 }
-
-// src/hooks/useMediaControls.ts
-import { useLocalParticipant } from "@livekit/components-react/hooks";
-import { ScreenSharePresets } from "livekit-client";
-import { useCallback as useCallback3 } from "react";
-var SCREEN_SHARE_OPTIONS = {
-  video: { displaySurface: "browser" },
-  resolution: ScreenSharePresets.h720fps30.resolution,
-  contentHint: "detail"
-};
-function useMediaControls() {
-  const { localParticipant } = useLocalParticipant();
-  const isMuted = !localParticipant.isMicrophoneEnabled;
-  const isScreenSharing = localParticipant.isScreenShareEnabled;
-  const toggleMute = useCallback3(async () => {
-    try {
-      await localParticipant.setMicrophoneEnabled(isMuted);
-    } catch (error) {
-      console.error("Failed to toggle microphone:", error);
-    }
-  }, [localParticipant, isMuted]);
-  const toggleScreenShare = useCallback3(async () => {
-    try {
-      await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
-    } catch (error) {
-      console.error("Failed to toggle screen share:", error);
-    }
-  }, [localParticipant, isScreenSharing]);
-  return { isMuted, toggleMute, isScreenSharing, toggleScreenShare };
+function intersectsViewport(rect, viewportWidth, viewportHeight) {
+  if (rect.width <= 0 || rect.height <= 0)
+    return false;
+  if (rect.bottom <= 0 || rect.top >= viewportHeight)
+    return false;
+  if (rect.right <= 0 || rect.left >= viewportWidth)
+    return false;
+  return true;
 }
-
-// src/components/AgentStateBanner.tsx
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-function AgentStateBanner() {
-  const { isConnected } = useLiveAgent();
-  const { isScreenSharing } = useMediaControls();
-  const { state } = useAgentVoiceState();
-  if (!isConnected)
-    return null;
-  return /* @__PURE__ */ jsx("div", {
-    className: "skippr:fixed skippr:top-0 skippr:left-0 skippr:right-0 skippr:z-[2147483647] skippr:flex skippr:justify-center skippr:pointer-events-none",
-    children: /* @__PURE__ */ jsx("div", {
-      className: "skippr:pointer-events-auto skippr:flex skippr:items-center skippr:gap-2 skippr:bg-indigo-500/95 skippr:backdrop-blur-sm skippr:text-white skippr:text-xs skippr:font-medium skippr:px-4 skippr:py-1.5 skippr:rounded-b-lg skippr:shadow-lg",
-      children: /* @__PURE__ */ jsx(BannerContent, {
-        state,
-        isScreenSharing
-      })
-    })
-  });
+function isVisible(element, rect) {
+  if (!intersectsViewport(rect, window.innerWidth, window.innerHeight))
+    return false;
+  const style = window.getComputedStyle(element);
+  if (style.visibility === "hidden" || style.display === "none")
+    return false;
+  if (Number.parseFloat(style.opacity || "1") <= 0.01)
+    return false;
+  return true;
 }
-function BannerContent({
-  state,
-  isScreenSharing
-}) {
-  if (state === "speaking") {
-    return /* @__PURE__ */ jsxs(Fragment, {
-      children: [
-        /* @__PURE__ */ jsx(SpeakingBars, {}),
-        /* @__PURE__ */ jsx("span", {
-          children: "Skippr is talking"
-        })
-      ]
-    });
-  }
-  if (state === "thinking") {
-    return /* @__PURE__ */ jsxs(Fragment, {
-      children: [
-        /* @__PURE__ */ jsx(ThinkingDots, {}),
-        /* @__PURE__ */ jsx("span", {
-          children: "Skippr is thinking"
-        })
-      ]
-    });
-  }
-  if (state === "listening" && isScreenSharing) {
-    return /* @__PURE__ */ jsxs(Fragment, {
-      children: [
-        /* @__PURE__ */ jsx(ObservingDot, {}),
-        /* @__PURE__ */ jsx(Eye, {
-          className: "skippr:size-3.5"
-        }),
-        /* @__PURE__ */ jsx("span", {
-          children: "Skippr is observing this page"
-        })
-      ]
-    });
+function isInteractive(element, role) {
+  if (role && role !== "heading" && role !== "image" && role !== "list" && role !== "listitem") {
+    const interactiveRoles = [
+      "button",
+      "link",
+      "input",
+      "select",
+      "textarea",
+      "checkbox",
+      "radio",
+      "tab",
+      "menuitem",
+      "option",
+      "switch",
+      "slider"
+    ];
+    if (interactiveRoles.includes(role))
+      return true;
   }
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [
-      /* @__PURE__ */ jsx(ObservingDot, {}),
-      /* @__PURE__ */ jsx("span", {
-        children: "Skippr is connected"
-      })
-    ]
-  });
+  if (element.tabIndex >= 0)
+    return true;
+  if (element.hasAttribute("onclick") || element.hasAttribute("contenteditable"))
+    return true;
+  return false;
 }
-function ObservingDot() {
-  return /* @__PURE__ */ jsxs("span", {
-    className: "skippr:relative skippr:flex skippr:size-1.5",
-    children: [
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:absolute skippr:inline-flex skippr:size-full skippr:animate-ping skippr:rounded-full skippr:bg-emerald-400 skippr:opacity-75"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:relative skippr:inline-flex skippr:size-1.5 skippr:rounded-full skippr:bg-emerald-400"
-      })
-    ]
-  });
+function isBlindRegion(role) {
+  return role === "video" || role === "iframe" || role === "canvas" || role === "audio" || role === "embed" || role === "object";
 }
-function ThinkingDots() {
-  return /* @__PURE__ */ jsxs("span", {
-    className: "skippr:flex skippr:items-center skippr:gap-[3px]",
-    children: [
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:0ms]"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:150ms]"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:300ms]"
-      })
-    ]
-  });
-}
-function SpeakingBars() {
-  return /* @__PURE__ */ jsxs("span", {
-    className: "skippr:flex skippr:items-center skippr:gap-[2px] skippr:h-3.5",
-    children: [
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_infinite] skippr:h-1.5"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.15s_infinite] skippr:h-3"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.3s_infinite] skippr:h-2"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.45s_infinite] skippr:h-3.5"
-      }),
-      /* @__PURE__ */ jsx("span", {
-        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.6s_infinite] skippr:h-1"
-      })
-    ]
-  });
-}
-
-// src/components/AutoStartMedia.tsx
-import { useConnectionState, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
-import { ConnectionState, Track } from "livekit-client";
-import { useEffect as useEffect3, useRef } from "react";
-function AutoStartMedia({ pendingScreenStream }) {
-  const { localParticipant } = useLocalParticipant2();
-  const connectionState = useConnectionState();
-  const didStartRef = useRef(false);
-  useEffect3(() => {
-    if (didStartRef.current)
-      return;
-    if (connectionState !== ConnectionState.Connected)
-      return;
-    didStartRef.current = true;
-    localParticipant.setMicrophoneEnabled(true).catch((error) => console.error("Failed to enable microphone:", error));
-    if (pendingScreenStream) {
-      const videoTrack = pendingScreenStream.getVideoTracks()[0];
-      if (videoTrack) {
-        videoTrack.contentHint = "detail";
-        localParticipant.publishTrack(videoTrack, { source: Track.Source.ScreenShare }).catch((error) => {
-          console.error("Failed to publish screen share track:", error);
-          for (const track of pendingScreenStream.getTracks())
-            track.stop();
-        });
-      }
-    }
-  }, [connectionState, localParticipant, pendingScreenStream]);
-  return null;
-}
-
-// src/components/DomCapture.tsx
-import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
-import { ConnectionState as ConnectionState2, ScreenSharePresets as ScreenSharePresets2, Track as Track2 } from "livekit-client";
-import { useEffect as useEffect4, useRef as useRef2 } from "react";
-
-// src/capture/a11yUtils.ts
-var ROLE_BY_TAG = {
-  a: "link",
-  button: "button",
-  input: "input",
-  select: "select",
-  textarea: "textarea",
-  label: "label",
-  nav: "navigation",
-  main: "main",
-  header: "header",
-  footer: "footer",
-  aside: "complementary",
-  form: "form",
-  h1: "heading",
-  h2: "heading",
-  h3: "heading",
-  h4: "heading",
-  h5: "heading",
-  h6: "heading",
-  img: "image",
-  ul: "list",
-  ol: "list",
-  li: "listitem",
-  table: "table",
-  tr: "row",
-  td: "cell",
-  th: "columnheader",
-  video: "video",
-  iframe: "iframe",
-  canvas: "canvas",
-  audio: "audio",
-  embed: "embed",
-  object: "object"
-};
-function inferRole(element) {
-  const explicitRole = element.getAttribute("role");
-  if (explicitRole)
-    return explicitRole;
-  const tagName = element.tagName.toLowerCase();
-  if (tagName === "input") {
-    const inputType = element.type;
-    if (inputType === "checkbox")
-      return "checkbox";
-    if (inputType === "radio")
-      return "radio";
-    if (inputType === "submit" || inputType === "button")
-      return "button";
-    return "input";
-  }
-  return ROLE_BY_TAG[tagName] ?? null;
-}
-function accessibleName(element, options = {}) {
-  const ariaLabel = element.getAttribute("aria-label");
-  if (ariaLabel)
-    return ariaLabel.trim().slice(0, NAME_MAX_CHARS);
-  if (!options.quick) {
-    const labelledBy = element.getAttribute("aria-labelledby");
-    if (labelledBy) {
-      const labelElement = document.getElementById(labelledBy);
-      if (labelElement)
-        return (labelElement.textContent || "").trim().slice(0, NAME_MAX_CHARS);
-    }
-    if (element.tagName === "INPUT" || element.tagName === "SELECT" || element.tagName === "TEXTAREA") {
-      const elementId = element.id;
-      if (elementId) {
-        const associatedLabel = document.querySelector(`label[for="${CSS.escape(elementId)}"]`);
-        if (associatedLabel?.textContent) {
-          return associatedLabel.textContent.trim().slice(0, NAME_MAX_CHARS);
-        }
-      }
-      const placeholder = element.getAttribute("placeholder");
-      if (placeholder)
-        return placeholder.trim().slice(0, NAME_MAX_CHARS);
-    }
-  }
-  if (element.tagName === "IMG") {
-    const altText = element.getAttribute("alt");
-    if (altText)
-      return altText.trim().slice(0, NAME_MAX_CHARS);
-  }
-  const titleAttr = element.getAttribute("title");
-  if (titleAttr)
-    return titleAttr.trim().slice(0, NAME_MAX_CHARS);
-  const textContent = (element.textContent || "").replace(/\s+/g, " ").trim();
-  if (textContent)
-    return textContent.slice(0, NAME_MAX_CHARS);
-  return "";
-}
-
-// src/capture/a11yTree.ts
-var REF_PREFIX = "r-";
-var VALUE_MAX_CHARS = 80;
-var HREF_MAX_CHARS = 60;
-var PAGE_CONTENT_MAX_BYTES = 14000;
-var NODE_LIMIT = 1500;
-var SENSITIVE_IFRAME_HOSTS = [
-  "js.stripe.com",
-  "checkout.stripe.com",
-  "connect.stripe.com",
-  "plaid.com",
-  "production.plaid.com",
-  "cdn.plaid.com",
-  "auth0.com",
-  "login.auth0.com",
-  "recaptcha.net",
-  "www.google.com",
-  "hcaptcha.com",
-  "newassets.hcaptcha.com",
-  "challenges.cloudflare.com"
-];
-var MASK_AUTOCOMPLETE_VALUES = new Set([
-  "cc-number",
-  "cc-exp",
-  "cc-exp-month",
-  "cc-exp-year",
-  "cc-csc",
-  "cc-name",
-  "cc-given-name",
-  "cc-family-name",
-  "current-password",
-  "new-password",
-  "one-time-code"
-]);
-var MASK_INPUT_TYPES = new Set(["password", "hidden"]);
-var MASK_NAME_PATTERN = /password|secret|token|api[_-]?key|ssn|tax[_-]?id|social[_-]?security|cvv|cvc|pin/i;
-var refCounter = 0;
-function generateNextRef() {
-  refCounter += 1;
-  return `${REF_PREFIX}${refCounter}`;
-}
-function advanceCounterPastExisting(ref) {
-  const parsedRefNumber = Number.parseInt(ref.slice(REF_PREFIX.length), 10);
-  if (Number.isFinite(parsedRefNumber) && parsedRefNumber > refCounter) {
-    refCounter = parsedRefNumber;
-  }
-}
-function intersectsViewport(rect, viewportWidth, viewportHeight) {
-  if (rect.width <= 0 || rect.height <= 0)
-    return false;
-  if (rect.bottom <= 0 || rect.top >= viewportHeight)
-    return false;
-  if (rect.right <= 0 || rect.left >= viewportWidth)
-    return false;
-  return true;
-}
-function isVisible(element, rect) {
-  if (!intersectsViewport(rect, window.innerWidth, window.innerHeight))
-    return false;
-  const style = window.getComputedStyle(element);
-  if (style.visibility === "hidden" || style.display === "none")
-    return false;
-  if (Number.parseFloat(style.opacity || "1") <= 0.01)
-    return false;
-  return true;
-}
-function isInteractive(element, role) {
-  if (role && role !== "heading" && role !== "image" && role !== "list" && role !== "listitem") {
-    const interactiveRoles = [
-      "button",
-      "link",
-      "input",
-      "select",
-      "textarea",
-      "checkbox",
-      "radio",
-      "tab",
-      "menuitem",
-      "option",
-      "switch",
-      "slider"
-    ];
-    if (interactiveRoles.includes(role))
-      return true;
-  }
-  if (element.tabIndex >= 0)
-    return true;
-  if (element.hasAttribute("onclick") || element.hasAttribute("contenteditable"))
-    return true;
-  return false;
-}
-function isBlindRegion(role) {
-  return role === "video" || role === "iframe" || role === "canvas" || role === "audio" || role === "embed" || role === "object";
-}
-function getIframeHost(element) {
-  const src = element.getAttribute("src");
-  if (!src)
-    return null;
-  try {
-    return new URL(src, window.location.href).host;
-  } catch {
-    return null;
-  }
+function getIframeHost(element) {
+  const src = element.getAttribute("src");
+  if (!src)
+    return null;
+  try {
+    return new URL(src, window.location.href).host;
+  } catch {
+    return null;
+  }
 }
 function isSensitiveIframe(element) {
   const host = getIframeHost(element);
@@ -1160,7 +763,7 @@ function walkAndCollect(element, depth, entries) {
 function dropSmallestAreaEntriesUntilUnderLimit(entries) {
   if (entries.length <= NODE_LIMIT)
     return entries;
-  const indexedEntries = entries.map((entry, index2) => ({ entry, index: index2 }));
+  const indexedEntries = entries.map((entry, index) => ({ entry, index }));
   const entriesByAreaAscending = indexedEntries.slice(1).sort((a, b) => a.entry.area - b.entry.area);
   const indicesToDrop = new Set(entriesByAreaAscending.slice(0, entries.length - NODE_LIMIT).map((indexed) => indexed.index));
   const keptEntries = [];
@@ -1387,7 +990,7 @@ async function snapToCanvas(element, options = {}) {
 // src/components/DomCapture.tsx
 var SNAPSHOT_INTERVAL_MS = 2000;
 var A11Y_PUBLISH_INTERVAL_MS = 2000;
-var CAPTURE_PRESET = ScreenSharePresets2.h1080fps30;
+var CAPTURE_PRESET = ScreenSharePresets.h1080fps30;
 var CAPTURE_FPS = CAPTURE_PRESET.encoding.maxFramerate ?? 30;
 var CAPTURE_BITRATE = 4000000;
 var DOM_SNAPSHOT_GZIP_THRESHOLD_BYTES = 14000;
@@ -1492,7 +1095,7 @@ async function unpublishAndStopTrack(localParticipant, videoTrack) {
   videoTrack.stop();
 }
 function DomCapture() {
-  const { localParticipant } = useLocalParticipant3();
+  const { localParticipant } = useLocalParticipant2();
   const connectionState = useConnectionState2();
   const didStartRef = useRef2(false);
   useEffect4(() => {
@@ -1591,8 +1194,8 @@ function DomCapture() {
 
 // src/components/HighlightOverlay.tsx
 import { useDataChannel } from "@livekit/components-react/hooks";
-import { useCallback as useCallback4, useEffect as useEffect5, useRef as useRef3, useState as useState3 } from "react";
-import { jsx as jsx2, jsxs as jsxs2, Fragment as Fragment2 } from "react/jsx-runtime";
+import { useCallback as useCallback3, useEffect as useEffect5, useRef as useRef3, useState as useState3 } from "react";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 var TOOLTIP_MAX_WIDTH = 280;
 var TOOLTIP_GAP = 8;
 var VIEWPORT_MARGIN = 8;
@@ -1703,11 +1306,11 @@ function HighlightOverlay() {
   const [overlayState, setOverlayState] = useState3(null);
   const targetElementRef = useRef3(null);
   const pendingFrameRef = useRef3(null);
-  const clearOverlay = useCallback4(() => {
+  const clearOverlay = useCallback3(() => {
     targetElementRef.current = null;
     setOverlayState(null);
   }, []);
-  const recomputeRect = useCallback4(() => {
+  const recomputeRect = useCallback3(() => {
     pendingFrameRef.current = null;
     const target = targetElementRef.current;
     if (!target)
@@ -1719,12 +1322,12 @@ function HighlightOverlay() {
     const rect2 = getRectInTopViewport(target);
     setOverlayState((prev) => prev ? { ...prev, rect: rect2 } : prev);
   }, [clearOverlay]);
-  const scheduleRecompute = useCallback4(() => {
+  const scheduleRecompute = useCallback3(() => {
     if (pendingFrameRef.current !== null)
       return;
     pendingFrameRef.current = window.requestAnimationFrame(recomputeRect);
   }, [recomputeRect]);
-  const onHighlightMessage = useCallback4((msg) => {
+  const onHighlightMessage = useCallback3((msg) => {
     const parsed = parseHighlightMessage(msg.payload);
     if (!parsed)
       return;
@@ -1762,93 +1365,514 @@ function HighlightOverlay() {
       win.addEventListener("scroll", onScroll, { capture: true, passive: true });
       win.addEventListener("resize", onResize, { passive: true });
     }
-    const resizeObserver = new ResizeObserver(scheduleRecompute);
-    resizeObserver.observe(target);
-    const scrollContainer = findScrollableAncestor(target);
-    const mutationObserver = new MutationObserver(() => {
-      if (!targetElementRef.current?.isConnected) {
-        clearOverlay();
-        return;
-      }
-      scheduleRecompute();
-    });
-    mutationObserver.observe(scrollContainer, { childList: true, subtree: true });
-    return () => {
-      for (const win of watchedWindows) {
-        win.removeEventListener("scroll", onScroll, { capture: true });
-        win.removeEventListener("resize", onResize);
-      }
-      resizeObserver.disconnect();
-      mutationObserver.disconnect();
-      if (pendingFrameRef.current !== null) {
-        window.cancelAnimationFrame(pendingFrameRef.current);
-        pendingFrameRef.current = null;
-      }
-    };
-  }, [overlayState, scheduleRecompute, clearOverlay]);
-  if (!overlayState)
-    return null;
-  const { rect, message } = overlayState;
-  const ringStyle = {
-    position: "fixed",
-    left: `${rect.left}px`,
-    top: `${rect.top}px`,
-    width: `${rect.width}px`,
-    height: `${rect.height}px`,
-    pointerEvents: "none",
-    zIndex: Z_INDEX,
-    boxShadow: `0 0 0 2px ${RING_INNER}, 0 0 0 6px ${RING_OUTER}`,
-    borderRadius: "4px",
-    transition: "none"
+    const resizeObserver = new ResizeObserver(scheduleRecompute);
+    resizeObserver.observe(target);
+    const scrollContainer = findScrollableAncestor(target);
+    const mutationObserver = new MutationObserver(() => {
+      if (!targetElementRef.current?.isConnected) {
+        clearOverlay();
+        return;
+      }
+      scheduleRecompute();
+    });
+    mutationObserver.observe(scrollContainer, { childList: true, subtree: true });
+    return () => {
+      for (const win of watchedWindows) {
+        win.removeEventListener("scroll", onScroll, { capture: true });
+        win.removeEventListener("resize", onResize);
+      }
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+      if (pendingFrameRef.current !== null) {
+        window.cancelAnimationFrame(pendingFrameRef.current);
+        pendingFrameRef.current = null;
+      }
+    };
+  }, [overlayState, scheduleRecompute, clearOverlay]);
+  if (!overlayState)
+    return null;
+  const { rect, message } = overlayState;
+  const ringStyle = {
+    position: "fixed",
+    left: `${rect.left}px`,
+    top: `${rect.top}px`,
+    width: `${rect.width}px`,
+    height: `${rect.height}px`,
+    pointerEvents: "none",
+    zIndex: Z_INDEX,
+    boxShadow: `0 0 0 2px ${RING_INNER}, 0 0 0 6px ${RING_OUTER}`,
+    borderRadius: "4px",
+    transition: "none"
+  };
+  const showTooltipBelow = rect.top < TOOLTIP_TOP_THRESHOLD;
+  const tooltipTop = showTooltipBelow ? rect.bottom + TOOLTIP_GAP : rect.top - TOOLTIP_GAP;
+  const tooltipTransform = showTooltipBelow ? "translateY(0)" : "translateY(-100%)";
+  const tooltipLeft = Math.min(Math.max(rect.left, VIEWPORT_MARGIN), window.innerWidth - TOOLTIP_MAX_WIDTH - VIEWPORT_MARGIN);
+  const tooltipStyle = {
+    position: "fixed",
+    left: `${tooltipLeft}px`,
+    top: `${tooltipTop}px`,
+    transform: tooltipTransform,
+    maxWidth: `${TOOLTIP_MAX_WIDTH}px`,
+    pointerEvents: "none",
+    zIndex: Z_INDEX,
+    background: "rgba(45, 43, 61, 0.96)",
+    color: "#ffffff",
+    padding: "6px 10px",
+    borderRadius: "8px",
+    fontSize: "13px",
+    lineHeight: "1.35",
+    fontFamily: 'ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Inter, sans-serif',
+    boxShadow: "0 6px 20px rgba(0, 0, 0, 0.25)",
+    whiteSpace: "normal",
+    wordWrap: "break-word"
+  };
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [
+      /* @__PURE__ */ jsx("div", {
+        "data-skippr-private": "true",
+        style: ringStyle,
+        "aria-hidden": "true"
+      }),
+      message && /* @__PURE__ */ jsx("div", {
+        "data-skippr-private": "true",
+        style: tooltipStyle,
+        role: "tooltip",
+        children: message
+      })
+    ]
+  });
+}
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
+import { forwardRef as forwardRef2, createElement as createElement3 } from "react";
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.js
+var mergeClasses = (...classes) => classes.filter((className, index, array) => {
+  return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
+}).join(" ").trim();
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.js
+var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.js
+var toCamelCase = (string) => string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase());
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.js
+var toPascalCase = (string) => {
+  const camelCase = toCamelCase(string);
+  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
+};
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
+import { forwardRef, createElement as createElement2 } from "react";
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/defaultAttributes.js
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.js
+var hasA11yProp = (props) => {
+  for (const prop in props) {
+    if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
+      return true;
+    }
+  }
+  return false;
+};
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
+import { createContext as createContext2, useContext, useMemo, createElement } from "react";
+"use client";
+var LucideContext = createContext2({});
+var useLucideContext = () => useContext(LucideContext);
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
+"use client";
+var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
+  const {
+    size: contextSize = 24,
+    strokeWidth: contextStrokeWidth = 2,
+    absoluteStrokeWidth: contextAbsoluteStrokeWidth = false,
+    color: contextColor = "currentColor",
+    className: contextClass = ""
+  } = useLucideContext() ?? {};
+  const calculatedStrokeWidth = absoluteStrokeWidth ?? contextAbsoluteStrokeWidth ? Number(strokeWidth ?? contextStrokeWidth) * 24 / Number(size ?? contextSize) : strokeWidth ?? contextStrokeWidth;
+  return createElement2("svg", {
+    ref,
+    ...defaultAttributes,
+    width: size ?? contextSize ?? defaultAttributes.width,
+    height: size ?? contextSize ?? defaultAttributes.height,
+    stroke: color ?? contextColor,
+    strokeWidth: calculatedStrokeWidth,
+    className: mergeClasses("lucide", contextClass, className),
+    ...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
+    ...rest
+  }, [
+    ...iconNode.map(([tag, attrs]) => createElement2(tag, attrs)),
+    ...Array.isArray(children) ? children : [children]
+  ]);
+});
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
+var createLucideIcon = (iconName, iconNode) => {
+  const Component = forwardRef2(({ className, ...props }, ref) => createElement3(Icon, {
+    ref,
+    iconNode,
+    className: mergeClasses(`lucide-${toKebabCase(toPascalCase(iconName))}`, `lucide-${iconName}`, className),
+    ...props
+  }));
+  Component.displayName = toPascalCase(iconName);
+  return Component;
+};
+
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle-check.js
+var __iconNode = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
+];
+var CircleCheck = createLucideIcon("circle-check", __iconNode);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/loader-circle.js
+var __iconNode2 = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]];
+var LoaderCircle = createLucideIcon("loader-circle", __iconNode2);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/sparkles.js
+var __iconNode3 = [
+  [
+    "path",
+    {
+      d: "M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z",
+      key: "1s2grr"
+    }
+  ],
+  ["path", { d: "M20 2v4", key: "1rf3ol" }],
+  ["path", { d: "M22 4h-4", key: "gwowj6" }],
+  ["circle", { cx: "4", cy: "20", r: "2", key: "6kqj1y" }]
+];
+var Sparkles = createLucideIcon("sparkles", __iconNode3);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/calendar.js
+var __iconNode4 = [
+  ["path", { d: "M8 2v4", key: "1cmpym" }],
+  ["path", { d: "M16 2v4", key: "4m81vk" }],
+  ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
+  ["path", { d: "M3 10h18", key: "8toen8" }]
+];
+var Calendar = createLucideIcon("calendar", __iconNode4);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/chevron-down.js
+var __iconNode5 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+var ChevronDown = createLucideIcon("chevron-down", __iconNode5);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/circle.js
+var __iconNode6 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
+var Circle = createLucideIcon("circle", __iconNode6);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mail.js
+var __iconNode7 = [
+  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
+  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
+];
+var Mail = createLucideIcon("mail", __iconNode7);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-circle.js
+var __iconNode8 = [
+  [
+    "path",
+    {
+      d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719",
+      key: "1sd12s"
+    }
+  ]
+];
+var MessageCircle = createLucideIcon("message-circle", __iconNode8);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/message-square.js
+var __iconNode9 = [
+  [
+    "path",
+    {
+      d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
+      key: "18887p"
+    }
+  ]
+];
+var MessageSquare = createLucideIcon("message-square", __iconNode9);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic-off.js
+var __iconNode10 = [
+  ["path", { d: "M12 19v3", key: "npa21l" }],
+  ["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
+  ["path", { d: "M16.95 16.95A7 7 0 0 1 5 12v-2", key: "cqa7eg" }],
+  ["path", { d: "M18.89 13.23A7 7 0 0 0 19 12v-2", key: "16hl24" }],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
+  ["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }]
+];
+var MicOff = createLucideIcon("mic-off", __iconNode10);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/mic.js
+var __iconNode11 = [
+  ["path", { d: "M12 19v3", key: "npa21l" }],
+  ["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
+  ["rect", { x: "9", y: "2", width: "6", height: "13", rx: "3", key: "s6n7sd" }]
+];
+var Mic = createLucideIcon("mic", __iconNode11);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/minimize-2.js
+var __iconNode12 = [
+  ["path", { d: "m14 10 7-7", key: "oa77jy" }],
+  ["path", { d: "M20 10h-6V4", key: "mjg0md" }],
+  ["path", { d: "m3 21 7-7", key: "tjx5ai" }],
+  ["path", { d: "M4 14h6v6", key: "rmj7iw" }]
+];
+var Minimize2 = createLucideIcon("minimize-2", __iconNode12);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor-off.js
+var __iconNode13 = [
+  ["path", { d: "M12 17v4", key: "1riwvh" }],
+  ["path", { d: "M17 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 1.184-1.826", key: "cv7jms" }],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }],
+  ["path", { d: "M8 21h8", key: "1ev6f3" }],
+  ["path", { d: "M8.656 3H20a2 2 0 0 1 2 2v10a2 2 0 0 1-.293 1.042", key: "z8ni2w" }]
+];
+var MonitorOff = createLucideIcon("monitor-off", __iconNode13);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/monitor.js
+var __iconNode14 = [
+  ["rect", { width: "20", height: "14", x: "2", y: "3", rx: "2", key: "48i651" }],
+  ["line", { x1: "8", x2: "16", y1: "21", y2: "21", key: "1svkeh" }],
+  ["line", { x1: "12", x2: "12", y1: "17", y2: "21", key: "vw1qmm" }]
+];
+var Monitor = createLucideIcon("monitor", __iconNode14);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/phone-off.js
+var __iconNode15 = [
+  [
+    "path",
+    {
+      d: "M10.1 13.9a14 14 0 0 0 3.732 2.668 1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2 18 18 0 0 1-12.728-5.272",
+      key: "1wngk7"
+    }
+  ],
+  ["path", { d: "M22 2 2 22", key: "y4kqgn" }],
+  [
+    "path",
+    {
+      d: "M4.76 13.582A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 .244.473",
+      key: "10hv5p"
+    }
+  ]
+];
+var PhoneOff = createLucideIcon("phone-off", __iconNode15);
+// ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/send.js
+var __iconNode16 = [
+  [
+    "path",
+    {
+      d: "M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z",
+      key: "1ffxy3"
+    }
+  ],
+  ["path", { d: "m21.854 2.147-10.94 10.939", key: "12cjpa" }]
+];
+var Send = createLucideIcon("send", __iconNode16);
+// src/components/MinimizedBubble.tsx
+import { useEffect as useEffect6 } from "react";
+
+// src/hooks/useLiveAgent.ts
+import { use } from "react";
+function useLiveAgent() {
+  const ctx = use(LiveAgentContext);
+  if (!ctx) {
+    throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
+  }
+  const { connection, shouldConnect, ...publicValue } = ctx;
+  return publicValue;
+}
+
+// src/hooks/useMediaControls.ts
+import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
+import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
+import { useCallback as useCallback4 } from "react";
+var SCREEN_SHARE_OPTIONS = {
+  video: { displaySurface: "browser" },
+  resolution: ScreenSharePresets2.h720fps30.resolution,
+  contentHint: "detail"
+};
+function useMediaControls() {
+  const { localParticipant } = useLocalParticipant3();
+  const isMuted = !localParticipant.isMicrophoneEnabled;
+  const isScreenSharing = localParticipant.isScreenShareEnabled;
+  const toggleMute = useCallback4(async () => {
+    try {
+      await localParticipant.setMicrophoneEnabled(isMuted);
+    } catch (error) {
+      console.error("Failed to toggle microphone:", error);
+    }
+  }, [localParticipant, isMuted]);
+  const toggleScreenShare = useCallback4(async () => {
+    try {
+      await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
+    } catch (error) {
+      console.error("Failed to toggle screen share:", error);
+    }
+  }, [localParticipant, isScreenSharing]);
+  return { isMuted, toggleMute, isScreenSharing, toggleScreenShare };
+}
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/hooks/useAgentVoiceState.ts
+import { useVoiceAssistant } from "@livekit/components-react/hooks";
+function useAgentVoiceState() {
+  const { state } = useVoiceAssistant();
+  return {
+    state,
+    isSpeaking: state === "speaking",
+    isListening: state === "listening"
   };
-  const showTooltipBelow = rect.top < TOOLTIP_TOP_THRESHOLD;
-  const tooltipTop = showTooltipBelow ? rect.bottom + TOOLTIP_GAP : rect.top - TOOLTIP_GAP;
-  const tooltipTransform = showTooltipBelow ? "translateY(0)" : "translateY(-100%)";
-  const tooltipLeft = Math.min(Math.max(rect.left, VIEWPORT_MARGIN), window.innerWidth - TOOLTIP_MAX_WIDTH - VIEWPORT_MARGIN);
-  const tooltipStyle = {
-    position: "fixed",
-    left: `${tooltipLeft}px`,
-    top: `${tooltipTop}px`,
-    transform: tooltipTransform,
-    maxWidth: `${TOOLTIP_MAX_WIDTH}px`,
-    pointerEvents: "none",
-    zIndex: Z_INDEX,
-    background: "rgba(45, 43, 61, 0.96)",
-    color: "#ffffff",
-    padding: "6px 10px",
-    borderRadius: "8px",
-    fontSize: "13px",
-    lineHeight: "1.35",
-    fontFamily: 'ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Inter, sans-serif',
-    boxShadow: "0 6px 20px rgba(0, 0, 0, 0.25)",
-    whiteSpace: "normal",
-    wordWrap: "break-word"
+}
+
+// src/components/LauncherStatusPill.tsx
+import { jsx as jsx2, jsxs as jsxs2, Fragment as Fragment2 } from "react/jsx-runtime";
+function pillStatusFromAgent(state, canSeePage) {
+  if (state === "speaking")
+    return "talking";
+  if (state === "thinking")
+    return "thinking";
+  return canSeePage ? "observing" : "connected";
+}
+function LauncherStatusPill() {
+  const { isConnected, expandPanel, setSidebarTab, position, captureMode } = useLiveAgent();
+  const { state } = useAgentVoiceState();
+  const { isScreenSharing } = useMediaControls();
+  if (!isConnected)
+    return null;
+  const canSeePage = captureMode === "auto" || isScreenSharing;
+  const status = pillStatusFromAgent(state, canSeePage);
+  const openChat = () => {
+    setSidebarTab("chat");
+    expandPanel();
   };
-  return /* @__PURE__ */ jsxs2(Fragment2, {
+  return /* @__PURE__ */ jsx2("button", {
+    type: "button",
+    onClick: openChat,
+    className: cn("skippr:fixed skippr:bottom-20 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", "skippr:rounded-full skippr:bg-bubble/95 skippr:backdrop-blur-sm", "skippr:px-3 skippr:py-1.5", "skippr:text-xs skippr:font-medium skippr:text-white", "skippr:shadow-[0_8px_24px_rgba(45,43,61,0.35)]", "skippr:cursor-pointer skippr:transition-colors skippr:hover:bg-bubble", "skippr:animate-[skippr-bubble-in_0.28s_ease-out]", position === "right" ? "skippr:right-6" : "skippr:left-6"),
+    "aria-label": `Skippr is ${status} — click to open chat`,
+    children: /* @__PURE__ */ jsxs2("span", {
+      className: "skippr:flex skippr:items-center skippr:gap-2 skippr:animate-[skippr-pill-content_0.22s_ease-out]",
+      children: [
+        status === "observing" && /* @__PURE__ */ jsxs2(Fragment2, {
+          children: [
+            /* @__PURE__ */ jsx2(ObservingIcon, {}),
+            /* @__PURE__ */ jsx2("span", {
+              children: "Skippr is observing"
+            })
+          ]
+        }),
+        status === "connected" && /* @__PURE__ */ jsxs2(Fragment2, {
+          children: [
+            /* @__PURE__ */ jsx2(ConnectedDot, {}),
+            /* @__PURE__ */ jsx2("span", {
+              children: "Skippr is connected"
+            })
+          ]
+        }),
+        status === "talking" && /* @__PURE__ */ jsxs2(Fragment2, {
+          children: [
+            /* @__PURE__ */ jsx2(SpeakingBars, {}),
+            /* @__PURE__ */ jsx2("span", {
+              children: "Skippr is talking"
+            })
+          ]
+        }),
+        status === "thinking" && /* @__PURE__ */ jsxs2(Fragment2, {
+          children: [
+            /* @__PURE__ */ jsx2(ThinkingDots, {}),
+            /* @__PURE__ */ jsx2("span", {
+              children: "Skippr is thinking"
+            })
+          ]
+        })
+      ]
+    }, status)
+  });
+}
+function ConnectedDot() {
+  return /* @__PURE__ */ jsxs2("span", {
+    className: "skippr:relative skippr:flex skippr:size-2",
     children: [
-      /* @__PURE__ */ jsx2("div", {
-        "data-skippr-private": "true",
-        style: ringStyle,
-        "aria-hidden": "true"
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:absolute skippr:inline-flex skippr:size-full skippr:animate-ping skippr:rounded-full skippr:bg-emerald-400 skippr:opacity-75"
       }),
-      message && /* @__PURE__ */ jsx2("div", {
-        "data-skippr-private": "true",
-        style: tooltipStyle,
-        role: "tooltip",
-        children: message
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:relative skippr:inline-flex skippr:size-2 skippr:rounded-full skippr:bg-emerald-400"
       })
     ]
   });
 }
-
-// src/components/MinimizedBubble.tsx
-import { useEffect as useEffect6 } from "react";
-
-// src/lib/utils.ts
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
+function ObservingIcon() {
+  return /* @__PURE__ */ jsxs2("svg", {
+    viewBox: "0 0 24 24",
+    className: "skippr:size-3.5",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true",
+    children: [
+      /* @__PURE__ */ jsx2("path", {
+        d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"
+      }),
+      /* @__PURE__ */ jsx2("circle", {
+        cx: "12",
+        cy: "12",
+        r: "3",
+        fill: "currentColor",
+        stroke: "none",
+        className: "skippr:origin-center skippr:animate-[skippr-banner-look_2.4s_ease-in-out_infinite]"
+      })
+    ]
+  });
+}
+function SpeakingBars() {
+  return /* @__PURE__ */ jsxs2("span", {
+    className: "skippr:flex skippr:items-center skippr:gap-[2px] skippr:h-3.5",
+    children: [
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_infinite] skippr:h-1.5"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.15s_infinite] skippr:h-3"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.3s_infinite] skippr:h-2"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.45s_infinite] skippr:h-3.5"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:w-[2px] skippr:rounded-sm skippr:bg-white skippr:animate-[skippr-speak_1.1s_ease-in-out_0.6s_infinite] skippr:h-1"
+      })
+    ]
+  });
+}
+function ThinkingDots() {
+  return /* @__PURE__ */ jsxs2("span", {
+    className: "skippr:flex skippr:items-center skippr:gap-[3px]",
+    children: [
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:0ms]"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:150ms]"
+      }),
+      /* @__PURE__ */ jsx2("span", {
+        className: "skippr:size-1 skippr:rounded-full skippr:bg-white skippr:animate-bounce skippr:[animation-delay:300ms]"
+      })
+    ]
+  });
 }
 
 // src/components/Logo.tsx
@@ -1933,115 +1957,72 @@ function Logo({ className }) {
   });
 }
 
-// src/components/ui/tooltip.tsx
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var ALIGN_CLASSES = {
-  center: "skippr:left-1/2 skippr:-translate-x-1/2",
-  start: "skippr:left-0",
-  end: "skippr:right-0"
-};
-function Tooltip({ label, children, position = "top", align = "center" }) {
-  return /* @__PURE__ */ jsxs4("span", {
-    className: "skippr:relative skippr:inline-flex skippr:group",
-    children: [
-      children,
-      /* @__PURE__ */ jsx4("span", {
-        className: cn("skippr:pointer-events-none skippr:absolute skippr:z-10", "skippr:whitespace-nowrap skippr:rounded-md skippr:bg-foreground skippr:px-2 skippr:py-1", "skippr:text-[11px] skippr:text-background skippr:font-medium", "skippr:opacity-0 skippr:scale-95 skippr:transition-all skippr:duration-150", "skippr:group-hover:opacity-100 skippr:group-hover:scale-100", "skippr:group-focus-within:opacity-100 skippr:group-focus-within:scale-100", ALIGN_CLASSES[align], position === "top" && "skippr:bottom-full skippr:mb-1.5", position === "bottom" && "skippr:top-full skippr:mt-1.5"),
-        "aria-hidden": "true",
-        children: label
-      })
-    ]
-  });
-}
-
 // src/components/MinimizedBubble.tsx
-import { jsx as jsx5, jsxs as jsxs5, Fragment as Fragment3 } from "react/jsx-runtime";
-var BUBBLE_BUTTON = "skippr:flex skippr:size-12 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-[14px] skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all skippr:hover:-translate-y-0.5 skippr:active:translate-y-0";
-function ConnectedBubbleContent() {
-  const { expandPanel, disconnect, position, captureMode } = useLiveAgent();
+import { jsx as jsx4, jsxs as jsxs4, Fragment as Fragment3 } from "react/jsx-runtime";
+var CONTROL_BUTTON = "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center skippr:rounded-[14px] skippr:cursor-pointer skippr:transition-all skippr:hover:-translate-y-0.5 skippr:active:translate-y-0";
+var CONTROL_SHADOW = "skippr:shadow-[0_4px_16px_rgba(0,0,0,0.15),0_2px_4px_rgba(0,0,0,0.1)]";
+function ConnectedLauncher() {
+  const { expandPanel, disconnect, captureMode, setSidebarTab } = useLiveAgent();
   const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
-  const tooltipAlign = position === "right" ? "end" : "start";
   const showScreenShareToggle = captureMode === "screenshare";
-  return /* @__PURE__ */ jsxs5(Fragment3, {
+  const openChat = () => {
+    setSidebarTab("chat");
+    expandPanel();
+  };
+  return /* @__PURE__ */ jsxs4(Fragment3, {
     children: [
-      /* @__PURE__ */ jsx5(Tooltip, {
-        label: isMuted ? "Unmute" : "Mute",
-        align: tooltipAlign,
-        children: /* @__PURE__ */ jsx5("button", {
-          type: "button",
-          onClick: toggleMute,
-          "aria-label": isMuted ? "Unmute" : "Mute",
-          className: cn(BUBBLE_BUTTON, isMuted ? "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
-          children: isMuted ? /* @__PURE__ */ jsx5(MicOff, {
-            className: "skippr:size-5"
-          }) : /* @__PURE__ */ jsx5(Mic, {
-            className: "skippr:size-5"
-          })
+      /* @__PURE__ */ jsx4("button", {
+        type: "button",
+        onClick: toggleMute,
+        "aria-label": isMuted ? "Unmute" : "Mute",
+        className: cn(CONTROL_BUTTON, CONTROL_SHADOW, isMuted ? "skippr:bg-destructive/10 skippr:text-destructive skippr:hover:bg-destructive/20" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
+        children: isMuted ? /* @__PURE__ */ jsx4(MicOff, {
+          className: "skippr:size-5"
+        }) : /* @__PURE__ */ jsx4(Mic, {
+          className: "skippr:size-5"
         })
       }),
-      showScreenShareToggle && /* @__PURE__ */ jsx5(Tooltip, {
-        label: isScreenSharing ? "Stop sharing" : "Share screen",
-        align: tooltipAlign,
-        children: /* @__PURE__ */ jsx5("button", {
-          type: "button",
-          onClick: toggleScreenShare,
-          "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
-          className: cn(BUBBLE_BUTTON, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:brightness-110" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
-          children: isScreenSharing ? /* @__PURE__ */ jsx5(MonitorOff, {
-            className: "skippr:size-5"
-          }) : /* @__PURE__ */ jsx5(Monitor, {
-            className: "skippr:size-5"
-          })
+      showScreenShareToggle && /* @__PURE__ */ jsx4("button", {
+        type: "button",
+        onClick: toggleScreenShare,
+        "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
+        className: cn(CONTROL_BUTTON, CONTROL_SHADOW, isScreenSharing ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-white skippr:text-foreground skippr:hover:bg-muted"),
+        children: isScreenSharing ? /* @__PURE__ */ jsx4(MonitorOff, {
+          className: "skippr:size-5"
+        }) : /* @__PURE__ */ jsx4(Monitor, {
+          className: "skippr:size-5"
         })
       }),
-      /* @__PURE__ */ jsx5(Tooltip, {
-        label: "End session",
-        align: tooltipAlign,
-        children: /* @__PURE__ */ jsx5("button", {
-          type: "button",
-          onClick: () => disconnect(),
-          "aria-label": "End session",
-          className: cn(BUBBLE_BUTTON, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90"),
-          children: /* @__PURE__ */ jsx5(PhoneOff, {
-            className: "skippr:size-5"
-          })
+      /* @__PURE__ */ jsx4("button", {
+        type: "button",
+        onClick: () => disconnect(),
+        "aria-label": "End session",
+        className: cn(CONTROL_BUTTON, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90", "skippr:shadow-[0_4px_16px_rgba(217,79,79,0.45),0_2px_4px_rgba(0,0,0,0.1)]"),
+        children: /* @__PURE__ */ jsx4(PhoneOff, {
+          className: "skippr:size-5"
         })
       }),
-      /* @__PURE__ */ jsx5(Tooltip, {
-        label: "Open chat & transcript",
-        align: tooltipAlign,
-        children: /* @__PURE__ */ jsx5("button", {
-          type: "button",
-          onClick: expandPanel,
-          "aria-label": "Open chat & transcript",
-          className: cn(BUBBLE_BUTTON, "skippr:bg-bubble skippr:hover:brightness-110"),
-          children: /* @__PURE__ */ jsx5(Logo, {
-            className: "skippr:size-7"
-          })
+      /* @__PURE__ */ jsx4("button", {
+        type: "button",
+        onClick: openChat,
+        "aria-label": "Open chat",
+        className: cn(CONTROL_BUTTON, "skippr:bg-bubble skippr:text-white skippr:overflow-hidden", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:hover:shadow-[0_6px_24px_rgba(45,43,61,0.55),0_4px_8px_rgba(0,0,0,0.1)]"),
+        children: /* @__PURE__ */ jsx4(MessageSquare, {
+          className: "skippr:size-5"
         })
       })
     ]
   });
 }
-function IdleBubbleContent() {
-  const { expandPanel, position } = useLiveAgent();
-  const tooltipAlign = position === "right" ? "end" : "start";
-  return /* @__PURE__ */ jsx5(Tooltip, {
-    label: "Open Skippr assistant",
-    align: tooltipAlign,
-    children: /* @__PURE__ */ jsxs5("button", {
-      type: "button",
-      onClick: expandPanel,
-      "aria-label": "Skippr assistant",
-      className: cn(BUBBLE_BUTTON, "skippr:relative skippr:bg-bubble skippr:hover:brightness-110"),
-      children: [
-        /* @__PURE__ */ jsx5(Logo, {
-          className: "skippr:relative skippr:z-10 skippr:size-7"
-        }),
-        /* @__PURE__ */ jsx5("span", {
-          className: "skippr:absolute skippr:-inset-[3px] skippr:animate-pulse skippr:rounded-[17px] skippr:border-2 skippr:border-bubble/50"
-        })
-      ]
+function IdleLauncher() {
+  const { expandPanel } = useLiveAgent();
+  return /* @__PURE__ */ jsx4("button", {
+    type: "button",
+    onClick: expandPanel,
+    "aria-label": "Skippr assistant",
+    className: cn("skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[14px] skippr:bg-bubble skippr:cursor-pointer", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:transition-all skippr:hover:-translate-y-0.5 skippr:active:translate-y-0"),
+    children: /* @__PURE__ */ jsx4(Logo, {
+      className: "skippr:size-7"
     })
   });
 }
@@ -2054,14 +2035,14 @@ function WelcomeBubble({
     const timer = setTimeout(onDismiss, 5000);
     return () => clearTimeout(timer);
   }, [onDismiss]);
-  return /* @__PURE__ */ jsxs5("button", {
+  return /* @__PURE__ */ jsxs4("button", {
     type: "button",
     className: cn("skippr:absolute skippr:bottom-full skippr:mb-3", "skippr:max-w-64 skippr:rounded-xl skippr:bg-card skippr:shadow-lg", "skippr:border skippr:border-border skippr:px-4 skippr:py-3", "skippr:text-sm skippr:text-foreground skippr:leading-relaxed skippr:text-left", "skippr:animate-[skippr-fade-in_0.3s_ease-out]", "skippr:cursor-pointer", position === "right" ? "skippr:right-0" : "skippr:left-0"),
     onClick: onDismiss,
     "aria-label": "Dismiss",
     children: [
       message,
-      /* @__PURE__ */ jsx5("span", {
+      /* @__PURE__ */ jsx4("span", {
         className: cn("skippr:absolute skippr:top-full skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", "skippr:rotate-[225deg]", position === "right" ? "skippr:right-5" : "skippr:left-5", "skippr:-mt-[5px]")
       })
     ]
@@ -2074,15 +2055,20 @@ function MinimizedBubble({
 }) {
   const { isConnected, isStarting, position } = useLiveAgent();
   const inSession = isConnected || isStarting;
-  return /* @__PURE__ */ jsxs5("div", {
-    className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", position === "right" ? "skippr:right-6" : "skippr:left-6"),
+  return /* @__PURE__ */ jsxs4(Fragment3, {
     children: [
-      welcomeMessage && !inSession && !welcomeDismissed && /* @__PURE__ */ jsx5(WelcomeBubble, {
-        message: welcomeMessage,
-        position,
-        onDismiss: onDismissWelcome
-      }),
-      inSession ? /* @__PURE__ */ jsx5(ConnectedBubbleContent, {}) : /* @__PURE__ */ jsx5(IdleBubbleContent, {})
+      /* @__PURE__ */ jsx4(LauncherStatusPill, {}),
+      /* @__PURE__ */ jsxs4("div", {
+        className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9999]", "skippr:flex skippr:items-center skippr:gap-2", position === "right" ? "skippr:right-6" : "skippr:left-6"),
+        children: [
+          welcomeMessage && !inSession && !welcomeDismissed && /* @__PURE__ */ jsx4(WelcomeBubble, {
+            message: welcomeMessage,
+            position,
+            onDismiss: onDismissWelcome
+          }),
+          inSession ? /* @__PURE__ */ jsx4(ConnectedLauncher, {}) : /* @__PURE__ */ jsx4(IdleLauncher, {})
+        ]
+      })
     ]
   });
 }
@@ -2284,50 +2270,50 @@ function useElapsedSeconds(isRunning) {
 }
 
 // src/components/ChatHeader.tsx
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function ChatHeader() {
   const { isConnected, minimizePanel, minimizable } = useLiveAgent();
   const elapsed = useElapsedSeconds(isConnected);
-  return /* @__PURE__ */ jsxs6("header", {
+  return /* @__PURE__ */ jsxs5("header", {
     className: "skippr:sticky skippr:top-0 skippr:z-10 skippr:flex skippr:shrink-0 skippr:items-center skippr:justify-between skippr:border-b skippr:border-border skippr:bg-primary skippr:px-4 skippr:py-3",
     children: [
-      /* @__PURE__ */ jsx6("p", {
+      /* @__PURE__ */ jsx5("p", {
         className: "skippr:text-sm skippr:font-semibold skippr:text-primary-foreground",
         children: "Skippr"
       }),
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs5("div", {
         className: "skippr:flex skippr:items-center skippr:gap-2",
         children: [
-          isConnected && /* @__PURE__ */ jsxs6("div", {
+          isConnected && /* @__PURE__ */ jsxs5("div", {
             className: "skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-primary-foreground/20 skippr:px-2.5 skippr:py-1",
             children: [
-              /* @__PURE__ */ jsxs6("span", {
+              /* @__PURE__ */ jsxs5("span", {
                 className: "skippr:relative skippr:flex skippr:size-1.5",
                 children: [
-                  /* @__PURE__ */ jsx6("span", {
+                  /* @__PURE__ */ jsx5("span", {
                     className: "skippr:absolute skippr:inline-flex skippr:h-full skippr:w-full skippr:animate-ping skippr:rounded-full skippr:bg-red-400 skippr:opacity-75"
                   }),
-                  /* @__PURE__ */ jsx6("span", {
+                  /* @__PURE__ */ jsx5("span", {
                     className: "skippr:relative skippr:inline-flex skippr:size-1.5 skippr:rounded-full skippr:bg-red-400"
                   })
                 ]
               }),
-              /* @__PURE__ */ jsx6("span", {
+              /* @__PURE__ */ jsx5("span", {
                 className: "skippr:text-[10px] skippr:font-medium skippr:text-primary-foreground",
                 children: "REC"
               }),
-              /* @__PURE__ */ jsx6("span", {
+              /* @__PURE__ */ jsx5("span", {
                 className: "skippr:text-[10px] skippr:font-mono skippr:text-primary-foreground",
                 children: formatTime(elapsed)
               })
             ]
           }),
-          minimizable && /* @__PURE__ */ jsx6("button", {
+          minimizable && /* @__PURE__ */ jsx5("button", {
             type: "button",
             onClick: minimizePanel,
             "aria-label": "Minimize",
             className: "skippr:flex skippr:size-6 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-md skippr:text-primary-foreground/70 skippr:transition-colors skippr:hover:bg-primary-foreground/10 skippr:hover:text-primary-foreground",
-            children: /* @__PURE__ */ jsx6(Minimize2, {
+            children: /* @__PURE__ */ jsx5(Minimize2, {
               className: "skippr:size-3.5"
             })
           })
@@ -2338,26 +2324,26 @@ function ChatHeader() {
 }
 
 // src/components/LoadingDots.tsx
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function LoadingDots({ label }) {
-  return /* @__PURE__ */ jsxs7("div", {
+  return /* @__PURE__ */ jsxs6("div", {
     className: "skippr:flex skippr:items-center skippr:gap-2 skippr:py-4",
     children: [
-      /* @__PURE__ */ jsxs7("div", {
+      /* @__PURE__ */ jsxs6("div", {
         className: "skippr:flex skippr:gap-1",
         children: [
-          /* @__PURE__ */ jsx7("span", {
+          /* @__PURE__ */ jsx6("span", {
             className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:0ms]"
           }),
-          /* @__PURE__ */ jsx7("span", {
+          /* @__PURE__ */ jsx6("span", {
             className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:150ms]"
           }),
-          /* @__PURE__ */ jsx7("span", {
+          /* @__PURE__ */ jsx6("span", {
             className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:300ms]"
           })
         ]
       }),
-      /* @__PURE__ */ jsx7("p", {
+      /* @__PURE__ */ jsx6("p", {
         className: "skippr:text-xs skippr:text-muted-foreground",
         children: label
       })
@@ -2370,7 +2356,7 @@ import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef
 
 // src/components/ui/button.tsx
 import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 var variantClasses = {
   default: "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90",
   destructive: "skippr:bg-destructive skippr:text-white skippr:hover:bg-destructive/90",
@@ -2389,7 +2375,7 @@ var sizeClasses = {
   "icon-lg": "skippr:size-10"
 };
 var Button = forwardRef3(({ className, variant = "default", size = "default", ...props }, ref) => {
-  return /* @__PURE__ */ jsx8("button", {
+  return /* @__PURE__ */ jsx7("button", {
     className: cn("skippr:inline-flex skippr:items-center skippr:justify-center skippr:gap-2 skippr:whitespace-nowrap skippr:rounded-md skippr:text-sm skippr:font-medium skippr:ring-offset-background skippr:transition-all skippr:cursor-pointer skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-ring skippr:focus-visible:ring-offset-2 skippr:disabled:pointer-events-none skippr:disabled:opacity-50 skippr:shrink-0 skippr:[&_svg]:pointer-events-none skippr:[&_svg:not([class*='size-'])]:size-4 skippr:[&_svg]:shrink-0", variantClasses[variant], sizeClasses[size], className),
     ref,
     ...props
@@ -2398,7 +2384,7 @@ var Button = forwardRef3(({ className, variant = "default", size = "default", ..
 Button.displayName = "Button";
 
 // src/components/LoginFlow.tsx
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var OTP_LENGTH = 6;
 var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
 function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
@@ -2419,7 +2405,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
     await requestOtp(email);
   }, [requestOtp, email]);
   if (step === "otp") {
-    return /* @__PURE__ */ jsx9(OtpStep, {
+    return /* @__PURE__ */ jsx8(OtpStep, {
       email,
       onSubmit: handleVerifyOtp,
       onResend: handleResend,
@@ -2428,7 +2414,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
       isSubmitting
     });
   }
-  return /* @__PURE__ */ jsx9(EmailStep, {
+  return /* @__PURE__ */ jsx8(EmailStep, {
     email,
     onEmailChange: setEmail,
     onSubmit: handleRequestOtp,
@@ -2442,30 +2428,30 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
     if (email.trim())
       onSubmit(email.trim());
   }
-  return /* @__PURE__ */ jsxs8("div", {
+  return /* @__PURE__ */ jsxs7("div", {
     className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:px-4 skippr:py-4",
     children: [
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "skippr:mb-4 skippr:text-center",
         children: [
-          /* @__PURE__ */ jsx9(Mail, {
+          /* @__PURE__ */ jsx8(Mail, {
             className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
           }),
-          /* @__PURE__ */ jsx9("p", {
+          /* @__PURE__ */ jsx8("p", {
             className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
             children: "Sign in to continue"
           }),
-          /* @__PURE__ */ jsx9("p", {
+          /* @__PURE__ */ jsx8("p", {
             className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
             children: "Your email will be used to identify you across sessions"
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("form", {
+      /* @__PURE__ */ jsxs7("form", {
         onSubmit: handleSubmit,
         className: "skippr:flex skippr:flex-col skippr:gap-3",
         children: [
-          /* @__PURE__ */ jsx9("input", {
+          /* @__PURE__ */ jsx8("input", {
             type: "email",
             placeholder: "you@example.com",
             value: email,
@@ -2474,15 +2460,15 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
             required: true,
             className: "skippr:w-full skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:px-3 skippr:py-2 skippr:text-sm skippr:text-foreground skippr:placeholder-muted-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
           }),
-          /* @__PURE__ */ jsx9(Button, {
+          /* @__PURE__ */ jsx8(Button, {
             type: "submit",
             disabled: isSubmitting || !email.trim(),
             className: "skippr:w-full",
-            children: isSubmitting ? /* @__PURE__ */ jsx9(LoaderCircle, {
+            children: isSubmitting ? /* @__PURE__ */ jsx8(LoaderCircle, {
               className: "skippr:size-4 skippr:animate-spin"
             }) : "Continue"
           }),
-          error && /* @__PURE__ */ jsx9("p", {
+          error && /* @__PURE__ */ jsx8("p", {
             className: "skippr:text-xs skippr:text-center skippr:text-destructive",
             children: error
           })
@@ -2562,22 +2548,22 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
     submittedRef.current = false;
     inputRefs.current[0]?.focus();
   }
-  return /* @__PURE__ */ jsxs8("div", {
+  return /* @__PURE__ */ jsxs7("div", {
     className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:px-4 skippr:py-4",
     children: [
-      /* @__PURE__ */ jsxs8("div", {
+      /* @__PURE__ */ jsxs7("div", {
         className: "skippr:mb-4 skippr:text-center",
         children: [
-          /* @__PURE__ */ jsx9("p", {
+          /* @__PURE__ */ jsx8("p", {
             className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
             children: "Enter verification code"
           }),
-          /* @__PURE__ */ jsxs8("p", {
+          /* @__PURE__ */ jsxs7("p", {
             className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
             children: [
               "We sent a 6-digit code to",
               " ",
-              /* @__PURE__ */ jsx9("span", {
+              /* @__PURE__ */ jsx8("span", {
                 className: "skippr:font-medium skippr:text-foreground",
                 children: email
               })
@@ -2585,13 +2571,13 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
           })
         ]
       }),
-      /* @__PURE__ */ jsxs8("form", {
+      /* @__PURE__ */ jsxs7("form", {
         onSubmit: handleSubmit,
         className: "skippr:flex skippr:flex-col skippr:gap-3",
         children: [
-          /* @__PURE__ */ jsx9("div", {
+          /* @__PURE__ */ jsx8("div", {
             className: "skippr:flex skippr:justify-center skippr:gap-1.5",
-            children: digits.map((digit, index2) => /* @__PURE__ */ jsx9("input", {
+            children: digits.map((digit, index2) => /* @__PURE__ */ jsx8("input", {
               ref: (el) => {
                 inputRefs.current[index2] = el;
               },
@@ -2606,29 +2592,29 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
               className: "skippr:h-10 skippr:w-10 skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:text-center skippr:text-sm skippr:font-semibold skippr:text-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
             }, DIGIT_KEYS[index2]))
           }),
-          error && /* @__PURE__ */ jsx9("p", {
+          error && /* @__PURE__ */ jsx8("p", {
             className: "skippr:text-xs skippr:text-center skippr:text-destructive",
             children: error
           }),
-          /* @__PURE__ */ jsx9(Button, {
+          /* @__PURE__ */ jsx8(Button, {
             type: "submit",
             disabled: isSubmitting || digits.join("").length !== OTP_LENGTH,
             className: "skippr:w-full",
-            children: isSubmitting ? /* @__PURE__ */ jsx9(LoaderCircle, {
+            children: isSubmitting ? /* @__PURE__ */ jsx8(LoaderCircle, {
               className: "skippr:size-4 skippr:animate-spin"
             }) : "Verify"
           }),
-          /* @__PURE__ */ jsxs8("div", {
+          /* @__PURE__ */ jsxs7("div", {
             className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
             children: [
-              /* @__PURE__ */ jsx9("button", {
+              /* @__PURE__ */ jsx8("button", {
                 type: "button",
                 onClick: onBack,
                 disabled: isSubmitting,
                 className: "skippr:text-muted-foreground hover:skippr:text-foreground skippr:transition-colors disabled:skippr:opacity-50",
                 children: "Change email"
               }),
-              /* @__PURE__ */ jsx9("button", {
+              /* @__PURE__ */ jsx8("button", {
                 type: "button",
                 onClick: handleResend,
                 disabled: isSubmitting || resendCooldown > 0,
@@ -2644,50 +2630,50 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
 }
 
 // src/components/MeetingControls.tsx
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
-var CONTROL_BUTTON = "skippr:flex skippr:size-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:transition-colors";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+var CONTROL_BUTTON2 = "skippr:flex skippr:size-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:transition-colors";
 function MeetingControls({ onHangUp, showScreenShareToggle = true }) {
   const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
-  return /* @__PURE__ */ jsxs9("div", {
+  return /* @__PURE__ */ jsxs8("div", {
     className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:bg-background skippr:px-4 skippr:py-4",
     children: [
-      /* @__PURE__ */ jsxs9("div", {
+      /* @__PURE__ */ jsxs8("div", {
         className: "skippr:flex skippr:items-center skippr:justify-center skippr:gap-3",
         children: [
-          /* @__PURE__ */ jsx10("button", {
+          /* @__PURE__ */ jsx9("button", {
             type: "button",
             onClick: toggleMute,
             "aria-label": isMuted ? "Unmute" : "Mute",
-            className: cn(CONTROL_BUTTON, isMuted ? "skippr:bg-destructive/15 skippr:text-destructive skippr:hover:bg-destructive/25" : "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80"),
-            children: isMuted ? /* @__PURE__ */ jsx10(MicOff, {
+            className: cn(CONTROL_BUTTON2, isMuted ? "skippr:bg-destructive/15 skippr:text-destructive skippr:hover:bg-destructive/25" : "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80"),
+            children: isMuted ? /* @__PURE__ */ jsx9(MicOff, {
               className: "skippr:size-5"
-            }) : /* @__PURE__ */ jsx10(Mic, {
+            }) : /* @__PURE__ */ jsx9(Mic, {
               className: "skippr:size-5"
             })
           }),
-          showScreenShareToggle && /* @__PURE__ */ jsx10("button", {
+          showScreenShareToggle && /* @__PURE__ */ jsx9("button", {
             type: "button",
             onClick: toggleScreenShare,
             "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
-            className: cn(CONTROL_BUTTON, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:brightness-110" : "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80"),
-            children: isScreenSharing ? /* @__PURE__ */ jsx10(MonitorOff, {
+            className: cn(CONTROL_BUTTON2, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:brightness-110" : "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80"),
+            children: isScreenSharing ? /* @__PURE__ */ jsx9(MonitorOff, {
               className: "skippr:size-5"
-            }) : /* @__PURE__ */ jsx10(Monitor, {
+            }) : /* @__PURE__ */ jsx9(Monitor, {
               className: "skippr:size-5"
             })
           }),
-          /* @__PURE__ */ jsx10("button", {
+          /* @__PURE__ */ jsx9("button", {
             type: "button",
             onClick: onHangUp,
             "aria-label": "End session",
-            className: cn(CONTROL_BUTTON, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90"),
-            children: /* @__PURE__ */ jsx10(PhoneOff, {
+            className: cn(CONTROL_BUTTON2, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90"),
+            children: /* @__PURE__ */ jsx9(PhoneOff, {
               className: "skippr:size-5"
             })
           })
         ]
       }),
-      /* @__PURE__ */ jsx10("p", {
+      /* @__PURE__ */ jsx9("p", {
         className: "skippr:mt-3 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
         children: "Powered by Skippr"
       })
@@ -2700,7 +2686,7 @@ import { useEffect as useEffect12, useRef as useRef7 } from "react";
 
 // src/components/ChatInput.tsx
 import { useEffect as useEffect11, useRef as useRef6, useState as useState8 } from "react";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 var MAX_INPUT_HEIGHT = 60;
 function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
   const [inputText, setInputText] = useState8("");
@@ -2737,13 +2723,13 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
       handleSubmit(e);
     }
   }
-  return /* @__PURE__ */ jsx11("form", {
+  return /* @__PURE__ */ jsx10("form", {
     onSubmit: handleSubmit,
     className: "skippr:border-t skippr:border-border skippr:p-3",
-    children: /* @__PURE__ */ jsxs10("div", {
+    children: /* @__PURE__ */ jsxs9("div", {
       className: "skippr:flex skippr:items-center skippr:gap-2 skippr:rounded-xl skippr:bg-background skippr:ring-1 skippr:ring-foreground/10 skippr:px-3 skippr:py-2",
       children: [
-        /* @__PURE__ */ jsx11("textarea", {
+        /* @__PURE__ */ jsx10("textarea", {
           ref: textareaRef,
           rows: 1,
           value: inputText,
@@ -2753,12 +2739,12 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
           className: "skippr:flex-1 skippr:resize-none skippr:overflow-y-auto skippr:bg-transparent skippr:text-sm skippr:leading-5 skippr:text-foreground skippr:placeholder:text-muted-foreground skippr:outline-none",
           style: { maxHeight: `${MAX_INPUT_HEIGHT}px` }
         }),
-        /* @__PURE__ */ jsx11("button", {
+        /* @__PURE__ */ jsx10("button", {
           type: "submit",
           disabled: !canSend,
           "aria-label": "Send message",
           className: cn("skippr:flex skippr:size-8 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:transition-colors", canSend ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-muted-foreground/20 skippr:text-muted-foreground/60"),
-          children: /* @__PURE__ */ jsx11(Send, {
+          children: /* @__PURE__ */ jsx10(Send, {
             className: "skippr:size-3.5"
           })
         })
@@ -2768,7 +2754,7 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
 }
 
 // src/components/ChatMessage.tsx
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 function formatTimestamp(ts) {
   return new Date(ts).toLocaleTimeString("en-US", {
     hour: "numeric",
@@ -2778,23 +2764,23 @@ function formatTimestamp(ts) {
 }
 function ChatMessage({ message }) {
   const isAgent = message.role === "assistant";
-  return /* @__PURE__ */ jsxs11("div", {
+  return /* @__PURE__ */ jsxs10("div", {
     className: cn("skippr:flex skippr:gap-2", isAgent ? "skippr:items-start" : "skippr:justify-end"),
     children: [
-      isAgent && /* @__PURE__ */ jsx12("div", {
+      isAgent && /* @__PURE__ */ jsx11("div", {
         className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
-        children: /* @__PURE__ */ jsx12(Sparkles, {
+        children: /* @__PURE__ */ jsx11(Sparkles, {
           className: "skippr:size-3.5 skippr:text-primary-foreground"
         })
       }),
-      /* @__PURE__ */ jsxs11("div", {
+      /* @__PURE__ */ jsxs10("div", {
         className: cn("skippr:flex skippr:max-w-[80%] skippr:flex-col", isAgent ? "skippr:items-start" : "skippr:items-end"),
         children: [
-          /* @__PURE__ */ jsx12("div", {
+          /* @__PURE__ */ jsx11("div", {
             className: cn("skippr:rounded-2xl skippr:px-4 skippr:py-2.5 skippr:text-sm skippr:leading-relaxed", isAgent ? "skippr:border skippr:border-border skippr:bg-card skippr:text-foreground" : "skippr:bg-primary skippr:text-primary-foreground"),
             children: message.content
           }),
-          message.timestamp && /* @__PURE__ */ jsx12("span", {
+          message.timestamp && /* @__PURE__ */ jsx11("span", {
             className: "skippr:mt-1 skippr:px-1 skippr:text-[10px] skippr:text-muted-foreground/60",
             children: formatTimestamp(message.timestamp)
           })
@@ -2805,33 +2791,33 @@ function ChatMessage({ message }) {
 }
 
 // src/components/TypingIndicator.tsx
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 function TypingIndicator() {
-  return /* @__PURE__ */ jsxs12("div", {
+  return /* @__PURE__ */ jsxs11("div", {
     className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
     children: [
-      /* @__PURE__ */ jsx13("div", {
+      /* @__PURE__ */ jsx12("div", {
         className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
-        children: /* @__PURE__ */ jsx13(Sparkles, {
+        children: /* @__PURE__ */ jsx12(Sparkles, {
           className: "skippr:size-3.5 skippr:text-primary-foreground"
         })
       }),
-      /* @__PURE__ */ jsxs12("div", {
+      /* @__PURE__ */ jsxs11("div", {
         className: "skippr:inline-flex skippr:items-center skippr:gap-1 skippr:rounded-2xl skippr:border skippr:border-primary/20 skippr:bg-primary/10 skippr:px-4 skippr:py-2 skippr:text-xs skippr:text-primary",
         children: [
-          /* @__PURE__ */ jsx13("span", {
+          /* @__PURE__ */ jsx12("span", {
             children: "Agent is analyzing your screen"
           }),
-          /* @__PURE__ */ jsxs12("span", {
+          /* @__PURE__ */ jsxs11("span", {
             className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
             children: [
-              /* @__PURE__ */ jsx13("span", {
+              /* @__PURE__ */ jsx12("span", {
                 className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
               }),
-              /* @__PURE__ */ jsx13("span", {
+              /* @__PURE__ */ jsx12("span", {
                 className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
               }),
-              /* @__PURE__ */ jsx13("span", {
+              /* @__PURE__ */ jsx12("span", {
                 className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
               })
             ]
@@ -2843,7 +2829,7 @@ function TypingIndicator() {
 }
 
 // src/components/MessageList.tsx
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 function MessageList({
   messages,
   isStreaming,
@@ -2857,25 +2843,25 @@ function MessageList({
     scrollRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages.length, lastMessage?.content]);
   const showTyping = isStreaming && lastMessage?.role === "assistant" && lastMessage.content === "";
-  return /* @__PURE__ */ jsxs13("div", {
+  return /* @__PURE__ */ jsxs12("div", {
     className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
     children: [
-      /* @__PURE__ */ jsxs13("div", {
+      /* @__PURE__ */ jsxs12("div", {
         className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4",
         children: [
-          messages.length === 0 && !showTyping && /* @__PURE__ */ jsx14(LoadingDots, {
+          messages.length === 0 && !showTyping && /* @__PURE__ */ jsx13(LoadingDots, {
             label: "Waiting for conversation to begin..."
           }),
-          messages.map((message) => /* @__PURE__ */ jsx14(ChatMessage, {
+          messages.map((message) => /* @__PURE__ */ jsx13(ChatMessage, {
             message
           }, message.id)),
-          showTyping && /* @__PURE__ */ jsx14(TypingIndicator, {}),
-          /* @__PURE__ */ jsx14("div", {
+          showTyping && /* @__PURE__ */ jsx13(TypingIndicator, {}),
+          /* @__PURE__ */ jsx13("div", {
             ref: scrollRef
           })
         ]
       }),
-      /* @__PURE__ */ jsx14(ChatInput, {
+      /* @__PURE__ */ jsx13(ChatInput, {
         sendChatMessage,
         isSendingChat,
         autoFocus
@@ -2885,49 +2871,49 @@ function MessageList({
 }
 
 // src/components/SessionAgenda.tsx
-import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 function SessionAgenda({ phases, hasStarted }) {
   if (phases.length === 0 || !hasStarted) {
-    return /* @__PURE__ */ jsx15("div", {
+    return /* @__PURE__ */ jsx14("div", {
       className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
-      children: /* @__PURE__ */ jsx15(LoadingDots, {
+      children: /* @__PURE__ */ jsx14(LoadingDots, {
         label: "Waiting for agenda to load..."
       })
     });
   }
-  return /* @__PURE__ */ jsx15("div", {
+  return /* @__PURE__ */ jsx14("div", {
     className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
-    children: /* @__PURE__ */ jsx15("div", {
+    children: /* @__PURE__ */ jsx14("div", {
       className: "skippr:space-y-1",
       children: phases.map((phase) => {
         const isActive = phase.status === "active";
         const isCompleted = phase.status === "completed";
-        return /* @__PURE__ */ jsxs14("div", {
+        return /* @__PURE__ */ jsxs13("div", {
           className: cn("skippr:flex skippr:items-start skippr:gap-2.5 skippr:rounded-lg skippr:p-2 skippr:transition-colors", isActive && "skippr:bg-primary/10"),
           children: [
-            /* @__PURE__ */ jsx15("div", {
+            /* @__PURE__ */ jsx14("div", {
               className: "skippr:mt-0.5",
-              children: isCompleted ? /* @__PURE__ */ jsx15(CircleCheck, {
+              children: isCompleted ? /* @__PURE__ */ jsx14(CircleCheck, {
                 className: "skippr:size-4 skippr:text-chart-3"
-              }) : isActive ? /* @__PURE__ */ jsx15(Circle, {
+              }) : isActive ? /* @__PURE__ */ jsx14(Circle, {
                 className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
-              }) : /* @__PURE__ */ jsx15(Circle, {
+              }) : /* @__PURE__ */ jsx14(Circle, {
                 className: "skippr:size-4 skippr:text-muted-foreground/30"
               })
             }),
-            /* @__PURE__ */ jsxs14("div", {
+            /* @__PURE__ */ jsxs13("div", {
               className: "skippr:min-w-0 skippr:flex-1",
               children: [
-                /* @__PURE__ */ jsx15("p", {
+                /* @__PURE__ */ jsx14("p", {
                   className: cn("skippr:text-sm", isCompleted && "skippr:text-muted-foreground skippr:line-through", isActive && "skippr:font-medium skippr:text-foreground", phase.status === "pending" && "skippr:text-muted-foreground"),
                   children: phase.name
                 }),
-                phase.highlights.length > 0 && /* @__PURE__ */ jsx15("ul", {
+                phase.highlights.length > 0 && /* @__PURE__ */ jsx14("ul", {
                   className: "skippr:mt-1 skippr:space-y-0.5",
-                  children: phase.highlights.map((text) => /* @__PURE__ */ jsxs14("li", {
+                  children: phase.highlights.map((text) => /* @__PURE__ */ jsxs13("li", {
                     className: cn("skippr:flex skippr:items-center skippr:gap-1.5 skippr:text-[11px] skippr:leading-tight", isCompleted ? "skippr:text-muted-foreground/40 skippr:line-through" : "skippr:text-muted-foreground/70"),
                     children: [
-                      /* @__PURE__ */ jsx15("span", {
+                      /* @__PURE__ */ jsx14("span", {
                         className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
                       }),
                       text
@@ -2944,12 +2930,12 @@ function SessionAgenda({ phases, hasStarted }) {
 }
 
 // src/components/SessionWarningBanner.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var SESSION_WARNING_THRESHOLD_SECS = 60;
 function SessionWarningBanner({ remaining }) {
   if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
     return null;
-  return /* @__PURE__ */ jsx16("div", {
+  return /* @__PURE__ */ jsx15("div", {
     "data-testid": "session-warning-banner",
     className: "skippr:bg-red-50 skippr:px-4 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:font-medium skippr:text-red-700",
     children: "Session ending soon"
@@ -2957,24 +2943,24 @@ function SessionWarningBanner({ remaining }) {
 }
 
 // src/components/StartSessionPrompt.tsx
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
 function StartSessionPrompt({
   onStartSession,
   isStarting,
   error,
   label = "Talk to Skippr"
 }) {
-  return /* @__PURE__ */ jsxs15("div", {
+  return /* @__PURE__ */ jsxs14("div", {
     className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
     children: [
-      /* @__PURE__ */ jsx17("button", {
+      /* @__PURE__ */ jsx16("button", {
         type: "button",
         onClick: onStartSession,
         disabled: isStarting,
         className: "skippr:cursor-pointer skippr:rounded-xl skippr:bg-primary skippr:px-8 skippr:py-3 skippr:text-sm skippr:font-medium skippr:text-primary-foreground skippr:transition-all skippr:hover:bg-primary/90 skippr:disabled:cursor-not-allowed skippr:disabled:opacity-60",
         children: isStarting ? "Starting..." : label
       }),
-      error && /* @__PURE__ */ jsx17("p", {
+      error && /* @__PURE__ */ jsx16("p", {
         className: "skippr:text-xs skippr:text-destructive",
         children: error
       })
@@ -2983,7 +2969,7 @@ function StartSessionPrompt({
 }
 
 // src/components/Sidebar.tsx
-import { jsx as jsx18, jsxs as jsxs16, Fragment as Fragment4 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs15, Fragment as Fragment4 } from "react/jsx-runtime";
 function Sidebar({
   hideControls = false,
   hideHeader = false,
@@ -3025,22 +3011,22 @@ function Sidebar({
       document.body.style.transition = "";
     };
   }, [isSidebar, isPanelOpen, position]);
-  return /* @__PURE__ */ jsxs16("div", {
-    className: cn("skippr:fixed skippr:z-[9999]", "skippr:bg-card", "skippr:flex skippr:flex-col", "skippr:overflow-hidden", isFloating && "skippr:border skippr:border-border skippr:bottom-[88px] skippr:h-[calc(100vh-112px)] skippr:rounded-2xl skippr:shadow-[0_8px_30px_rgba(0,0,0,0.16),0_4px_12px_rgba(0,0,0,0.08)]", isFloating && (position === "right" ? "skippr:right-6" : "skippr:left-6"), isFloating && "skippr:transition-[opacity,transform] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
+  return /* @__PURE__ */ jsxs15("div", {
+    className: cn("skippr:fixed skippr:z-[9999]", "skippr:bg-card", "skippr:flex skippr:flex-col", "skippr:overflow-hidden", isFloating && "skippr:border skippr:border-border skippr:bottom-[88px] skippr:h-[min(460px,calc(100vh-200px))] skippr:rounded-2xl skippr:shadow-[0_8px_30px_rgba(0,0,0,0.16),0_4px_12px_rgba(0,0,0,0.08)]", isFloating && (position === "right" ? "skippr:right-6" : "skippr:left-6"), isFloating && "skippr:transition-[opacity,transform] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
     style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined },
     children: [
-      !hideHeader && /* @__PURE__ */ jsx18(ChatHeader, {}),
-      !isAuthenticated && isValidating ? /* @__PURE__ */ jsx18("div", {
+      !hideHeader && /* @__PURE__ */ jsx17(ChatHeader, {}),
+      !isAuthenticated && isValidating ? /* @__PURE__ */ jsx17("div", {
         className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
-        children: /* @__PURE__ */ jsx18(LoadingDots, {
+        children: /* @__PURE__ */ jsx17(LoadingDots, {
           label: "Loading..."
         })
-      }) : !isAuthenticated ? /* @__PURE__ */ jsx18(LoginFlow, {
+      }) : !isAuthenticated ? /* @__PURE__ */ jsx17(LoginFlow, {
         requestOtp,
         verifyOtp,
         error: authError,
         isSubmitting: isAuthSubmitting
-      }) : /* @__PURE__ */ jsx18(AuthenticatedContent, {
+      }) : /* @__PURE__ */ jsx17(AuthenticatedContent, {
         isConnected,
         onStartSession: startSession,
         onDisconnect: disconnect,
@@ -3069,50 +3055,50 @@ function AuthenticatedContent({
   autoFocusChat,
   showScreenShareToggle
 }) {
-  return /* @__PURE__ */ jsxs16(Fragment4, {
+  return /* @__PURE__ */ jsxs15(Fragment4, {
     children: [
-      isConnected && /* @__PURE__ */ jsx18(ConnectedBanner, {}),
-      /* @__PURE__ */ jsxs16("div", {
+      isConnected && /* @__PURE__ */ jsx17(ConnectedBanner, {}),
+      /* @__PURE__ */ jsxs15("div", {
         className: "skippr:flex skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-2",
         children: [
-          /* @__PURE__ */ jsxs16("button", {
+          /* @__PURE__ */ jsxs15("button", {
             type: "button",
             className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "chat" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
             onClick: () => onTabChange("chat"),
             children: [
-              /* @__PURE__ */ jsx18(MessageCircle, {
+              /* @__PURE__ */ jsx17(MessageCircle, {
                 className: "skippr:size-3.5"
               }),
               "Chat",
-              activeTab === "chat" && /* @__PURE__ */ jsx18("span", {
+              activeTab === "chat" && /* @__PURE__ */ jsx17("span", {
                 className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
               })
             ]
           }),
-          /* @__PURE__ */ jsxs16("button", {
+          /* @__PURE__ */ jsxs15("button", {
             type: "button",
             className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "agenda" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
             onClick: () => onTabChange("agenda"),
             children: [
-              /* @__PURE__ */ jsx18(Calendar, {
+              /* @__PURE__ */ jsx17(Calendar, {
                 className: "skippr:size-3.5"
               }),
               "Agenda",
-              activeTab === "agenda" && /* @__PURE__ */ jsx18("span", {
+              activeTab === "agenda" && /* @__PURE__ */ jsx17("span", {
                 className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
               })
             ]
           })
         ]
       }),
-      /* @__PURE__ */ jsx18("div", {
+      /* @__PURE__ */ jsx17("div", {
         className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
-        children: isConnected || isStarting ? /* @__PURE__ */ jsx18(ConnectedBody, {
+        children: isConnected || isStarting ? /* @__PURE__ */ jsx17(ConnectedBody, {
           activeTab,
           autoFocusChat
-        }) : /* @__PURE__ */ jsx18("div", {
+        }) : /* @__PURE__ */ jsx17("div", {
           className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
-          children: /* @__PURE__ */ jsx18(StartSessionPrompt, {
+          children: /* @__PURE__ */ jsx17(StartSessionPrompt, {
             onStartSession,
             isStarting,
             error,
@@ -3120,7 +3106,7 @@ function AuthenticatedContent({
           })
         }, `${activeTab}-empty`)
       }),
-      isConnected && !hideControls && /* @__PURE__ */ jsx18(MeetingControls, {
+      isConnected && !hideControls && /* @__PURE__ */ jsx17(MeetingControls, {
         onHangUp: onDisconnect,
         showScreenShareToggle
       })
@@ -3129,7 +3115,7 @@ function AuthenticatedContent({
 }
 function ConnectedBanner() {
   const remaining = useSessionRemaining();
-  return /* @__PURE__ */ jsx18(SessionWarningBanner, {
+  return /* @__PURE__ */ jsx17(SessionWarningBanner, {
     remaining
   });
 }
@@ -3140,17 +3126,17 @@ function ConnectedBody({
   const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
   const { phases } = usePhaseUpdates();
   if (activeTab === "agenda") {
-    return /* @__PURE__ */ jsx18("div", {
+    return /* @__PURE__ */ jsx17("div", {
       className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
-      children: /* @__PURE__ */ jsx18(SessionAgenda, {
+      children: /* @__PURE__ */ jsx17(SessionAgenda, {
         phases,
         hasStarted: allMessages.length > 0 || agentState === "speaking"
       })
     }, "agenda");
   }
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx17("div", {
     className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
-    children: /* @__PURE__ */ jsx18(MessageList, {
+    children: /* @__PURE__ */ jsx17(MessageList, {
       messages: allMessages,
       isStreaming: agentState === "speaking",
       sendChatMessage,
@@ -3161,28 +3147,28 @@ function ConnectedBody({
 }
 
 // src/components/SidebarTrigger.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function SidebarTrigger() {
   const { isPanelOpen, togglePanel, minimizePanel, minimizable, position, isMinimized } = useLiveAgent();
   if (isMinimized)
     return null;
   const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
-  return /* @__PURE__ */ jsx19("button", {
+  return /* @__PURE__ */ jsx18("button", {
     type: "button",
     onClick: handleClick,
     title: isPanelOpen ? "Close chat" : "Open chat",
     "aria-label": isPanelOpen ? "Close chat" : "Open chat",
     className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", position === "right" ? "skippr:right-6" : "skippr:left-6"),
-    children: isPanelOpen ? /* @__PURE__ */ jsx19(ChevronDown, {
+    children: isPanelOpen ? /* @__PURE__ */ jsx18(ChevronDown, {
       className: "skippr:size-5"
-    }) : /* @__PURE__ */ jsx19(Logo, {
+    }) : /* @__PURE__ */ jsx18(Logo, {
       className: "skippr:size-7"
     })
   });
 }
 
 // src/components/LiveAgent.tsx
-import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
 function LiveAgent(props) {
   const {
     agentId,
@@ -3198,7 +3184,6 @@ function LiveAgent(props) {
     hideHeader = false,
     startSessionLabel = "Talk to Skippr",
     autoFocusChat = true,
-    showAgentStateBanner = true,
     children
   } = props;
   const captureMode = props.captureMode ?? "screenshare";
@@ -3336,32 +3321,31 @@ function LiveAgent(props) {
     captureMode,
     agentControls
   ]);
-  return /* @__PURE__ */ jsx20(LiveAgentContext.Provider, {
+  return /* @__PURE__ */ jsx19(LiveAgentContext.Provider, {
     value: ctx,
-    children: /* @__PURE__ */ jsxs17(LiveKitRoom, {
+    children: /* @__PURE__ */ jsxs16(LiveKitRoom, {
       serverUrl: connection?.livekitUrl,
       token: connection?.token,
       connect: shouldConnect,
       audio: true,
       onDisconnected: disconnect,
       children: [
-        connection && /* @__PURE__ */ jsx20(RoomAudioRenderer, {}),
-        connection && captureMode === "screenshare" && /* @__PURE__ */ jsx20(AutoStartMedia, {
+        connection && /* @__PURE__ */ jsx19(RoomAudioRenderer, {}),
+        connection && captureMode === "screenshare" && /* @__PURE__ */ jsx19(AutoStartMedia, {
           pendingScreenStream
         }),
-        connection && captureMode === "auto" && /* @__PURE__ */ jsx20(DomCapture, {}),
-        connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx20(HighlightOverlay, {}),
-        /* @__PURE__ */ jsxs17("div", {
+        connection && captureMode === "auto" && /* @__PURE__ */ jsx19(DomCapture, {}),
+        connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx19(HighlightOverlay, {}),
+        /* @__PURE__ */ jsxs16("div", {
           id: WIDGET_ROOT_ID,
           children: [
-            showAgentStateBanner && /* @__PURE__ */ jsx20(AgentStateBanner, {}),
-            isMinimized && /* @__PURE__ */ jsx20(MinimizedBubble, {
+            isMinimized && /* @__PURE__ */ jsx19(MinimizedBubble, {
               welcomeMessage,
               welcomeDismissed,
               onDismissWelcome: dismissWelcome
             }),
-            /* @__PURE__ */ jsx20(SidebarTrigger, {}),
-            /* @__PURE__ */ jsx20(Sidebar, {
+            /* @__PURE__ */ jsx19(SidebarTrigger, {}),
+            /* @__PURE__ */ jsx19(Sidebar, {
               hideControls,
               hideHeader,
               startSessionLabel