@skippr/live-agent-sdk 0.74.0 → 0.75.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,7 +8,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
8
8
 
9
9
  // src/components/LiveAgent.tsx
10
10
  import { LiveKitRoom, RoomAudioRenderer } from "@livekit/components-react";
11
- import { useCallback as useCallback15, useEffect as useEffect25, useMemo as useMemo6, useRef as useRef17, useState as useState18 } from "react";
11
+ import { useCallback as useCallback15, useEffect as useEffect26, useMemo as useMemo6, useRef as useRef17, useState as useState19 } from "react";
12
12
 
13
13
  // src/capture/useAgentCursor.ts
14
14
  import { useEffect, useState } from "react";
@@ -74,8 +74,128 @@ var NAME_MAX_CHARS = 80;
74
74
  // src/context/LiveAgentContext.tsx
75
75
  var LiveAgentContext = createContext(null);
76
76
 
77
+ // src/context/SessionHoldContext.tsx
78
+ import { createContext as createContext2, useContext as useContext2 } from "react";
79
+
80
+ // src/hooks/useLiveAgent.ts
81
+ import { useContext } from "react";
82
+ function useLiveAgent() {
83
+ const ctx = useContext(LiveAgentContext);
84
+ if (!ctx) {
85
+ throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
86
+ }
87
+ const {
88
+ usesHostAuth,
89
+ authFailed,
90
+ connection,
91
+ shouldConnect,
92
+ historyMessages,
93
+ phasesSnapshot,
94
+ setPhasesSnapshot,
95
+ hasResolvedModules,
96
+ adoptionGoals,
97
+ startAdoptionSession,
98
+ launcherBottomPx,
99
+ setLauncherBottomPx,
100
+ popsDown,
101
+ panelExpanded,
102
+ togglePanelExpanded,
103
+ ...publicValue
104
+ } = ctx;
105
+ return publicValue;
106
+ }
107
+
108
+ // src/hooks/useSessionHold.ts
109
+ import { useLocalParticipant } from "@livekit/components-react/hooks";
110
+ import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
111
+ var textEncoder = new TextEncoder;
112
+ var FALLBACK_PAUSE_TIMEOUT_SECONDS = 120;
113
+ function useSessionHold({
114
+ pauseSession,
115
+ pauseTimeoutSeconds
116
+ }) {
117
+ const { localParticipant } = useLocalParticipant();
118
+ const timeoutSeconds = pauseTimeoutSeconds ?? FALLBACK_PAUSE_TIMEOUT_SECONDS;
119
+ const [isHeld, setIsHeld] = useState2(false);
120
+ const [countdown, setCountdown] = useState2(timeoutSeconds);
121
+ const publish = useCallback(async (type) => {
122
+ await localParticipant.publishData(textEncoder.encode(JSON.stringify({ type })), {
123
+ reliable: true,
124
+ topic: SESSION_HOLD_TOPIC
125
+ });
126
+ }, [localParticipant]);
127
+ const hold = useCallback(async () => {
128
+ try {
129
+ await localParticipant.setMicrophoneEnabled(false);
130
+ await publish("pause");
131
+ setIsHeld(true);
132
+ } catch (error) {
133
+ console.error("Failed to hold session:", error);
134
+ }
135
+ }, [localParticipant, publish]);
136
+ const release = useCallback(async () => {
137
+ try {
138
+ await localParticipant.setMicrophoneEnabled(true);
139
+ await publish("resume");
140
+ setIsHeld(false);
141
+ } catch (error) {
142
+ console.error("Failed to release session:", error);
143
+ }
144
+ }, [localParticipant, publish]);
145
+ useEffect2(() => {
146
+ if (!isHeld) {
147
+ setCountdown(timeoutSeconds);
148
+ return;
149
+ }
150
+ const id = setInterval(() => {
151
+ setCountdown((seconds) => Math.max(0, seconds - 1));
152
+ }, 1000);
153
+ return () => clearInterval(id);
154
+ }, [isHeld, timeoutSeconds]);
155
+ useEffect2(() => {
156
+ if (isHeld && countdown === 0) {
157
+ setIsHeld(false);
158
+ pauseSession();
159
+ }
160
+ }, [isHeld, countdown, pauseSession]);
161
+ const toggle = useCallback(() => {
162
+ if (isHeld) {
163
+ release();
164
+ } else {
165
+ hold();
166
+ }
167
+ }, [isHeld, hold, release]);
168
+ return { isHeld, countdown, toggle };
169
+ }
170
+
171
+ // src/context/SessionHoldContext.tsx
172
+ import { jsx } from "react/jsx-runtime";
173
+ var SessionHoldContext = createContext2({
174
+ isHeld: false,
175
+ countdown: 0,
176
+ toggle: () => {}
177
+ });
178
+ function SessionHoldProvider({ children }) {
179
+ const { pauseSession } = useLiveAgent();
180
+ const internalCtx = useContext2(LiveAgentContext);
181
+ if (!internalCtx) {
182
+ throw new Error("SessionHoldProvider must be used within a <LiveAgent> provider");
183
+ }
184
+ const hold = useSessionHold({
185
+ pauseSession,
186
+ pauseTimeoutSeconds: internalCtx.pauseTimeoutSeconds
187
+ });
188
+ return /* @__PURE__ */ jsx(SessionHoldContext.Provider, {
189
+ value: hold,
190
+ children
191
+ });
192
+ }
193
+ function useSessionHoldContext() {
194
+ return useContext2(SessionHoldContext);
195
+ }
196
+
77
197
  // src/hooks/useAdoptionGoals.ts
78
- import { useCallback, useEffect as useEffect2, useMemo, useState as useState2 } from "react";
198
+ import { useCallback as useCallback2, useEffect as useEffect3, useMemo, useState as useState3 } from "react";
79
199
 
80
200
  // src/lib/hashMatch.ts
81
201
  function globToRegExp(pattern) {
@@ -143,9 +263,9 @@ function useAdoptionGoals({
143
263
  bearerToken,
144
264
  authedFetch
145
265
  }) {
146
- const [candidates, setCandidates] = useState2([]);
147
- const [hash, setHash] = useState2(window.location.hash);
148
- const match = useCallback(async () => {
266
+ const [candidates, setCandidates] = useState3([]);
267
+ const [hash, setHash] = useState3(window.location.hash);
268
+ const match = useCallback2(async () => {
149
269
  try {
150
270
  const resp = await authedFetch(`${API_URL}/v1/adoption/goals/match`, {
151
271
  method: "POST",
@@ -163,7 +283,7 @@ function useAdoptionGoals({
163
283
  setCandidates([]);
164
284
  }
165
285
  }, [authedFetch]);
166
- useEffect2(() => {
286
+ useEffect3(() => {
167
287
  if (!enabled || !bearerToken) {
168
288
  setCandidates([]);
169
289
  return;
@@ -195,21 +315,21 @@ function useAdoptionGoals({
195
315
  return hashSpecific;
196
316
  return candidates.filter((goal) => goal.hashPattern === null);
197
317
  }, [candidates, hash]);
198
- const postStatus = useCallback((goalId, status) => {
318
+ const postStatus = useCallback2((goalId, status) => {
199
319
  authedFetch(`${API_URL}/v1/adoption/goals/${goalId}/status`, {
200
320
  method: "POST",
201
321
  headers: { "Content-Type": "application/json" },
202
322
  body: JSON.stringify({ status })
203
323
  }).catch((e) => console.warn("[Skippr] adoption status update failed", e));
204
324
  }, [authedFetch]);
205
- const attendGoal = useCallback((goalId) => {
325
+ const attendGoal = useCallback2((goalId) => {
206
326
  postStatus(goalId, "attended" /* Attended */);
207
327
  }, [postStatus]);
208
328
  return { goals, attendGoal };
209
329
  }
210
330
 
211
331
  // src/hooks/useAuth.ts
212
- import { useCallback as useCallback2, useEffect as useEffect3, useState as useState3 } from "react";
332
+ import { useCallback as useCallback3, useEffect as useEffect4, useState as useState4 } from "react";
213
333
  var API_URL2 = "https://specialist.skippr.ai/api";
214
334
  function storageKey(appKey) {
215
335
  return `skippr_auth_${appKey}`;
@@ -236,12 +356,12 @@ function clearStoredToken(appKey) {
236
356
  }
237
357
  }
238
358
  function useAuth({ appKey }) {
239
- const [authToken, setAuthToken] = useState3(null);
240
- const [isValidating, setIsValidating] = useState3(false);
241
- const [isSubmitting, setIsSubmitting] = useState3(false);
242
- const [error, setError] = useState3("");
359
+ const [authToken, setAuthToken] = useState4(null);
360
+ const [isValidating, setIsValidating] = useState4(false);
361
+ const [isSubmitting, setIsSubmitting] = useState4(false);
362
+ const [error, setError] = useState4("");
243
363
  const isAuthenticated = authToken !== null;
244
- useEffect3(() => {
364
+ useEffect4(() => {
245
365
  if (!appKey)
246
366
  return;
247
367
  const stored = getStoredToken(appKey);
@@ -267,7 +387,7 @@ function useAuth({ appKey }) {
267
387
  }
268
388
  validateStoredToken();
269
389
  }, [appKey]);
270
- useEffect3(() => {
390
+ useEffect4(() => {
271
391
  function handleLogout() {
272
392
  setAuthToken(null);
273
393
  setError("");
@@ -275,7 +395,7 @@ function useAuth({ appKey }) {
275
395
  window.addEventListener("skippr:logout", handleLogout);
276
396
  return () => window.removeEventListener("skippr:logout", handleLogout);
277
397
  }, []);
278
- const requestOtp = useCallback2(async (email) => {
398
+ const requestOtp = useCallback3(async (email) => {
279
399
  if (!appKey)
280
400
  return false;
281
401
  setIsSubmitting(true);
@@ -302,7 +422,7 @@ function useAuth({ appKey }) {
302
422
  setIsSubmitting(false);
303
423
  }
304
424
  }, [appKey]);
305
- const verifyOtp = useCallback2(async (email, code) => {
425
+ const verifyOtp = useCallback3(async (email, code) => {
306
426
  if (!appKey)
307
427
  return;
308
428
  setIsSubmitting(true);
@@ -331,7 +451,7 @@ function useAuth({ appKey }) {
331
451
  setIsSubmitting(false);
332
452
  }
333
453
  }, [appKey]);
334
- const logout = useCallback2(async () => {
454
+ const logout = useCallback3(async () => {
335
455
  const token = authToken;
336
456
  if (appKey)
337
457
  clearStoredToken(appKey);
@@ -362,43 +482,49 @@ function useAuth({ appKey }) {
362
482
  }
363
483
 
364
484
  // src/hooks/useAvailableModules.ts
365
- import { useCallback as useCallback3, useEffect as useEffect4, useState as useState4 } from "react";
485
+ import { useCallback as useCallback4, useEffect as useEffect5, useState as useState5 } from "react";
486
+ var EMPTY_DEFAULT = { agentId: null, sessionId: null };
366
487
  var API_URL3 = "https://specialist.skippr.ai/api";
367
488
  function useAvailableModules({
368
489
  enabled,
369
490
  bearerToken,
370
- authedFetch
491
+ authedFetch,
492
+ agentId
371
493
  }) {
372
- const [modules, setModules] = useState4([]);
373
- const [isLoading, setIsLoading] = useState4(false);
374
- const [hasResolved, setHasResolved] = useState4(false);
375
- const [error, setError] = useState4(null);
376
- const fetchModules = useCallback3(async () => {
494
+ const [modules, setModules] = useState5([]);
495
+ const [defaultSelection, setDefaultSelection] = useState5(EMPTY_DEFAULT);
496
+ const [isLoading, setIsLoading] = useState5(false);
497
+ const [hasResolved, setHasResolved] = useState5(false);
498
+ const [error, setError] = useState5(null);
499
+ const fetchModules = useCallback4(async () => {
377
500
  setIsLoading(true);
378
501
  setHasResolved(false);
379
502
  setError(null);
380
503
  try {
381
- const resp = await authedFetch(`${API_URL3}/v1/modules/available`);
504
+ const query = agentId ? `?agentId=${encodeURIComponent(agentId)}` : "";
505
+ const resp = await authedFetch(`${API_URL3}/v1/modules/available${query}`);
382
506
  if (!resp.ok) {
383
507
  const body = await resp.json().catch(() => null);
384
508
  throw new Error(body?.detail || `Failed to load modules: ${resp.status}`);
385
509
  }
386
510
  const data = await resp.json();
387
511
  setModules(Array.isArray(data?.modules) ? data.modules : []);
512
+ setDefaultSelection(data?.default ?? EMPTY_DEFAULT);
388
513
  } catch (e) {
389
514
  setError(e instanceof Error ? e.message : "Failed to load modules");
390
515
  } finally {
391
516
  setIsLoading(false);
392
517
  setHasResolved(true);
393
518
  }
394
- }, [authedFetch]);
395
- useEffect4(() => {
519
+ }, [authedFetch, agentId]);
520
+ useEffect5(() => {
396
521
  if (!enabled || !bearerToken)
397
522
  return;
398
523
  fetchModules();
399
524
  }, [enabled, bearerToken, fetchModules]);
400
525
  return {
401
526
  modules,
527
+ defaultSelection,
402
528
  isLoading,
403
529
  hasResolved,
404
530
  error,
@@ -406,44 +532,16 @@ function useAvailableModules({
406
532
  };
407
533
  }
408
534
 
409
- // src/hooks/useLiveAgent.ts
410
- import { useContext } from "react";
411
- function useLiveAgent() {
412
- const ctx = useContext(LiveAgentContext);
413
- if (!ctx) {
414
- throw new Error("useLiveAgent must be used within a <LiveAgent> provider");
415
- }
416
- const {
417
- usesHostAuth,
418
- authFailed,
419
- connection,
420
- shouldConnect,
421
- historyMessages,
422
- phasesSnapshot,
423
- setPhasesSnapshot,
424
- hasResolvedModules,
425
- adoptionGoals,
426
- startAdoptionSession,
427
- launcherBottomPx,
428
- setLauncherBottomPx,
429
- popsDown,
430
- panelExpanded,
431
- togglePanelExpanded,
432
- ...publicValue
433
- } = ctx;
434
- return publicValue;
435
- }
436
-
437
535
  // src/hooks/usePlanUpdates.ts
438
- import { useCallback as useCallback4 } from "react";
536
+ import { useCallback as useCallback5 } from "react";
439
537
 
440
538
  // src/hooks/useAgentState.ts
441
539
  import { useRemoteParticipants } from "@livekit/components-react/hooks";
442
- import { useEffect as useEffect5, useState as useState5 } from "react";
540
+ import { useEffect as useEffect6, useState as useState6 } from "react";
443
541
  function useAgentState(attributeKey, parse, initial) {
444
- const [value, setValue] = useState5(initial);
542
+ const [value, setValue] = useState6(initial);
445
543
  const remoteParticipants = useRemoteParticipants();
446
- useEffect5(() => {
544
+ useEffect6(() => {
447
545
  const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
448
546
  if (agentParticipant) {
449
547
  const attr = agentParticipant.attributes?.[attributeKey];
@@ -489,12 +587,75 @@ function parsePlan(json) {
489
587
  return null;
490
588
  }
491
589
  function usePlanUpdates() {
492
- const parse = useCallback4(parsePlan, []);
590
+ const parse = useCallback5(parsePlan, []);
493
591
  return useAgentState(PLAN_ATTR, parse, null);
494
592
  }
495
593
 
496
594
  // src/hooks/useSession.ts
497
- import { useCallback as useCallback5, useEffect as useEffect6, useRef, useState as useState6 } from "react";
595
+ import { useCallback as useCallback6, useEffect as useEffect7, useRef, useState as useState7 } from "react";
596
+
597
+ // src/lib/agentMode.ts
598
+ var AGENT_MODE = {
599
+ Standard: "standard",
600
+ AlwaysOn: "always_on"
601
+ };
602
+ var AGENT_MODES = Object.values(AGENT_MODE);
603
+
604
+ // src/lib/sessionStatus.ts
605
+ var SESSION_STATUS = {
606
+ pending: "pending",
607
+ active: "active",
608
+ paused: "paused",
609
+ completed: "completed",
610
+ expired: "expired"
611
+ };
612
+ var SESSION_STATUSES = Object.values(SESSION_STATUS);
613
+
614
+ // src/lib/session.ts
615
+ function mapApiMessages(messages) {
616
+ return messages.filter((message) => message.role !== "system").map((message) => ({
617
+ id: message.id,
618
+ role: message.role === "user" ? "user" : "assistant",
619
+ content: message.content,
620
+ source: "chat",
621
+ timestamp: new Date(message.createdAt).getTime()
622
+ }));
623
+ }
624
+ function getResumableSessionId(currentSession, mode) {
625
+ if (!currentSession)
626
+ return;
627
+ const { id, status } = currentSession;
628
+ if (status === SESSION_STATUS.paused || status === SESSION_STATUS.active)
629
+ return id;
630
+ if (mode === AGENT_MODE.AlwaysOn && (status === SESSION_STATUS.expired || status === SESSION_STATUS.completed))
631
+ return id;
632
+ return;
633
+ }
634
+ function canResumeSession(currentSession, mode) {
635
+ return getResumableSessionId(currentSession, mode) !== undefined;
636
+ }
637
+ function getResumableSession(module) {
638
+ if (!module)
639
+ return null;
640
+ const id = getResumableSessionId(module.currentSession, module.mode);
641
+ return id ? { id, agentId: module.id } : null;
642
+ }
643
+ function getModuleSessionState(currentSession, mode) {
644
+ if (!currentSession)
645
+ return null;
646
+ if (canResumeSession(currentSession, mode))
647
+ return "resume";
648
+ if (mode === AGENT_MODE.Standard) {
649
+ const { status } = currentSession;
650
+ if (status === SESSION_STATUS.completed)
651
+ return "completed";
652
+ if (status === SESSION_STATUS.expired)
653
+ return "expired";
654
+ }
655
+ return null;
656
+ }
657
+
658
+ // src/hooks/useSession.ts
498
659
  var API_URL4 = "https://specialist.skippr.ai/api";
499
660
  async function fetchSessionMessages(sessionId, authedFetch) {
500
661
  try {
@@ -502,13 +663,7 @@ async function fetchSessionMessages(sessionId, authedFetch) {
502
663
  if (!resp.ok)
503
664
  return [];
504
665
  const { messages } = await resp.json();
505
- return messages.filter((message) => message.role !== "system").map((message) => ({
506
- id: message.id,
507
- role: message.role === "user" ? "user" : "assistant",
508
- content: message.content,
509
- source: "chat",
510
- timestamp: new Date(message.createdAt).getTime()
511
- }));
666
+ return mapApiMessages(messages);
512
667
  } catch {
513
668
  return [];
514
669
  }
@@ -552,27 +707,27 @@ function useSession({
552
707
  onStartError,
553
708
  onDisconnect
554
709
  }) {
555
- const [connection, setConnection] = useState6(null);
556
- const [shouldConnect, setShouldConnect] = useState6(false);
557
- const [isStarting, setIsStarting] = useState6(false);
558
- const [isDisconnecting, setIsDisconnecting] = useState6(false);
559
- const [error, setError] = useState6("");
560
- const [errorCode, setErrorCode] = useState6(null);
561
- const [sessionId, setSessionId] = useState6(null);
562
- const [bearerToken, setBearerToken] = useState6(authToken ?? null);
563
- const [pendingScreenStream, setPendingScreenStream] = useState6(null);
564
- const [isPaused, setIsPaused] = useState6(false);
565
- const [isPausing, setIsPausing] = useState6(false);
566
- const [pauseTimeoutSeconds, setPauseTimeoutSeconds] = useState6(null);
567
- const [historyMessages, setHistoryMessages] = useState6([]);
568
- const [authFailed, setAuthFailed] = useState6(false);
710
+ const [connection, setConnection] = useState7(null);
711
+ const [shouldConnect, setShouldConnect] = useState7(false);
712
+ const [isStarting, setIsStarting] = useState7(false);
713
+ const [isDisconnecting, setIsDisconnecting] = useState7(false);
714
+ const [error, setError] = useState7("");
715
+ const [errorCode, setErrorCode] = useState7(null);
716
+ const [sessionId, setSessionId] = useState7(null);
717
+ const [bearerToken, setBearerToken] = useState7(authToken ?? null);
718
+ const [pendingScreenStream, setPendingScreenStream] = useState7(null);
719
+ const [isPaused, setIsPaused] = useState7(false);
720
+ const [isPausing, setIsPausing] = useState7(false);
721
+ const [pauseTimeoutSeconds, setPauseTimeoutSeconds] = useState7(null);
722
+ const [historyMessages, setHistoryMessages] = useState7([]);
723
+ const [authFailed, setAuthFailed] = useState7(false);
569
724
  const tokenRef = useRef(authToken ? { token: authToken, expiresAt: null } : null);
570
725
  const getUserTokenRef = useRef(getUserToken);
571
726
  getUserTokenRef.current = getUserToken ?? (userToken ? () => Promise.resolve(userToken) : undefined);
572
727
  const failedBearerRef = useRef(null);
573
728
  const inFlightExchangeRef = useRef(null);
574
- const canExchange = useCallback5(() => !!appKey && !!getUserTokenRef.current, [appKey]);
575
- const reExchange = useCallback5(async () => {
729
+ const canExchange = useCallback6(() => !!appKey && !!getUserTokenRef.current, [appKey]);
730
+ const reExchange = useCallback6(async () => {
576
731
  if (inFlightExchangeRef.current)
577
732
  return inFlightExchangeRef.current;
578
733
  const provider = getUserTokenRef.current;
@@ -592,7 +747,7 @@ function useSession({
592
747
  inFlightExchangeRef.current = null;
593
748
  }
594
749
  }, [appKey]);
595
- const getValidBearer = useCallback5(async () => {
750
+ const getValidBearer = useCallback6(async () => {
596
751
  const current = tokenRef.current;
597
752
  if (current) {
598
753
  if (current.expiresAt === null)
@@ -604,7 +759,7 @@ function useSession({
604
759
  return reExchange();
605
760
  return current?.token ?? null;
606
761
  }, [canExchange, reExchange]);
607
- const authedFetch = useCallback5(async (input, init = {}) => {
762
+ const authedFetch = useCallback6(async (input, init = {}) => {
608
763
  const isSecretMode = canExchange();
609
764
  const onTerminalAuthFailure = () => {
610
765
  if (isSecretMode)
@@ -646,7 +801,7 @@ function useSession({
646
801
  setAuthFailed(false);
647
802
  return resp;
648
803
  }, [canExchange, getValidBearer, reExchange]);
649
- useEffect6(() => {
804
+ useEffect7(() => {
650
805
  let stale = false;
651
806
  if (authToken) {
652
807
  tokenRef.current = { token: authToken, expiresAt: null };
@@ -667,7 +822,7 @@ function useSession({
667
822
  }, [authToken, canExchange, reExchange]);
668
823
  const pauseOnUnloadRef = useRef(null);
669
824
  pauseOnUnloadRef.current = connection !== null && !isPaused && sessionId && bearerToken ? { sessionId, bearerToken } : null;
670
- useEffect6(() => {
825
+ useEffect7(() => {
671
826
  const onPageHide = () => {
672
827
  const pending = pauseOnUnloadRef.current;
673
828
  if (!pending)
@@ -682,7 +837,7 @@ function useSession({
682
837
  window.addEventListener("pagehide", onPageHide);
683
838
  return () => window.removeEventListener("pagehide", onPageHide);
684
839
  }, []);
685
- const startSession = useCallback5(async ({ agentId, agentControls, existingSessionId, adoptionGoalId }) => {
840
+ const startSession = useCallback6(async ({ agentId, agentControls, existingSessionId, adoptionGoalId }) => {
686
841
  if (!bearerToken) {
687
842
  setError("No auth token available");
688
843
  return;
@@ -763,7 +918,7 @@ function useSession({
763
918
  setIsStarting(false);
764
919
  }
765
920
  }, [captureMode, bearerToken, authedFetch, onStart, onStartError]);
766
- const pauseSession = useCallback5(async () => {
921
+ const pauseSession = useCallback6(async () => {
767
922
  if (!sessionId || !bearerToken)
768
923
  return;
769
924
  setIsPausing(true);
@@ -789,7 +944,7 @@ function useSession({
789
944
  setIsPaused(true);
790
945
  setIsPausing(false);
791
946
  }, [sessionId, bearerToken, authedFetch, pendingScreenStream]);
792
- const disconnect = useCallback5(async () => {
947
+ const disconnect = useCallback6(async () => {
793
948
  setIsDisconnecting(true);
794
949
  try {
795
950
  if (sessionId && bearerToken) {
@@ -833,6 +988,55 @@ function useSession({
833
988
  };
834
989
  }
835
990
 
991
+ // src/hooks/useSessionHistory.ts
992
+ import { useEffect as useEffect8, useState as useState8 } from "react";
993
+ var API_URL5 = "https://specialist.skippr.ai/api";
994
+ var EMPTY = { messages: [], phases: [] };
995
+ function useSessionHistory({
996
+ agentId,
997
+ enabled,
998
+ authedFetch
999
+ }) {
1000
+ const [history2, setHistory] = useState8(EMPTY);
1001
+ const [loadedAgentId, setLoadedAgentId] = useState8(null);
1002
+ const activeAgentId = enabled && agentId ? agentId : null;
1003
+ const isLoading = activeAgentId !== null && activeAgentId !== loadedAgentId;
1004
+ useEffect8(() => {
1005
+ if (!enabled || !agentId) {
1006
+ setHistory(EMPTY);
1007
+ setLoadedAgentId(null);
1008
+ return;
1009
+ }
1010
+ let stale = false;
1011
+ (async () => {
1012
+ try {
1013
+ const resp = await authedFetch(`${API_URL5}/v1/modules/${agentId}/history`);
1014
+ if (!resp.ok)
1015
+ throw new Error(`Failed to load agent history: ${resp.status}`);
1016
+ const data = await resp.json();
1017
+ if (stale)
1018
+ return;
1019
+ setHistory({
1020
+ messages: mapApiMessages(data.messages),
1021
+ phases: data.phases
1022
+ });
1023
+ } catch (e) {
1024
+ if (stale)
1025
+ return;
1026
+ console.warn("[Skippr] Failed to load session history:", e);
1027
+ setHistory(EMPTY);
1028
+ } finally {
1029
+ if (!stale)
1030
+ setLoadedAgentId(agentId);
1031
+ }
1032
+ })();
1033
+ return () => {
1034
+ stale = true;
1035
+ };
1036
+ }, [enabled, agentId, authedFetch]);
1037
+ return { ...history2, isLoading };
1038
+ }
1039
+
836
1040
  // src/lib/launcher.ts
837
1041
  var DEFAULT_LAUNCHER_BOTTOM_PX = 48;
838
1042
  var LAUNCHER_HEIGHT_PX = 50;
@@ -863,58 +1067,6 @@ function verticalAlignToBottomPx(align) {
863
1067
  function launcherPopsDown(bottomPx) {
864
1068
  return bottomPx + LAUNCHER_HEIGHT_PX / 2 > window.innerHeight / 2;
865
1069
  }
866
-
867
- // src/lib/agentMode.ts
868
- var AGENT_MODE = {
869
- Standard: "standard",
870
- AlwaysOn: "always_on"
871
- };
872
- var AGENT_MODES = Object.values(AGENT_MODE);
873
-
874
- // src/lib/sessionStatus.ts
875
- var SESSION_STATUS = {
876
- pending: "pending",
877
- active: "active",
878
- paused: "paused",
879
- completed: "completed",
880
- expired: "expired"
881
- };
882
- var SESSION_STATUSES = Object.values(SESSION_STATUS);
883
-
884
- // src/lib/session.ts
885
- function getResumableSessionId(currentSession, mode) {
886
- if (!currentSession)
887
- return;
888
- const { id, status } = currentSession;
889
- if (status === SESSION_STATUS.paused || status === SESSION_STATUS.active)
890
- return id;
891
- if (mode === AGENT_MODE.AlwaysOn && (status === SESSION_STATUS.expired || status === SESSION_STATUS.completed))
892
- return id;
893
- return;
894
- }
895
- function canResumeSession(currentSession, mode) {
896
- return getResumableSessionId(currentSession, mode) !== undefined;
897
- }
898
- function getResumableSession(module) {
899
- if (!module)
900
- return null;
901
- const id = getResumableSessionId(module.currentSession, module.mode);
902
- return id ? { id, agentId: module.id } : null;
903
- }
904
- function getModuleSessionState(currentSession, mode) {
905
- if (!currentSession)
906
- return null;
907
- if (canResumeSession(currentSession, mode))
908
- return "resume";
909
- if (mode === AGENT_MODE.Standard) {
910
- const { status } = currentSession;
911
- if (status === SESSION_STATUS.completed)
912
- return "completed";
913
- if (status === SESSION_STATUS.expired)
914
- return "expired";
915
- }
916
- return null;
917
- }
918
1070
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/createLucideIcon.js
919
1071
  import { forwardRef as forwardRef2, createElement as createElement3 } from "react";
920
1072
 
@@ -962,9 +1114,9 @@ var hasA11yProp = (props) => {
962
1114
  };
963
1115
 
964
1116
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/context.js
965
- import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2, createElement } from "react";
966
- var LucideContext = createContext2({});
967
- var useLucideContext = () => useContext2(LucideContext);
1117
+ import { createContext as createContext3, useContext as useContext3, useMemo as useMemo2, createElement } from "react";
1118
+ var LucideContext = createContext3({});
1119
+ var useLucideContext = () => useContext3(LucideContext);
968
1120
 
969
1121
  // ../../node_modules/.bun/lucide-react@1.8.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/Icon.js
970
1122
  var Icon = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
@@ -1188,7 +1340,7 @@ var __iconNode23 = [
1188
1340
  ];
1189
1341
  var X = createLucideIcon("x", __iconNode23);
1190
1342
  // src/components/AgentCursor.tsx
1191
- import { useContext as useContext3, useEffect as useEffect7, useLayoutEffect, useRef as useRef2, useState as useState7 } from "react";
1343
+ import { useContext as useContext4, useEffect as useEffect9, useLayoutEffect, useRef as useRef2, useState as useState9 } from "react";
1192
1344
 
1193
1345
  // src/capture/elementRef.ts
1194
1346
  function safeGetIframeDocument(iframe) {
@@ -1325,7 +1477,7 @@ function traceRing(path, durationMs, onFrame, onDone) {
1325
1477
  }
1326
1478
 
1327
1479
  // src/components/AgentCursor.tsx
1328
- import { jsx, jsxs } from "react/jsx-runtime";
1480
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
1329
1481
  var Z_INDEX = 2147483646;
1330
1482
  var BRAND_TEAL = "#2bc0ae";
1331
1483
  var GLIDE_EASE = "cubic-bezier(0.45, 0, 0.25, 1)";
@@ -1370,12 +1522,12 @@ function AgentCursor({
1370
1522
  target,
1371
1523
  animated = false
1372
1524
  }) {
1373
- const ctx = useContext3(LiveAgentContext);
1374
- const [cursor, setCursor] = useState7(null);
1375
- const [glideMs, setGlideMs] = useState7(0);
1376
- const [phase, setPhase] = useState7("idle");
1377
- const [ringBox, setRingBox] = useState7(null);
1378
- const [clickPulse, setClickPulse] = useState7(0);
1525
+ const ctx = useContext4(LiveAgentContext);
1526
+ const [cursor, setCursor] = useState9(null);
1527
+ const [glideMs, setGlideMs] = useState9(0);
1528
+ const [phase, setPhase] = useState9("idle");
1529
+ const [ringBox, setRingBox] = useState9(null);
1530
+ const [clickPulse, setClickPulse] = useState9(0);
1379
1531
  const cursorElRef = useRef2(null);
1380
1532
  const pathRef = useRef2(null);
1381
1533
  const prevCursorRef = useRef2(null);
@@ -1498,7 +1650,7 @@ function AgentCursor({
1498
1650
  });
1499
1651
  return cancelAnimation;
1500
1652
  }, [target, animated]);
1501
- useEffect7(() => {
1653
+ useEffect9(() => {
1502
1654
  if (!target || target.kind === "gesture" || phase === "idle")
1503
1655
  return;
1504
1656
  const track = () => {
@@ -1530,7 +1682,7 @@ function AgentCursor({
1530
1682
  }
1531
1683
  };
1532
1684
  }, [target, phase]);
1533
- useEffect7(() => {
1685
+ useEffect9(() => {
1534
1686
  return () => {
1535
1687
  traceRef.current?.cancel();
1536
1688
  for (const t of timersRef.current)
@@ -1547,10 +1699,10 @@ function AgentCursor({
1547
1699
  "data-skippr-private": "true",
1548
1700
  "aria-hidden": "true",
1549
1701
  children: [
1550
- drawing && ringBox && /* @__PURE__ */ jsx("svg", {
1702
+ drawing && ringBox && /* @__PURE__ */ jsx2("svg", {
1551
1703
  "aria-hidden": "true",
1552
1704
  style: { ...ringBoxStyle(ringBox, Z_INDEX), overflow: "visible" },
1553
- children: /* @__PURE__ */ jsx("path", {
1705
+ children: /* @__PURE__ */ jsx2("path", {
1554
1706
  ref: pathRef,
1555
1707
  d: ringPathD(ringBox),
1556
1708
  fill: "none",
@@ -1564,20 +1716,20 @@ function AgentCursor({
1564
1716
  style: ringBoxStyle(ringBox, Z_INDEX),
1565
1717
  className: "skippr:relative",
1566
1718
  children: [
1567
- /* @__PURE__ */ jsx("div", {
1719
+ /* @__PURE__ */ jsx2("div", {
1568
1720
  className: "skippr:absolute skippr:inset-0 skippr:rounded-[1rem] skippr:border-2 skippr:border-[#2bc0ae] skippr:animate-skippr-annotation-pulse"
1569
1721
  }),
1570
- /* @__PURE__ */ jsx("div", {
1722
+ /* @__PURE__ */ jsx2("div", {
1571
1723
  role: "status",
1572
1724
  className: "skippr:absolute skippr:-bottom-9 skippr:left-1/2 skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-[#2bc0ae] skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
1573
- children: /* @__PURE__ */ jsx("span", {
1725
+ children: /* @__PURE__ */ jsx2("span", {
1574
1726
  className: "skippr:text-[11px] skippr:font-medium skippr:text-white skippr:whitespace-nowrap",
1575
1727
  children: target.label
1576
1728
  })
1577
1729
  })
1578
1730
  ]
1579
1731
  }),
1580
- target.kind === "gesture" && /* @__PURE__ */ jsx("div", {
1732
+ target.kind === "gesture" && /* @__PURE__ */ jsx2("div", {
1581
1733
  role: "status",
1582
1734
  className: "skippr:fixed skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-[#2bc0ae] skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
1583
1735
  style: {
@@ -1587,12 +1739,12 @@ function AgentCursor({
1587
1739
  pointerEvents: "none",
1588
1740
  transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
1589
1741
  },
1590
- children: /* @__PURE__ */ jsx("span", {
1742
+ children: /* @__PURE__ */ jsx2("span", {
1591
1743
  className: "skippr:text-[11px] skippr:font-medium skippr:text-white skippr:whitespace-nowrap",
1592
1744
  children: target.label
1593
1745
  })
1594
1746
  }),
1595
- /* @__PURE__ */ jsx("div", {
1747
+ /* @__PURE__ */ jsx2("div", {
1596
1748
  ref: cursorElRef,
1597
1749
  style: {
1598
1750
  position: "fixed",
@@ -1602,12 +1754,12 @@ function AgentCursor({
1602
1754
  zIndex: Z_INDEX,
1603
1755
  transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
1604
1756
  },
1605
- children: /* @__PURE__ */ jsx(MousePointer2, {
1757
+ children: /* @__PURE__ */ jsx2(MousePointer2, {
1606
1758
  className: `skippr:h-5 skippr:w-5 skippr:text-[#2bc0ae] skippr:drop-shadow-[0_2px_5px_rgba(0,0,0,0.4)] ${clickPulse > 0 ? "skippr:animate-skippr-press" : "skippr:animate-skippr-cursor-pop"}`,
1607
1759
  fill: "currentColor"
1608
1760
  }, clickPulse)
1609
1761
  }),
1610
- clickPulse > 0 && rippleCenter && /* @__PURE__ */ jsx("span", {
1762
+ clickPulse > 0 && rippleCenter && /* @__PURE__ */ jsx2("span", {
1611
1763
  className: "skippr:fixed skippr:h-7 skippr:w-7 skippr:rounded-full skippr:bg-[#2bc0ae]/50 skippr:animate-skippr-click-ping",
1612
1764
  style: {
1613
1765
  left: `${rippleCenter.x}px`,
@@ -1621,14 +1773,14 @@ function AgentCursor({
1621
1773
  }
1622
1774
 
1623
1775
  // src/components/AutoStartMedia.tsx
1624
- import { useConnectionState, useLocalParticipant } from "@livekit/components-react/hooks";
1776
+ import { useConnectionState, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
1625
1777
  import { ConnectionState, Track } from "livekit-client";
1626
- import { useEffect as useEffect8, useRef as useRef3 } from "react";
1778
+ import { useEffect as useEffect10, useRef as useRef3 } from "react";
1627
1779
  function AutoStartMedia({ pendingScreenStream }) {
1628
- const { localParticipant } = useLocalParticipant();
1780
+ const { localParticipant } = useLocalParticipant2();
1629
1781
  const connectionState = useConnectionState();
1630
1782
  const didStartRef = useRef3(false);
1631
- useEffect8(() => {
1783
+ useEffect10(() => {
1632
1784
  if (didStartRef.current)
1633
1785
  return;
1634
1786
  if (connectionState !== ConnectionState.Connected)
@@ -1651,9 +1803,9 @@ function AutoStartMedia({ pendingScreenStream }) {
1651
1803
  }
1652
1804
 
1653
1805
  // src/components/DomCapture.tsx
1654
- import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant2 } from "@livekit/components-react/hooks";
1806
+ import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
1655
1807
  import { ConnectionState as ConnectionState2, ScreenSharePresets, Track as Track2 } from "livekit-client";
1656
- import { useEffect as useEffect9, useRef as useRef4 } from "react";
1808
+ import { useEffect as useEffect11, useRef as useRef4 } from "react";
1657
1809
 
1658
1810
  // src/capture/a11yUtils.ts
1659
1811
  var ROLE_BY_TAG = {
@@ -2268,7 +2420,7 @@ function subscribeActionsBusy(cb) {
2268
2420
 
2269
2421
  // src/capture/domEvents.ts
2270
2422
  var MUTATION_DEBOUNCE_MS = 250;
2271
- var textEncoder = new TextEncoder;
2423
+ var textEncoder2 = new TextEncoder;
2272
2424
  function isInsideWidget(target) {
2273
2425
  if (!(target instanceof Node))
2274
2426
  return false;
@@ -2294,7 +2446,7 @@ function installDomEventListeners(localParticipant, options = {}) {
2294
2446
  const { onTriggerEvent } = options;
2295
2447
  function publishDomEvent(event) {
2296
2448
  try {
2297
- localParticipant.publishData(textEncoder.encode(JSON.stringify(event)), {
2449
+ localParticipant.publishData(textEncoder2.encode(JSON.stringify(event)), {
2298
2450
  reliable: true,
2299
2451
  topic: DOM_EVENTS_TOPIC
2300
2452
  }).catch(() => {
@@ -2460,7 +2612,7 @@ var CAPTURE_BITRATE = 4000000;
2460
2612
  var DOM_SNAPSHOT_GZIP_THRESHOLD_BYTES = 14000;
2461
2613
  var MAX_CANVAS_DPR = 1.5;
2462
2614
  var CONSECUTIVE_FAILURES_BEFORE_REPORT = 3;
2463
- var textEncoder2 = new TextEncoder;
2615
+ var textEncoder3 = new TextEncoder;
2464
2616
  function shouldIncludeInSnapshot(element) {
2465
2617
  if (!(element instanceof Element))
2466
2618
  return true;
@@ -2535,7 +2687,7 @@ async function buildDomSnapshotFrame() {
2535
2687
  title: document.title,
2536
2688
  capturedAt: new Date().toISOString()
2537
2689
  });
2538
- const snapshotBytes = textEncoder2.encode(snapshotJson);
2690
+ const snapshotBytes = textEncoder3.encode(snapshotJson);
2539
2691
  const { bytes, compressionFlag } = await gzipIfBeneficial(snapshotBytes);
2540
2692
  const frame = new Uint8Array(bytes.byteLength + 1);
2541
2693
  frame[0] = compressionFlag;
@@ -2544,7 +2696,7 @@ async function buildDomSnapshotFrame() {
2544
2696
  }
2545
2697
  function reportCaptureError(localParticipant) {
2546
2698
  try {
2547
- localParticipant.publishData(textEncoder2.encode(JSON.stringify({ type: "capture_error" })), {
2699
+ localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: "capture_error" })), {
2548
2700
  reliable: true,
2549
2701
  topic: DOM_SNAPSHOT_TOPIC
2550
2702
  }).catch(() => {
@@ -2559,10 +2711,10 @@ async function unpublishAndStopTrack(localParticipant, videoTrack) {
2559
2711
  videoTrack.stop();
2560
2712
  }
2561
2713
  function DomCapture() {
2562
- const { localParticipant } = useLocalParticipant2();
2714
+ const { localParticipant } = useLocalParticipant3();
2563
2715
  const connectionState = useConnectionState2();
2564
2716
  const didStartRef = useRef4(false);
2565
- useEffect9(() => {
2717
+ useEffect11(() => {
2566
2718
  if (didStartRef.current)
2567
2719
  return;
2568
2720
  if (connectionState !== ConnectionState2.Connected)
@@ -2672,7 +2824,7 @@ function DomCapture() {
2672
2824
 
2673
2825
  // src/components/HighlightOverlay.tsx
2674
2826
  import { useDataChannel } from "@livekit/components-react/hooks";
2675
- import { useCallback as useCallback6, useEffect as useEffect10, useRef as useRef5 } from "react";
2827
+ import { useCallback as useCallback7, useEffect as useEffect12, useRef as useRef5 } from "react";
2676
2828
  var HIGHLIGHT_AUTO_CLEAR_MS = 1e4;
2677
2829
  var textDecoder = new TextDecoder;
2678
2830
  function parseHighlightMessage(payload) {
@@ -2697,14 +2849,14 @@ function parseHighlightMessage(payload) {
2697
2849
  function HighlightOverlay() {
2698
2850
  const targetRef = useRef5(null);
2699
2851
  const autoClearRef = useRef5(null);
2700
- const clear = useCallback6(() => {
2852
+ const clear = useCallback7(() => {
2701
2853
  if (autoClearRef.current)
2702
2854
  clearTimeout(autoClearRef.current);
2703
2855
  autoClearRef.current = null;
2704
2856
  targetRef.current = null;
2705
2857
  clearCursorTarget("guide");
2706
2858
  }, []);
2707
- const onHighlightMessage = useCallback6((msg) => {
2859
+ const onHighlightMessage = useCallback7((msg) => {
2708
2860
  const parsed = parseHighlightMessage(msg.payload);
2709
2861
  if (!parsed)
2710
2862
  return;
@@ -2728,7 +2880,7 @@ function HighlightOverlay() {
2728
2880
  autoClearRef.current = setTimeout(clear, HIGHLIGHT_AUTO_CLEAR_MS);
2729
2881
  }, [clear]);
2730
2882
  useDataChannel(HIGHLIGHT_TOPIC, onHighlightMessage);
2731
- useEffect10(() => {
2883
+ useEffect12(() => {
2732
2884
  const onClick = (event) => {
2733
2885
  const target = targetRef.current;
2734
2886
  const node = event.target;
@@ -2738,15 +2890,15 @@ function HighlightOverlay() {
2738
2890
  document.addEventListener("click", onClick, { capture: true });
2739
2891
  return () => document.removeEventListener("click", onClick, { capture: true });
2740
2892
  }, [clear]);
2741
- useEffect10(() => clear, [clear]);
2893
+ useEffect12(() => clear, [clear]);
2742
2894
  return null;
2743
2895
  }
2744
2896
 
2745
2897
  // src/components/MinimizedBubble.tsx
2746
- import { useContext as useContext4, useEffect as useEffect12, useRef as useRef7, useState as useState8 } from "react";
2898
+ import { useContext as useContext5, useEffect as useEffect14, useRef as useRef7, useState as useState10 } from "react";
2747
2899
 
2748
2900
  // src/hooks/useLauncherDrag.ts
2749
- import { useEffect as useEffect11, useRef as useRef6 } from "react";
2901
+ import { useEffect as useEffect13, useRef as useRef6 } from "react";
2750
2902
  import { flushSync } from "react-dom";
2751
2903
  var DRAG_THRESHOLD_PX = 5;
2752
2904
  function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
@@ -2757,7 +2909,7 @@ function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
2757
2909
  followTargetsRef.current = followRefs;
2758
2910
  const reportDraggingRef = useRef6(reportDragging);
2759
2911
  reportDraggingRef.current = reportDragging;
2760
- useEffect11(() => {
2912
+ useEffect13(() => {
2761
2913
  const el = containerRef.current;
2762
2914
  if (!el)
2763
2915
  return;
@@ -2906,7 +3058,7 @@ function cn(...inputs) {
2906
3058
  }
2907
3059
 
2908
3060
  // src/components/AdoptionBubble.tsx
2909
- import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
3061
+ import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
2910
3062
  function AdoptionBubble({
2911
3063
  goal,
2912
3064
  onAttend,
@@ -2914,7 +3066,7 @@ function AdoptionBubble({
2914
3066
  exitDelayMs = 0,
2915
3067
  hidden = false
2916
3068
  }) {
2917
- return /* @__PURE__ */ jsx2("div", {
3069
+ return /* @__PURE__ */ jsx3("div", {
2918
3070
  style: {
2919
3071
  animationDelay: `${appearDelayMs}ms`,
2920
3072
  transitionDelay: hidden ? `${exitDelayMs}ms` : "0ms"
@@ -2925,18 +3077,18 @@ function AdoptionBubble({
2925
3077
  onClick: () => onAttend(goal),
2926
3078
  className: cn("skippr:flex skippr:max-w-72 skippr:items-center skippr:gap-2", "skippr:rounded-[14px] skippr:bg-amber-50 skippr:py-1.5 skippr:pr-3 skippr:pl-1.5", "skippr:text-left skippr:shadow-[0_8px_24px_rgba(0,0,0,0.18)]", "skippr:transition-colors skippr:cursor-pointer skippr:hover:bg-amber-100", "skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-bubble/60"),
2927
3079
  children: [
2928
- /* @__PURE__ */ jsx2("span", {
3080
+ /* @__PURE__ */ jsx3("span", {
2929
3081
  className: cn("skippr:flex skippr:h-6 skippr:w-6 skippr:shrink-0 skippr:items-center skippr:justify-center", "skippr:text-amber-700"),
2930
- children: /* @__PURE__ */ jsx2(Lightbulb, {
3082
+ children: /* @__PURE__ */ jsx3(Lightbulb, {
2931
3083
  className: "skippr:h-3.5 skippr:w-3.5",
2932
3084
  fill: "currentColor"
2933
3085
  })
2934
3086
  }),
2935
- /* @__PURE__ */ jsx2("span", {
3087
+ /* @__PURE__ */ jsx3("span", {
2936
3088
  className: "skippr:min-w-0 skippr:truncate skippr:text-[13px] skippr:font-semibold skippr:text-amber-950",
2937
3089
  children: goal.displayMessage
2938
3090
  }),
2939
- /* @__PURE__ */ jsx2(ArrowRight, {
3091
+ /* @__PURE__ */ jsx3(ArrowRight, {
2940
3092
  className: "skippr:h-3.5 skippr:w-3.5 skippr:shrink-0 skippr:text-amber-700"
2941
3093
  })
2942
3094
  ]
@@ -2945,12 +3097,12 @@ function AdoptionBubble({
2945
3097
  }
2946
3098
 
2947
3099
  // src/components/ModulePill.tsx
2948
- import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
3100
+ import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
2949
3101
  var RING_RADIUS = 8;
2950
3102
  var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
2951
- function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2952
- const completedPhases = progress?.completed ?? module.currentSession?.currentPhaseIndex ?? 0;
2953
- const totalPhases = progress?.total ?? module.totalPhases;
3103
+ function ModulePill({ module, onSelect }) {
3104
+ const completedPhases = module.currentSession?.currentPhaseIndex ?? 0;
3105
+ const totalPhases = module.totalPhases;
2954
3106
  const showProgress = module.mode !== AGENT_MODE.AlwaysOn && totalPhases > 0;
2955
3107
  const progressFraction = showProgress ? Math.min(completedPhases / totalPhases, 1) : 0;
2956
3108
  return /* @__PURE__ */ jsxs3("button", {
@@ -2958,16 +3110,12 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2958
3110
  onClick: () => onSelect(module.id),
2959
3111
  className: cn("skippr:flex skippr:w-40 skippr:items-center skippr:gap-1.5 skippr:whitespace-nowrap", "skippr:rounded-[14px] skippr:bg-white skippr:px-3 skippr:py-1.5", "skippr:text-[13px] skippr:font-medium skippr:text-black", "skippr:shadow-[0_8px_24px_rgba(0,0,0,0.18)]", "skippr:transition-colors skippr:cursor-pointer skippr:hover:bg-neutral-100", "skippr:animate-[skippr-bubble-in_0.28s_ease-out]", "skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-bubble/60"),
2960
3112
  children: [
2961
- isLive && /* @__PURE__ */ jsx3("span", {
2962
- "aria-hidden": "true",
2963
- className: "skippr:size-[6px] skippr:shrink-0 skippr:rounded-full skippr:bg-emerald-500 skippr:animate-pulse skippr:motion-reduce:animate-none"
2964
- }),
2965
- showProgress && !isLive && /* @__PURE__ */ jsxs3("svg", {
3113
+ showProgress && /* @__PURE__ */ jsxs3("svg", {
2966
3114
  viewBox: "0 0 20 20",
2967
3115
  className: "skippr:size-4 skippr:shrink-0 skippr:-rotate-90",
2968
3116
  "aria-hidden": "true",
2969
3117
  children: [
2970
- /* @__PURE__ */ jsx3("circle", {
3118
+ /* @__PURE__ */ jsx4("circle", {
2971
3119
  cx: "10",
2972
3120
  cy: "10",
2973
3121
  r: RING_RADIUS,
@@ -2975,7 +3123,7 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2975
3123
  strokeWidth: "2.5",
2976
3124
  className: "skippr:stroke-black/15"
2977
3125
  }),
2978
- /* @__PURE__ */ jsx3("circle", {
3126
+ /* @__PURE__ */ jsx4("circle", {
2979
3127
  cx: "10",
2980
3128
  cy: "10",
2981
3129
  r: RING_RADIUS,
@@ -2988,9 +3136,9 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
2988
3136
  })
2989
3137
  ]
2990
3138
  }),
2991
- /* @__PURE__ */ jsx3("span", {
3139
+ /* @__PURE__ */ jsx4("span", {
2992
3140
  className: "skippr:min-w-0 skippr:flex-1 skippr:truncate skippr:text-left",
2993
- children: label ?? module.name
3141
+ children: module.name
2994
3142
  }),
2995
3143
  showProgress && /* @__PURE__ */ jsxs3("span", {
2996
3144
  className: cn("skippr:ml-0.5 skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-1 skippr:rounded-full", "skippr:bg-black/[0.07] skippr:px-1.5 skippr:py-0.5", "skippr:text-[10px] skippr:font-semibold"),
@@ -3005,29 +3153,86 @@ function ModulePill({ module, onSelect, progress, isLive = false, label }) {
3005
3153
  }
3006
3154
 
3007
3155
  // src/components/MinimizedBubble.tsx
3008
- import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
3156
+ import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
3009
3157
  var GOALS_AUTO_HIDE_MS = 1e4;
3010
3158
  var GOAL_FADE_OUT_MS = 300;
3011
3159
  var GOAL_APPEAR_STAGGER_MS = 150;
3012
3160
  var GOAL_EXIT_STAGGER_MS = 250;
3013
3161
  var MAX_GOAL_BUBBLES = 3;
3014
3162
  var MAX_MODULE_PILLS = 3;
3015
- function IdleLauncher({ position, onClick }) {
3016
- return /* @__PURE__ */ jsx4("button", {
3163
+ function SkipprMark({ onStart }) {
3164
+ return /* @__PURE__ */ jsx5("button", {
3017
3165
  type: "button",
3018
- onClick,
3166
+ onClick: onStart,
3019
3167
  "aria-label": "Ask Me Anything",
3020
- className: cn("skippr:group skippr:relative skippr:h-[50px] skippr:w-[50px]", "skippr:rounded-[16px] skippr:bg-launcher skippr:cursor-pointer", "skippr:shadow-[-6px_6px_22px_rgba(0,0,0,0.3)]", "skippr:[animation:skippr-orb-in_320ms_cubic-bezier(0.34,1.3,0.64,1)]", "skippr:transition-transform skippr:duration-200 skippr:ease-out skippr:hover:scale-110", position === "right" ? "skippr:translate-x-7 skippr:origin-right" : "skippr:-translate-x-7 skippr:origin-left"),
3021
- children: /* @__PURE__ */ jsx4("svg", {
3168
+ className: "skippr:flex skippr:h-[36px] skippr:w-[36px] skippr:shrink-0 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:bg-transparent skippr:p-0",
3169
+ children: /* @__PURE__ */ jsx5("svg", {
3022
3170
  viewBox: "0 0 15.4044 18.4853",
3023
- className: cn("skippr:absolute skippr:top-1/2 skippr:-translate-y-1/2 skippr:h-[18.5px] skippr:w-[15.4px]", position === "right" ? "skippr:right-[24px]" : "skippr:left-[24px]"),
3171
+ className: "skippr:h-[18.5px] skippr:w-[15.4px]",
3024
3172
  fill: "none",
3025
3173
  "aria-hidden": "true",
3026
- children: /* @__PURE__ */ jsx4("path", {
3174
+ children: /* @__PURE__ */ jsx5("path", {
3027
3175
  d: "M2.25789 0.295419C1.33925 -0.413932 0 0.234459 0 1.38715V17.0972C0 18.4106 1.67407 18.987 2.49664 17.9562L6.40435 13.061C6.54853 12.8805 6.73209 12.7348 6.94126 12.6347C7.15043 12.5345 7.37978 12.4826 7.6121 12.4828H14.0025C15.3343 12.4828 15.9134 10.8128 14.8614 10.0037L2.25789 0.295419Z",
3028
3176
  className: "skippr:fill-brand"
3029
3177
  })
3030
- })
3178
+ })
3179
+ });
3180
+ }
3181
+ function ChatButton({
3182
+ revealed,
3183
+ position,
3184
+ onClick
3185
+ }) {
3186
+ return /* @__PURE__ */ jsx5("button", {
3187
+ type: "button",
3188
+ onClick,
3189
+ "aria-label": "Open chat",
3190
+ tabIndex: revealed ? 0 : -1,
3191
+ className: cn("skippr:h-[36px] skippr:shrink-0 skippr:overflow-hidden skippr:p-0", "skippr:transition-all skippr:duration-[400ms] skippr:ease-[cubic-bezier(0.22,1,0.36,1)]", position === "right" ? "skippr:order-last" : "skippr:order-first"),
3192
+ style: {
3193
+ width: revealed ? 36 : 0,
3194
+ opacity: revealed ? 1 : 0,
3195
+ transform: revealed ? "scale(1)" : "scale(0.55)",
3196
+ cursor: revealed ? "pointer" : "default"
3197
+ },
3198
+ children: /* @__PURE__ */ jsx5("span", {
3199
+ className: "skippr:flex skippr:h-[36px] skippr:w-[36px] skippr:items-center skippr:justify-center skippr:rounded-[11px] skippr:bg-white",
3200
+ children: /* @__PURE__ */ jsx5("svg", {
3201
+ width: "18",
3202
+ height: "18",
3203
+ viewBox: "0 0 24 24",
3204
+ fill: "none",
3205
+ stroke: "#1c1f2a",
3206
+ strokeWidth: "2",
3207
+ strokeLinecap: "round",
3208
+ strokeLinejoin: "round",
3209
+ "aria-hidden": "true",
3210
+ children: /* @__PURE__ */ jsx5("path", {
3211
+ d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
3212
+ })
3213
+ })
3214
+ })
3215
+ });
3216
+ }
3217
+ function IdleLauncher({
3218
+ position,
3219
+ isHovered,
3220
+ onStart,
3221
+ onChat
3222
+ }) {
3223
+ return /* @__PURE__ */ jsxs4("div", {
3224
+ className: cn("skippr:flex skippr:h-[48px] skippr:items-center", "skippr:bg-launcher skippr:p-1.5 skippr:shadow-[-6px_8px_30px_rgba(15,18,26,0.32)]", "skippr:[animation:skippr-orb-in_320ms_cubic-bezier(0.34,1.3,0.64,1)]", "skippr:transition-transform skippr:duration-[400ms] skippr:ease-[cubic-bezier(0.22,1,0.36,1)]", position === "right" ? "skippr:rounded-l-[18px] skippr:origin-right" : "skippr:rounded-r-[18px] skippr:origin-left", position === "right" ? isHovered ? "skippr:translate-x-3" : "skippr:translate-x-7" : isHovered ? "skippr:-translate-x-3" : "skippr:-translate-x-7"),
3225
+ style: { gap: isHovered ? 8 : 0 },
3226
+ children: [
3227
+ /* @__PURE__ */ jsx5(ChatButton, {
3228
+ revealed: isHovered,
3229
+ position,
3230
+ onClick: onChat
3231
+ }),
3232
+ /* @__PURE__ */ jsx5(SkipprMark, {
3233
+ onStart
3234
+ })
3235
+ ]
3031
3236
  });
3032
3237
  }
3033
3238
  function WelcomeBubble({
@@ -3037,7 +3242,7 @@ function WelcomeBubble({
3037
3242
  onDismiss,
3038
3243
  onClick
3039
3244
  }) {
3040
- useEffect12(() => {
3245
+ useEffect14(() => {
3041
3246
  const timer = setTimeout(onDismiss, 5000);
3042
3247
  return () => clearTimeout(timer);
3043
3248
  }, [onDismiss]);
@@ -3048,7 +3253,7 @@ function WelcomeBubble({
3048
3253
  "aria-label": "Dismiss",
3049
3254
  children: [
3050
3255
  message,
3051
- /* @__PURE__ */ jsx4("span", {
3256
+ /* @__PURE__ */ jsx5("span", {
3052
3257
  className: cn("skippr:absolute skippr:size-2.5", "skippr:border-l skippr:border-t skippr:border-border skippr:bg-card", popsDown ? "skippr:bottom-full skippr:rotate-45 skippr:-mb-[5px]" : "skippr:top-full skippr:rotate-[225deg] skippr:-mt-[5px]", position === "right" ? "skippr:right-5" : "skippr:left-5")
3053
3258
  })
3054
3259
  ]
@@ -3059,7 +3264,7 @@ function MinimizedBubble({
3059
3264
  welcomeDismissed,
3060
3265
  onDismissWelcome
3061
3266
  }) {
3062
- const ctx = useContext4(LiveAgentContext);
3267
+ const ctx = useContext5(LiveAgentContext);
3063
3268
  if (!ctx) {
3064
3269
  throw new Error("MinimizedBubble must be used within a <LiveAgent> provider");
3065
3270
  }
@@ -3072,19 +3277,22 @@ function MinimizedBubble({
3072
3277
  startAdoptionSession,
3073
3278
  isAuthenticated,
3074
3279
  displayModules,
3280
+ defaultAgentId,
3281
+ startDefaultSession,
3075
3282
  hasResolvedModules,
3076
3283
  isLoadingModules,
3077
3284
  selectModule,
3078
3285
  expandPanel,
3286
+ setSidebarTab,
3079
3287
  commitLauncherDrop
3080
3288
  } = ctx;
3081
- const [goalsAutoHidden, setGoalsAutoHidden] = useState8(false);
3082
- const [isLauncherHovered, setIsLauncherHovered] = useState8(false);
3083
- const [visitHref, setVisitHref] = useState8(() => window.location.href);
3289
+ const [goalsAutoHidden, setGoalsAutoHidden] = useState10(false);
3290
+ const [isLauncherHovered, setIsLauncherHovered] = useState10(false);
3291
+ const [visitHref, setVisitHref] = useState10(() => window.location.href);
3084
3292
  const revealedHrefRef = useRef7(null);
3085
3293
  const hoverContainerRef = useRef7(null);
3086
- useEffect12(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
3087
- useEffect12(() => {
3294
+ useEffect14(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
3295
+ useEffect14(() => {
3088
3296
  const el = hoverContainerRef.current;
3089
3297
  if (!el)
3090
3298
  return;
@@ -3102,12 +3310,11 @@ function MinimizedBubble({
3102
3310
  const state = getModuleSessionState(module.currentSession, module.mode);
3103
3311
  return state !== "completed" && state !== "expired";
3104
3312
  });
3105
- const alwaysOnModule = actionableModules.find((module) => module.mode === AGENT_MODE.AlwaysOn);
3106
3313
  const pillCandidates = actionableModules.filter((module) => module.mode !== AGENT_MODE.AlwaysOn);
3107
3314
  const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
3108
3315
  const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
3109
3316
  const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && hasResolvedModules;
3110
- useEffect12(() => {
3317
+ useEffect14(() => {
3111
3318
  if (!goalsEligible)
3112
3319
  return;
3113
3320
  if (revealedHrefRef.current === visitHref) {
@@ -3121,8 +3328,8 @@ function MinimizedBubble({
3121
3328
  }, [goalsEligible, visitHref]);
3122
3329
  const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
3123
3330
  const goalsHidden = goalsAutoHidden && !isLauncherHovered;
3124
- const [goalsUnmounted, setGoalsUnmounted] = useState8(false);
3125
- useEffect12(() => {
3331
+ const [goalsUnmounted, setGoalsUnmounted] = useState10(false);
3332
+ useEffect14(() => {
3126
3333
  if (!goalsHidden) {
3127
3334
  setGoalsUnmounted(false);
3128
3335
  return;
@@ -3132,12 +3339,18 @@ function MinimizedBubble({
3132
3339
  return () => clearTimeout(timer);
3133
3340
  }, [goalsHidden]);
3134
3341
  const visibleGoals = goalsUnmounted ? [] : matchedGoals;
3342
+ const openChat = (e) => {
3343
+ e.stopPropagation();
3344
+ if (wasDraggedRef.current)
3345
+ return;
3346
+ setSidebarTab("chat");
3347
+ expandPanel();
3348
+ };
3135
3349
  const launchDefaultSession = () => {
3136
3350
  if (wasDraggedRef.current || isStarting || isLoadingModules)
3137
3351
  return;
3138
- const target = isAuthenticated ? alwaysOnModule ?? onboardingModule ?? pillCandidates[0] : null;
3139
- if (target) {
3140
- selectModule(target.id);
3352
+ if (isAuthenticated && defaultAgentId) {
3353
+ startDefaultSession();
3141
3354
  } else {
3142
3355
  expandPanel();
3143
3356
  }
@@ -3150,7 +3363,7 @@ function MinimizedBubble({
3150
3363
  (modulePills.length > 0 || visibleGoals.length > 0) && /* @__PURE__ */ jsxs4("div", {
3151
3364
  className: cn("skippr:absolute skippr:gap-2", popsDown ? "skippr:top-full skippr:mt-3 skippr:flex skippr:flex-col-reverse" : "skippr:bottom-full skippr:mb-3 skippr:flex skippr:flex-col", position === "right" ? "skippr:right-0 skippr:items-end" : "skippr:left-0 skippr:items-start"),
3152
3365
  children: [
3153
- visibleGoals.map((goal, index2) => /* @__PURE__ */ jsx4(AdoptionBubble, {
3366
+ visibleGoals.map((goal, index2) => /* @__PURE__ */ jsx5(AdoptionBubble, {
3154
3367
  goal,
3155
3368
  onAttend: (attended) => {
3156
3369
  if (!wasDraggedRef.current)
@@ -3160,7 +3373,7 @@ function MinimizedBubble({
3160
3373
  exitDelayMs: (visibleGoals.length - 1 - index2) * GOAL_EXIT_STAGGER_MS,
3161
3374
  hidden: goalsHidden
3162
3375
  }, goal.goalId)),
3163
- modulePills.map((module) => /* @__PURE__ */ jsx4(ModulePill, {
3376
+ modulePills.map((module) => /* @__PURE__ */ jsx5(ModulePill, {
3164
3377
  module,
3165
3378
  onSelect: (id) => {
3166
3379
  if (!wasDraggedRef.current)
@@ -3169,7 +3382,7 @@ function MinimizedBubble({
3169
3382
  }, module.id))
3170
3383
  ]
3171
3384
  }),
3172
- welcomeMessage && !welcomeDismissed && adoptionGoals.length === 0 && modulePills.length === 0 && /* @__PURE__ */ jsx4(WelcomeBubble, {
3385
+ welcomeMessage && !welcomeDismissed && adoptionGoals.length === 0 && modulePills.length === 0 && /* @__PURE__ */ jsx5(WelcomeBubble, {
3173
3386
  message: welcomeMessage,
3174
3387
  position,
3175
3388
  popsDown,
@@ -3179,9 +3392,11 @@ function MinimizedBubble({
3179
3392
  onDismissWelcome();
3180
3393
  }
3181
3394
  }),
3182
- /* @__PURE__ */ jsx4(IdleLauncher, {
3395
+ /* @__PURE__ */ jsx5(IdleLauncher, {
3183
3396
  position,
3184
- onClick: launchDefaultSession
3397
+ isHovered: isLauncherHovered,
3398
+ onStart: launchDefaultSession,
3399
+ onChat: openChat
3185
3400
  })
3186
3401
  ]
3187
3402
  });
@@ -3189,7 +3404,7 @@ function MinimizedBubble({
3189
3404
 
3190
3405
  // src/components/PageActionHandler.tsx
3191
3406
  import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
3192
- import { useCallback as useCallback7, useEffect as useEffect13, useRef as useRef8 } from "react";
3407
+ import { useCallback as useCallback8, useEffect as useEffect15, useRef as useRef8 } from "react";
3193
3408
  var STEP_MAX_WAIT_MS = 5000;
3194
3409
  var POST_ACTION_SETTLE_SNAPSHOT_MS = 300;
3195
3410
  var textDecoder2 = new TextDecoder;
@@ -3411,7 +3626,7 @@ function PageActionHandler() {
3411
3626
  const drainingRef = useRef8(false);
3412
3627
  const settleTimerRef = useRef8(null);
3413
3628
  const endStepRef = useRef8(null);
3414
- const runStep = useCallback7((action) => {
3629
+ const runStep = useCallback8((action) => {
3415
3630
  return new Promise((resolve) => {
3416
3631
  if (action.type === "scroll_page") {
3417
3632
  let scrolled = false;
@@ -3480,7 +3695,7 @@ function PageActionHandler() {
3480
3695
  });
3481
3696
  });
3482
3697
  }, []);
3483
- const drain = useCallback7(async () => {
3698
+ const drain = useCallback8(async () => {
3484
3699
  if (drainingRef.current)
3485
3700
  return;
3486
3701
  drainingRef.current = true;
@@ -3511,14 +3726,14 @@ function PageActionHandler() {
3511
3726
  }
3512
3727
  }
3513
3728
  }, [runStep]);
3514
- const onMessage = useCallback7((msg) => {
3729
+ const onMessage = useCallback8((msg) => {
3515
3730
  const action = parsePageAction(msg.payload);
3516
3731
  if (!action)
3517
3732
  return;
3518
3733
  queueRef.current.push(action);
3519
3734
  drain();
3520
3735
  }, [drain]);
3521
- useEffect13(() => {
3736
+ useEffect15(() => {
3522
3737
  mountedRef.current = true;
3523
3738
  drainingRef.current = false;
3524
3739
  return () => {
@@ -3530,7 +3745,7 @@ function PageActionHandler() {
3530
3745
  setActionsBusy(false);
3531
3746
  };
3532
3747
  }, []);
3533
- useEffect13(() => {
3748
+ useEffect15(() => {
3534
3749
  return onActionsPausedChange((paused) => {
3535
3750
  if (paused) {
3536
3751
  clearCursorTarget("act");
@@ -3549,22 +3764,22 @@ function PageActionHandler() {
3549
3764
  import { useContext as useContext6, useEffect as useEffect18 } from "react";
3550
3765
 
3551
3766
  // src/hooks/useActionControl.ts
3552
- import { useLocalParticipant as useLocalParticipant3 } from "@livekit/components-react/hooks";
3553
- import { useCallback as useCallback8, useEffect as useEffect14, useState as useState9 } from "react";
3554
- var textEncoder3 = new TextEncoder;
3767
+ import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
3768
+ import { useCallback as useCallback9, useEffect as useEffect16, useState as useState11 } from "react";
3769
+ var textEncoder4 = new TextEncoder;
3555
3770
  function useActionControl() {
3556
- const { localParticipant } = useLocalParticipant3();
3771
+ const { localParticipant } = useLocalParticipant4();
3557
3772
  const plan = usePlanUpdates();
3558
- const [busy, setBusy] = useState9(isActionsBusy);
3559
- const [actionsPaused2, setPaused] = useState9(false);
3560
- useEffect14(() => subscribeActionsBusy(setBusy), []);
3773
+ const [busy, setBusy] = useState11(isActionsBusy);
3774
+ const [actionsPaused2, setPaused] = useState11(false);
3775
+ useEffect16(() => subscribeActionsBusy(setBusy), []);
3561
3776
  const actionsActive = busy || plan?.state === "executing";
3562
- const togglePaused = useCallback8(async () => {
3777
+ const togglePaused = useCallback9(async () => {
3563
3778
  const next = !actionsPaused2;
3564
3779
  setPaused(next);
3565
3780
  setActionsPaused(next);
3566
3781
  try {
3567
- await localParticipant.publishData(textEncoder3.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
3782
+ await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ type: next ? "pause" : "resume" })), { reliable: true, topic: ACTION_CONTROL_TOPIC });
3568
3783
  } catch (error) {
3569
3784
  console.error("Failed to send action pause/resume:", error);
3570
3785
  }
@@ -3585,13 +3800,13 @@ function useAgentVoiceState() {
3585
3800
  }
3586
3801
 
3587
3802
  // src/hooks/useAudioLevelBars.ts
3588
- import { useEffect as useEffect15, useRef as useRef9, useState as useState10 } from "react";
3803
+ import { useEffect as useEffect17, useRef as useRef9, useState as useState12 } from "react";
3589
3804
  var TALKING_LEVEL_THRESHOLD = 0.2;
3590
3805
  var TALKING_HOLD_MS = 400;
3591
3806
  function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowthPx, noiseGate }) {
3592
3807
  const barRefs = useRef9([]);
3593
- const [isTalking, setIsTalking] = useState10(false);
3594
- useEffect15(() => {
3808
+ const [isTalking, setIsTalking] = useState12(false);
3809
+ useEffect17(() => {
3595
3810
  if (!mediaStreamTrack) {
3596
3811
  for (const bar of barRefs.current) {
3597
3812
  if (bar)
@@ -3642,26 +3857,26 @@ function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowth
3642
3857
  }
3643
3858
 
3644
3859
  // src/hooks/useMediaControls.ts
3645
- import { useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
3860
+ import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
3646
3861
  import { ScreenSharePresets as ScreenSharePresets2 } from "livekit-client";
3647
- import { useCallback as useCallback9 } from "react";
3862
+ import { useCallback as useCallback10 } from "react";
3648
3863
  var SCREEN_SHARE_OPTIONS = {
3649
3864
  video: { displaySurface: "browser" },
3650
3865
  resolution: ScreenSharePresets2.h720fps30.resolution,
3651
3866
  contentHint: "detail"
3652
3867
  };
3653
3868
  function useMediaControls() {
3654
- const { localParticipant } = useLocalParticipant4();
3869
+ const { localParticipant } = useLocalParticipant5();
3655
3870
  const isMuted = !localParticipant.isMicrophoneEnabled;
3656
3871
  const isScreenSharing = localParticipant.isScreenShareEnabled;
3657
- const toggleMute = useCallback9(async () => {
3872
+ const toggleMute = useCallback10(async () => {
3658
3873
  try {
3659
3874
  await localParticipant.setMicrophoneEnabled(isMuted);
3660
3875
  } catch (error) {
3661
3876
  console.error("Failed to toggle microphone:", error);
3662
3877
  }
3663
3878
  }, [localParticipant, isMuted]);
3664
- const toggleScreenShare = useCallback9(async () => {
3879
+ const toggleScreenShare = useCallback10(async () => {
3665
3880
  try {
3666
3881
  await localParticipant.setScreenShareEnabled(!isScreenSharing, SCREEN_SHARE_OPTIONS);
3667
3882
  } catch (error) {
@@ -3672,13 +3887,13 @@ function useMediaControls() {
3672
3887
  }
3673
3888
 
3674
3889
  // src/hooks/useMicLevel.ts
3675
- import { useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
3890
+ import { useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
3676
3891
  var MIC_BARS = 5;
3677
3892
  var IDLE_BAR_HEIGHT_PX = 5;
3678
3893
  var MAX_BAR_GROWTH_PX = 17;
3679
3894
  var MIC_NOISE_GATE = 0.15;
3680
3895
  function useMicLevel(enabled) {
3681
- const { microphoneTrack } = useLocalParticipant5();
3896
+ const { microphoneTrack } = useLocalParticipant6();
3682
3897
  const mediaStreamTrack = microphoneTrack?.track?.mediaStreamTrack;
3683
3898
  return useAudioLevelBars(enabled ? mediaStreamTrack : undefined, {
3684
3899
  barCount: MIC_BARS,
@@ -3688,92 +3903,6 @@ function useMicLevel(enabled) {
3688
3903
  });
3689
3904
  }
3690
3905
 
3691
- // src/hooks/usePhaseUpdates.ts
3692
- import { useCallback as useCallback10, useContext as useContext5, useEffect as useEffect16 } from "react";
3693
- function parsePhases(json) {
3694
- try {
3695
- const data = JSON.parse(json);
3696
- if (data.type === "phase_update" && Array.isArray(data.phases)) {
3697
- return data.phases;
3698
- }
3699
- } catch {}
3700
- return null;
3701
- }
3702
- function usePhaseUpdates() {
3703
- const parse = useCallback10(parsePhases, []);
3704
- const livePhases = useAgentState("phases", parse, []);
3705
- const ctx = useContext5(LiveAgentContext);
3706
- useEffect16(() => {
3707
- if (livePhases.length > 0)
3708
- ctx?.setPhasesSnapshot(livePhases);
3709
- }, [livePhases, ctx?.setPhasesSnapshot]);
3710
- const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
3711
- return { phases };
3712
- }
3713
-
3714
- // src/hooks/useSessionHold.ts
3715
- import { useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
3716
- import { useCallback as useCallback11, useEffect as useEffect17, useState as useState11 } from "react";
3717
- var textEncoder4 = new TextEncoder;
3718
- var FALLBACK_PAUSE_TIMEOUT_SECONDS = 120;
3719
- function useSessionHold({
3720
- pauseSession,
3721
- pauseTimeoutSeconds
3722
- }) {
3723
- const { localParticipant } = useLocalParticipant6();
3724
- const timeoutSeconds = pauseTimeoutSeconds ?? FALLBACK_PAUSE_TIMEOUT_SECONDS;
3725
- const [isHeld, setIsHeld] = useState11(false);
3726
- const [countdown, setCountdown] = useState11(timeoutSeconds);
3727
- const publish = useCallback11(async (type) => {
3728
- await localParticipant.publishData(textEncoder4.encode(JSON.stringify({ type })), {
3729
- reliable: true,
3730
- topic: SESSION_HOLD_TOPIC
3731
- });
3732
- }, [localParticipant]);
3733
- const hold = useCallback11(async () => {
3734
- try {
3735
- await localParticipant.setMicrophoneEnabled(false);
3736
- await publish("pause");
3737
- setIsHeld(true);
3738
- } catch (error) {
3739
- console.error("Failed to hold session:", error);
3740
- }
3741
- }, [localParticipant, publish]);
3742
- const release = useCallback11(async () => {
3743
- try {
3744
- await localParticipant.setMicrophoneEnabled(true);
3745
- await publish("resume");
3746
- setIsHeld(false);
3747
- } catch (error) {
3748
- console.error("Failed to release session:", error);
3749
- }
3750
- }, [localParticipant, publish]);
3751
- useEffect17(() => {
3752
- if (!isHeld) {
3753
- setCountdown(timeoutSeconds);
3754
- return;
3755
- }
3756
- const id = setInterval(() => {
3757
- setCountdown((seconds) => Math.max(0, seconds - 1));
3758
- }, 1000);
3759
- return () => clearInterval(id);
3760
- }, [isHeld, timeoutSeconds]);
3761
- useEffect17(() => {
3762
- if (isHeld && countdown === 0) {
3763
- setIsHeld(false);
3764
- pauseSession();
3765
- }
3766
- }, [isHeld, countdown, pauseSession]);
3767
- const toggle = useCallback11(() => {
3768
- if (isHeld) {
3769
- release();
3770
- } else {
3771
- hold();
3772
- }
3773
- }, [isHeld, hold, release]);
3774
- return { isHeld, countdown, toggle };
3775
- }
3776
-
3777
3906
  // src/components/PausedCountdown.tsx
3778
3907
  import { jsxs as jsxs5 } from "react/jsx-runtime";
3779
3908
  function PausedCountdown({ secondsRemaining }) {
@@ -3798,10 +3927,10 @@ function PausedCountdown({ secondsRemaining }) {
3798
3927
  }
3799
3928
 
3800
3929
  // src/components/SessionControlBar.tsx
3801
- import { jsx as jsx5, jsxs as jsxs6, Fragment } from "react/jsx-runtime";
3930
+ import { jsx as jsx6, jsxs as jsxs6, Fragment } from "react/jsx-runtime";
3802
3931
  var STANDBY_BAR_WIDTH = 168;
3803
3932
  var READY_BAR_WIDTH = 238;
3804
- var PAUSED_BAR_WIDTH = 200;
3933
+ var PAUSED_BAR_WIDTH = 248;
3805
3934
  var TEXT_BAR_WIDTH = 100;
3806
3935
  var SCREEN_SHARE_EXTRA_WIDTH = 46;
3807
3936
  var ACTION_CONTROL_EXTRA_WIDTH = 46;
@@ -3836,16 +3965,16 @@ function AgentActivity({
3836
3965
  className: "skippr:flex skippr:items-center skippr:gap-1.5 skippr:text-bubble",
3837
3966
  "aria-label": isActing ? "Agent is acting" : `Agent is ${state}`,
3838
3967
  children: [
3839
- /* @__PURE__ */ jsx5("span", {
3968
+ /* @__PURE__ */ jsx6("span", {
3840
3969
  className: "skippr:flex skippr:size-5 skippr:shrink-0 skippr:items-center skippr:justify-center",
3841
- children: isActing ? /* @__PURE__ */ jsx5(MousePointerClick, {
3970
+ children: isActing ? /* @__PURE__ */ jsx6(MousePointerClick, {
3842
3971
  strokeWidth: 2,
3843
3972
  className: "skippr:size-5 skippr:[animation:skippr-finger-tap_1.1s_ease-in-out_infinite]"
3844
3973
  }) : /* @__PURE__ */ jsxs6(Fragment, {
3845
3974
  children: [
3846
- state === "speaking" && /* @__PURE__ */ jsx5("span", {
3975
+ state === "speaking" && /* @__PURE__ */ jsx6("span", {
3847
3976
  className: "skippr:flex skippr:h-5 skippr:items-center skippr:gap-[2px]",
3848
- children: Array.from({ length: AGENT_BARS }).map((_, index2) => /* @__PURE__ */ jsx5("span", {
3977
+ children: Array.from({ length: AGENT_BARS }).map((_, index2) => /* @__PURE__ */ jsx6("span", {
3849
3978
  ref: (el) => {
3850
3979
  barRefs.current[index2] = el;
3851
3980
  },
@@ -3856,13 +3985,13 @@ function AgentActivity({
3856
3985
  state === "thinking" && /* @__PURE__ */ jsxs6("span", {
3857
3986
  className: "skippr:flex skippr:items-center skippr:gap-[3px]",
3858
3987
  children: [
3859
- /* @__PURE__ */ jsx5("span", {
3988
+ /* @__PURE__ */ jsx6("span", {
3860
3989
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:0ms]"
3861
3990
  }),
3862
- /* @__PURE__ */ jsx5("span", {
3991
+ /* @__PURE__ */ jsx6("span", {
3863
3992
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:150ms]"
3864
3993
  }),
3865
- /* @__PURE__ */ jsx5("span", {
3994
+ /* @__PURE__ */ jsx6("span", {
3866
3995
  className: "skippr:size-[5px] skippr:rounded-full skippr:bg-current skippr:animate-bounce skippr:[animation-delay:300ms]"
3867
3996
  })
3868
3997
  ]
@@ -3877,10 +4006,10 @@ function AgentActivity({
3877
4006
  strokeLinejoin: "round",
3878
4007
  "aria-hidden": "true",
3879
4008
  children: [
3880
- /* @__PURE__ */ jsx5("path", {
4009
+ /* @__PURE__ */ jsx6("path", {
3881
4010
  d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"
3882
4011
  }),
3883
- /* @__PURE__ */ jsx5("circle", {
4012
+ /* @__PURE__ */ jsx6("circle", {
3884
4013
  cx: "12",
3885
4014
  cy: "12",
3886
4015
  r: "2.5",
@@ -3893,7 +4022,7 @@ function AgentActivity({
3893
4022
  ]
3894
4023
  })
3895
4024
  }),
3896
- /* @__PURE__ */ jsx5("span", {
4025
+ /* @__PURE__ */ jsx6("span", {
3897
4026
  className: "skippr:text-[11px] skippr:font-medium skippr:capitalize",
3898
4027
  children: label
3899
4028
  })
@@ -3920,11 +4049,9 @@ function SessionControlBar() {
3920
4049
  const {
3921
4050
  textMode,
3922
4051
  launcherBottomPx,
3923
- popsDown,
3924
4052
  controlBarRef,
3925
4053
  commitLauncherDrop,
3926
4054
  panelRef,
3927
- pauseTimeoutSeconds,
3928
4055
  isDragging,
3929
4056
  setIsDragging
3930
4057
  } = internalCtx;
@@ -3933,16 +4060,8 @@ function SessionControlBar() {
3933
4060
  const { wasDraggedRef } = useLauncherDrag(controlBarRef, commitLauncherDrop, panelFollowers, setIsDragging);
3934
4061
  const { isMuted, toggleMute, isScreenSharing, toggleScreenShare } = useMediaControls();
3935
4062
  const { state, mediaStreamTrack: agentMediaStreamTrack } = useAgentVoiceState();
3936
- const { phases } = usePhaseUpdates();
3937
4063
  const { actionsActive, actionsPaused: actionsPaused2, togglePaused } = useActionControl();
3938
- const {
3939
- isHeld,
3940
- countdown,
3941
- toggle: togglePause
3942
- } = useSessionHold({
3943
- pauseSession,
3944
- pauseTimeoutSeconds
3945
- });
4064
+ const { isHeld, countdown, toggle: togglePause } = useSessionHoldContext();
3946
4065
  useEffect18(() => {
3947
4066
  if (isHeld)
3948
4067
  minimizePanel();
@@ -3964,18 +4083,6 @@ function SessionControlBar() {
3964
4083
  }
3965
4084
  }
3966
4085
  const agendaModule = activeModule && activeModule.mode !== AGENT_MODE.AlwaysOn && activeModule.totalPhases > 0 ? activeModule : null;
3967
- const agendaProgress = phases.length > 0 ? {
3968
- completed: phases.filter((phase) => phase.status === "completed").length,
3969
- total: phases.length
3970
- } : agendaModule ? {
3971
- completed: agendaModule.currentSession?.currentPhaseIndex ?? 0,
3972
- total: agendaModule.totalPhases
3973
- } : null;
3974
- const currentPhaseName = phases.find((phase) => phase.status === "active")?.name ?? phases.find((phase) => phase.status === "pending")?.name;
3975
- const openAgenda = () => {
3976
- setSidebarTab("agenda");
3977
- expandPanel();
3978
- };
3979
4086
  const togglePanel = () => {
3980
4087
  if (isPanelOpen) {
3981
4088
  minimizePanel();
@@ -3989,21 +4096,20 @@ function SessionControlBar() {
3989
4096
  return;
3990
4097
  action();
3991
4098
  };
4099
+ const panelToggleButton = /* @__PURE__ */ jsx6("button", {
4100
+ type: "button",
4101
+ onClick: ifNotDragged(togglePanel),
4102
+ "aria-label": isPanelOpen ? "Close panel" : agendaModule && !textMode ? "Open agenda" : "Open chat",
4103
+ className: cn(SQUARE_BUTTON, "skippr:text-neutral-700", textMode ? "skippr:hover:bg-neutral-100" : "skippr:bg-neutral-100 skippr:hover:bg-neutral-200"),
4104
+ children: /* @__PURE__ */ jsx6(MessageSquare, {
4105
+ className: "skippr:size-5"
4106
+ })
4107
+ });
3992
4108
  return /* @__PURE__ */ jsxs6("div", {
3993
4109
  ref: controlBarRef,
3994
4110
  style: { bottom: launcherBottomPx },
3995
4111
  className: cn("skippr:fixed skippr:z-[9999] skippr:touch-none skippr:cursor-grab", position === "right" ? "skippr:right-3" : "skippr:left-3"),
3996
4112
  children: [
3997
- !isPanelOpen && agendaModule && agendaProgress && /* @__PURE__ */ jsx5("div", {
3998
- className: cn("skippr:absolute", popsDown ? "skippr:top-full skippr:mt-3" : "skippr:bottom-full skippr:mb-3", isReady ? position === "right" ? "skippr:right-7" : "skippr:left-7" : position === "right" ? "skippr:right-0" : "skippr:left-0"),
3999
- children: /* @__PURE__ */ jsx5(ModulePill, {
4000
- module: agendaModule,
4001
- onSelect: ifNotDragged(openAgenda),
4002
- progress: agendaProgress,
4003
- label: currentPhaseName ?? agendaModule.name,
4004
- isLive: true
4005
- })
4006
- }),
4007
4113
  /* @__PURE__ */ jsxs6("div", {
4008
4114
  style: { width: barWidth },
4009
4115
  className: cn("skippr:group skippr:relative skippr:flex skippr:h-[54px] skippr:items-center skippr:justify-center skippr:gap-2", "skippr:rounded-[20px] skippr:bg-white skippr:p-2", "skippr:shadow-[0_10px_32px_rgba(0,0,0,0.18)] skippr:ring-1 skippr:ring-black/5", "skippr:transition-[width,margin] skippr:duration-300 skippr:ease-out", "skippr:[animation:skippr-toolset-pop_440ms_cubic-bezier(0.22,1,0.36,1)]", isReady && (position === "right" ? "skippr:mr-7" : "skippr:ml-7")),
@@ -4014,18 +4120,18 @@ function SessionControlBar() {
4014
4120
  /* @__PURE__ */ jsxs6("span", {
4015
4121
  className: "skippr:flex skippr:items-center skippr:gap-[3px]",
4016
4122
  children: [
4017
- /* @__PURE__ */ jsx5("span", {
4123
+ /* @__PURE__ */ jsx6("span", {
4018
4124
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:0ms]"
4019
4125
  }),
4020
- /* @__PURE__ */ jsx5("span", {
4126
+ /* @__PURE__ */ jsx6("span", {
4021
4127
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:150ms]"
4022
4128
  }),
4023
- /* @__PURE__ */ jsx5("span", {
4129
+ /* @__PURE__ */ jsx6("span", {
4024
4130
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-bubble skippr:animate-bounce skippr:[animation-delay:300ms]"
4025
4131
  })
4026
4132
  ]
4027
4133
  }),
4028
- /* @__PURE__ */ jsx5("span", {
4134
+ /* @__PURE__ */ jsx6("span", {
4029
4135
  children: "Standing by…"
4030
4136
  })
4031
4137
  ]
@@ -4033,32 +4139,37 @@ function SessionControlBar() {
4033
4139
  isReady && /* @__PURE__ */ jsxs6("div", {
4034
4140
  className: cn("skippr:flex skippr:items-center skippr:gap-2 skippr:[animation:skippr-stage-fade_240ms_ease-out]", isHeld && "skippr:w-full skippr:justify-start"),
4035
4141
  children: [
4036
- /* @__PURE__ */ jsx5("button", {
4142
+ /* @__PURE__ */ jsx6("button", {
4037
4143
  type: "button",
4038
4144
  onClick: ifNotDragged(togglePause),
4039
4145
  "aria-label": isHeld ? "Resume" : "Pause",
4040
4146
  title: isHeld ? "Resume" : "Pause",
4041
4147
  className: cn(SQUARE_BUTTON, isHeld ? "skippr:bg-bubble skippr:text-white skippr:hover:bg-[#3a384b]" : "skippr:bg-neutral-100 skippr:text-neutral-700 skippr:hover:bg-neutral-200"),
4042
- children: isHeld ? /* @__PURE__ */ jsx5(Play, {
4148
+ children: isHeld ? /* @__PURE__ */ jsx6(Play, {
4043
4149
  className: "skippr:size-5",
4044
4150
  fill: "currentColor"
4045
- }) : /* @__PURE__ */ jsx5(Pause, {
4151
+ }) : /* @__PURE__ */ jsx6(Pause, {
4046
4152
  className: "skippr:size-5",
4047
4153
  fill: "currentColor"
4048
4154
  })
4049
4155
  }),
4050
- isHeld ? /* @__PURE__ */ jsx5(PausedCountdown, {
4051
- secondsRemaining: countdown
4156
+ isHeld ? /* @__PURE__ */ jsxs6(Fragment, {
4157
+ children: [
4158
+ /* @__PURE__ */ jsx6(PausedCountdown, {
4159
+ secondsRemaining: countdown
4160
+ }),
4161
+ panelToggleButton
4162
+ ]
4052
4163
  }) : /* @__PURE__ */ jsxs6(Fragment, {
4053
4164
  children: [
4054
4165
  !textMode && /* @__PURE__ */ jsxs6("div", {
4055
4166
  className: "skippr:relative skippr:h-[38px]",
4056
4167
  style: { width: MIC_REGION_WIDTH },
4057
4168
  children: [
4058
- !isTalking && /* @__PURE__ */ jsx5("span", {
4169
+ !isTalking && /* @__PURE__ */ jsx6("span", {
4059
4170
  className: "skippr:absolute skippr:inset-y-0 skippr:right-0 skippr:flex skippr:items-center skippr:justify-center skippr:[animation:skippr-agent-in_200ms_ease-out_240ms_both]",
4060
4171
  style: { width: AGENT_ACTIVITY_WIDTH },
4061
- children: /* @__PURE__ */ jsx5(AgentActivity, {
4172
+ children: /* @__PURE__ */ jsx6(AgentActivity, {
4062
4173
  state,
4063
4174
  isActing: showActionControl && !actionsPaused2,
4064
4175
  mediaStreamTrack: agentMediaStreamTrack
@@ -4071,17 +4182,17 @@ function SessionControlBar() {
4071
4182
  className: cn("skippr:group skippr:absolute skippr:top-0 skippr:left-0 skippr:z-10 skippr:flex skippr:h-[38px] skippr:items-center skippr:gap-2.5 skippr:overflow-hidden skippr:rounded-[12px] skippr:bg-bubble skippr:text-white skippr:cursor-pointer skippr:transition-[width] skippr:duration-300 skippr:ease-out", isTalking ? "skippr:justify-start skippr:pl-3.5" : "skippr:justify-center"),
4072
4183
  style: { width: isTalking ? MIC_REGION_WIDTH : MIC_SQUARE_WIDTH },
4073
4184
  children: [
4074
- /* @__PURE__ */ jsx5("span", {
4185
+ /* @__PURE__ */ jsx6("span", {
4075
4186
  className: cn("skippr:flex skippr:shrink-0 skippr:items-center skippr:justify-center skippr:transition-colors", isMuted ? "skippr:text-red-400 skippr:group-hover:text-red-300" : "skippr:text-white skippr:group-hover:text-white/80"),
4076
- children: isMuted ? /* @__PURE__ */ jsx5(MicOff, {
4187
+ children: isMuted ? /* @__PURE__ */ jsx6(MicOff, {
4077
4188
  className: "skippr:size-5"
4078
- }) : /* @__PURE__ */ jsx5(Mic, {
4189
+ }) : /* @__PURE__ */ jsx6(Mic, {
4079
4190
  className: "skippr:size-5"
4080
4191
  })
4081
4192
  }),
4082
- /* @__PURE__ */ jsx5("span", {
4193
+ /* @__PURE__ */ jsx6("span", {
4083
4194
  className: cn("skippr:h-6 skippr:flex-1 skippr:items-center skippr:justify-center skippr:gap-[3px] skippr:transition-opacity skippr:duration-200", isTalking ? "skippr:flex skippr:opacity-100" : "skippr:hidden"),
4084
- children: Array.from({ length: MIC_BARS }).map((_, index2) => /* @__PURE__ */ jsx5("span", {
4195
+ children: Array.from({ length: MIC_BARS }).map((_, index2) => /* @__PURE__ */ jsx6("span", {
4085
4196
  ref: (el) => {
4086
4197
  barRefs.current[index2] = el;
4087
4198
  },
@@ -4093,36 +4204,28 @@ function SessionControlBar() {
4093
4204
  })
4094
4205
  ]
4095
4206
  }),
4096
- showScreenShareToggle && /* @__PURE__ */ jsx5("button", {
4207
+ showScreenShareToggle && /* @__PURE__ */ jsx6("button", {
4097
4208
  type: "button",
4098
4209
  onClick: ifNotDragged(() => void toggleScreenShare()),
4099
4210
  "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
4100
4211
  className: cn(SQUARE_BUTTON, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:bg-[#3a384b]" : "skippr:bg-neutral-100 skippr:text-neutral-700 skippr:hover:bg-neutral-200"),
4101
- children: isScreenSharing ? /* @__PURE__ */ jsx5(MonitorOff, {
4212
+ children: isScreenSharing ? /* @__PURE__ */ jsx6(MonitorOff, {
4102
4213
  className: "skippr:size-5"
4103
- }) : /* @__PURE__ */ jsx5(Monitor, {
4104
- className: "skippr:size-5"
4105
- })
4106
- }),
4107
- /* @__PURE__ */ jsx5("button", {
4108
- type: "button",
4109
- onClick: ifNotDragged(togglePanel),
4110
- "aria-label": isPanelOpen ? "Close panel" : agendaModule && !textMode ? "Open agenda" : "Open chat",
4111
- className: cn(SQUARE_BUTTON, "skippr:text-neutral-700", textMode ? "skippr:hover:bg-neutral-100" : "skippr:bg-neutral-100 skippr:hover:bg-neutral-200"),
4112
- children: /* @__PURE__ */ jsx5(MessageSquare, {
4214
+ }) : /* @__PURE__ */ jsx6(Monitor, {
4113
4215
  className: "skippr:size-5"
4114
4216
  })
4115
4217
  }),
4116
- showActionControl && /* @__PURE__ */ jsx5("button", {
4218
+ panelToggleButton,
4219
+ showActionControl && /* @__PURE__ */ jsx6("button", {
4117
4220
  type: "button",
4118
4221
  onClick: ifNotDragged(() => void togglePaused()),
4119
4222
  "aria-label": actionsPaused2 ? "Resume actions" : "Stop actions",
4120
4223
  title: actionsPaused2 ? "Resume" : "Stop",
4121
4224
  className: cn(SQUARE_BUTTON, actionsPaused2 ? "skippr:bg-green-100 skippr:text-green-700 skippr:hover:bg-green-200" : "skippr:bg-red-100 skippr:text-red-600 skippr:hover:bg-red-200"),
4122
- children: actionsPaused2 ? /* @__PURE__ */ jsx5(Play, {
4225
+ children: actionsPaused2 ? /* @__PURE__ */ jsx6(Play, {
4123
4226
  className: "skippr:size-5",
4124
4227
  fill: "currentColor"
4125
- }) : /* @__PURE__ */ jsx5(Square, {
4228
+ }) : /* @__PURE__ */ jsx6(Square, {
4126
4229
  className: "skippr:size-5",
4127
4230
  fill: "currentColor"
4128
4231
  })
@@ -4133,7 +4236,7 @@ function SessionControlBar() {
4133
4236
  }, textMode ? "ready-text" : "ready")
4134
4237
  ]
4135
4238
  }),
4136
- isReady && !isDragging && /* @__PURE__ */ jsx5("button", {
4239
+ isReady && !isDragging && /* @__PURE__ */ jsx6("button", {
4137
4240
  type: "button",
4138
4241
  onClick: ifNotDragged(() => void pauseSession()),
4139
4242
  disabled: isPausing,
@@ -4143,7 +4246,7 @@ function SessionControlBar() {
4143
4246
  children: /* @__PURE__ */ jsxs6("span", {
4144
4247
  className: "skippr:relative skippr:flex skippr:size-5 skippr:items-center skippr:justify-center",
4145
4248
  children: [
4146
- /* @__PURE__ */ jsx5(X, {
4249
+ /* @__PURE__ */ jsx6(X, {
4147
4250
  className: cn("skippr:size-4 skippr:transition-opacity skippr:duration-200", isPausing && "skippr:opacity-40"),
4148
4251
  strokeWidth: 2.5
4149
4252
  }),
@@ -4153,7 +4256,7 @@ function SessionControlBar() {
4153
4256
  "aria-hidden": "true",
4154
4257
  className: "skippr:absolute skippr:inset-0 skippr:size-full skippr:animate-spin skippr:motion-reduce:hidden",
4155
4258
  children: [
4156
- /* @__PURE__ */ jsx5("circle", {
4259
+ /* @__PURE__ */ jsx6("circle", {
4157
4260
  cx: "12",
4158
4261
  cy: "12",
4159
4262
  r: "10.5",
@@ -4161,7 +4264,7 @@ function SessionControlBar() {
4161
4264
  strokeOpacity: "0.2",
4162
4265
  strokeWidth: "1.5"
4163
4266
  }),
4164
- /* @__PURE__ */ jsx5("circle", {
4267
+ /* @__PURE__ */ jsx6("circle", {
4165
4268
  cx: "12",
4166
4269
  cy: "12",
4167
4270
  r: "10.5",
@@ -4180,9 +4283,9 @@ function SessionControlBar() {
4180
4283
  }
4181
4284
 
4182
4285
  // src/components/ShadowHost.tsx
4183
- import { useLayoutEffect as useLayoutEffect2, useRef as useRef10, useState as useState12 } from "react";
4286
+ import { useLayoutEffect as useLayoutEffect2, useRef as useRef10, useState as useState13 } from "react";
4184
4287
  import { createPortal } from "react-dom";
4185
- import { jsx as jsx6, Fragment as Fragment2 } from "react/jsx-runtime";
4288
+ import { jsx as jsx7, Fragment as Fragment2 } from "react/jsx-runtime";
4186
4289
  var PROPERTIES_STYLE_ID = "skippr-tw-properties";
4187
4290
  var PROPERTY_RULE = /@property\s+[^{]+\{[^}]*\}/g;
4188
4291
  function hoistTailwindProperties(css) {
@@ -4198,9 +4301,9 @@ function hoistTailwindProperties(css) {
4198
4301
  }
4199
4302
  function ShadowHost({ children }) {
4200
4303
  const hostRef = useRef10(null);
4201
- const [shadowRoot, setShadowRoot] = useState12(null);
4304
+ const [shadowRoot, setShadowRoot] = useState13(null);
4202
4305
  const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
4203
- @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-100:oklch(93.6% .032 17.717);--skippr-color-red-200:oklch(88.5% .062 18.334);--skippr-color-red-300:oklch(80.8% .114 19.571);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-500:oklch(63.7% .237 25.331);--skippr-color-red-600:oklch(57.7% .245 27.325);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-50:oklch(98.7% .022 95.277);--skippr-color-amber-100:oklch(96.2% .059 95.617);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-amber-700:oklch(55.5% .163 48.998);--skippr-color-amber-950:oklch(27.9% .077 45.635);--skippr-color-green-100:oklch(96.2% .044 156.743);--skippr-color-green-200:oklch(92.5% .084 155.995);--skippr-color-green-700:oklch(52.7% .154 150.069);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-emerald-500:oklch(69.6% .17 162.48);--skippr-color-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-500:oklch(55.6% 0 0);--skippr-color-neutral-700:oklch(37.1% 0 0);--skippr-color-black:#000;--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-leading-tight:1.25;--skippr-leading-snug:1.375;--skippr-leading-relaxed:1.625;--skippr-ease-out:cubic-bezier(0,0,.2,1);--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--skippr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:inset-y-0{inset-block:calc(var(--skippr-spacing)*0)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-8{right:calc(var(--skippr-spacing)*-8)}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:right-7{right:calc(var(--skippr-spacing)*7)}.skippr\\:right-\\[24px\\]{right:24px}.skippr\\:-bottom-1{bottom:calc(var(--skippr-spacing)*-1)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-3{bottom:calc(var(--skippr-spacing)*3)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:-left-8{left:calc(var(--skippr-spacing)*-8)}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:left-7{left:calc(var(--skippr-spacing)*7)}.skippr\\:left-\\[24px\\]{left:24px}.skippr\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:-mt-\\[27px\\]{margin-top:-27px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mt-3\\.5{margin-top:calc(var(--skippr-spacing)*3.5)}.skippr\\:mr-7{margin-right:calc(var(--skippr-spacing)*7)}.skippr\\:-mb-\\[5px\\]{margin-bottom:-5px}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:ml-0\\.5{margin-left:calc(var(--skippr-spacing)*.5)}.skippr\\:ml-1{margin-left:calc(var(--skippr-spacing)*1)}.skippr\\:ml-7{margin-left:calc(var(--skippr-spacing)*7)}.skippr\\:flex{display:flex}.skippr\\:hidden{display:none}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3{width:calc(var(--skippr-spacing)*3);height:calc(var(--skippr-spacing)*3)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-\\[5px\\]{width:5px;height:5px}.skippr\\:size-\\[6px\\]{width:6px;height:6px}.skippr\\:size-\\[38px\\]{width:38px;height:38px}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-3{height:calc(var(--skippr-spacing)*3)}.skippr\\:h-3\\.5{height:calc(var(--skippr-spacing)*3.5)}.skippr\\:h-4{height:calc(var(--skippr-spacing)*4)}.skippr\\:h-5{height:calc(var(--skippr-spacing)*5)}.skippr\\:h-6{height:calc(var(--skippr-spacing)*6)}.skippr\\:h-7{height:calc(var(--skippr-spacing)*7)}.skippr\\:h-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[38px\\]{height:38px}.skippr\\:h-\\[50px\\]{height:50px}.skippr\\:h-\\[54px\\]{height:54px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:min-h-11{min-height:calc(var(--skippr-spacing)*11)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-6{width:calc(var(--skippr-spacing)*6)}.skippr\\:w-7{width:calc(var(--skippr-spacing)*7)}.skippr\\:w-8{width:calc(var(--skippr-spacing)*8)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-40{width:calc(var(--skippr-spacing)*40)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-\\[3px\\]{width:3px}.skippr\\:w-\\[15\\.4px\\]{width:15.4px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:min-w-11{min-width:calc(var(--skippr-spacing)*11)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:origin-left{transform-origin:0}.skippr\\:origin-right{transform-origin:100%}.skippr\\:origin-top-left{transform-origin:0 0}.skippr\\:origin-top-right{transform-origin:100% 0}.skippr\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*-7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:scale-0{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out_240ms_both\\]{animation:.2s ease-out .24s both skippr-agent-in}.skippr\\:\\[animation\\:skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:\\[animation\\:skippr-finger-tap_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-finger-tap}.skippr\\:\\[animation\\:skippr-orb-in_320ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)\\]{animation:.32s cubic-bezier(.34,1.3,.64,1) skippr-orb-in}.skippr\\:\\[animation\\:skippr-stage-fade_240ms_ease-out\\]{animation:.24s ease-out skippr-stage-fade}.skippr\\:\\[animation\\:skippr-tip-in_360ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)_backwards\\]{animation:.36s cubic-bezier(.34,1.3,.64,1) backwards skippr-tip-in}.skippr\\:\\[animation\\:skippr-toolset-pop_280ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.28s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:\\[animation\\:skippr-toolset-pop_440ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.44s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-pulse{animation:var(--skippr-animate-pulse)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-click-ping{animation:.5s ease-out forwards skippr-click-ping}.skippr\\:animate-skippr-cursor-pop{animation:.22s ease-out skippr-cursor-pop}.skippr\\:animate-skippr-press{animation:.5s ease-in-out skippr-press}.skippr\\:animate-skippr-tab-fade{animation:.2s ease-out skippr-tab-fade}.skippr\\:animate-skippr-thinking-dot{animation:1.2s ease-in-out infinite skippr-thinking-dot}.skippr\\:animate-spin{animation:var(--skippr-animate-spin)}.skippr\\:cursor-default{cursor:default}.skippr\\:cursor-grab{cursor:grab}.skippr\\:cursor-pointer{cursor:pointer}.skippr\\:touch-none{touch-action:none}.skippr\\:resize-none{resize:none}.skippr\\:flex-col{flex-direction:column}.skippr\\:flex-col-reverse{flex-direction:column-reverse}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:justify-start{justify-content:flex-start}.skippr\\:gap-0\\.5{gap:calc(var(--skippr-spacing)*.5)}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[12px\\]{border-radius:12px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-\\[16px\\]{border-radius:16px}.skippr\\:rounded-\\[20px\\]{border-radius:20px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:rounded-tl-md{border-top-left-radius:.5rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-\\[\\#2bc0ae\\]{border-color:#2bc0ae}.skippr\\:border-border,.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:oklab(29.9244% .0107414 -.0305411/.2)}.skippr\\:border-r-border{border-right-color:oklch(92.3% .003 48.717)}.skippr\\:border-l-border{border-left-color:oklch(92.3% .003 48.717)}.skippr\\:bg-\\[\\#2bc0ae\\]{background-color:#2bc0ae}.skippr\\:bg-\\[\\#2bc0ae\\]\\/50{background-color:oklab(72.9347% -.121518 -.00545585/.5)}.skippr\\:bg-amber-50{background-color:var(--skippr-color-amber-50)}.skippr\\:bg-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:color-mix(in oklab,var(--skippr-color-black)7.0%,transparent)}}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/95{background-color:oklab(29.9244% .0107414 -.0305411/.95)}.skippr\\:bg-card{background-color:oklch(100% 0 0)}.skippr\\:bg-current{background-color:currentColor}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-emerald-500{background-color:var(--skippr-color-emerald-500)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-green-100{background-color:var(--skippr-color-green-100)}.skippr\\:bg-launcher{background-color:#2d2d3f}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-neutral-100{background-color:var(--skippr-color-neutral-100)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-100{background-color:var(--skippr-color-red-100)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-red-500{background-color:var(--skippr-color-red-500)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white,.skippr\\:bg-white\\/15{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/15{background-color:color-mix(in oklab,var(--skippr-color-white)15%,transparent)}}.skippr\\:fill-brand{fill:#2bc0ae}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:stroke-black\\/15{stroke:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:stroke-black\\/15{stroke:color-mix(in oklab,var(--skippr-color-black)15%,transparent)}}.skippr\\:stroke-bubble{stroke:#2d2b3d}.skippr\\:p-0\\.5{padding:calc(var(--skippr-spacing)*.5)}.skippr\\:p-1\\.5{padding:calc(var(--skippr-spacing)*1.5)}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-3\\.5{padding:calc(var(--skippr-spacing)*3.5)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:pt-1\\.5{padding-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:pr-2\\.5{padding-right:calc(var(--skippr-spacing)*2.5)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-2\\.5{padding-left:calc(var(--skippr-spacing)*2.5)}.skippr\\:pl-3\\.5{padding-left:calc(var(--skippr-spacing)*3.5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:text-\\[13px\\]{font-size:13px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-snug{--tw-leading:var(--skippr-leading-snug);line-height:var(--skippr-leading-snug)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-\\[\\#2bc0ae\\]{color:#2bc0ae}.skippr\\:text-amber-700{color:var(--skippr-color-amber-700)}.skippr\\:text-amber-950{color:var(--skippr-color-amber-950)}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-black{color:var(--skippr-color-black)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-green-700{color:var(--skippr-color-green-700)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-neutral-500{color:var(--skippr-color-neutral-500)}.skippr\\:text-neutral-700{color:var(--skippr-color-neutral-700)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-400{color:var(--skippr-color-red-400)}.skippr\\:text-red-600{color:var(--skippr-color-red-600)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:capitalize{text-transform:capitalize}.skippr\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-40{opacity:.4}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[-6px_6px_22px_rgba\\(0\\,0\\,0\\,0\\.3\\)\\]{--tw-shadow:-6px 6px 22px var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_14px_rgba\\(239\\,68\\,68\\,0\\.45\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#ef444473);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_10px_32px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 10px 32px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-black\\/5{--tw-ring-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--skippr-color-black)5%,transparent)}}.skippr\\:ring-brand{--tw-ring-color:#2bc0ae}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-white\\/30{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/30{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)30%,transparent)}}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_2px_5px_rgba\\(0\\,0\\,0\\,0\\.4\\)\\]{--tw-drop-shadow-size:drop-shadow(0 2px 5px var(--tw-drop-shadow-color,#0006));--tw-drop-shadow:var(--tw-drop-shadow-size);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.skippr\\:backdrop-blur-sm{--tw-backdrop-blur:blur(var(--skippr-blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.skippr\\:transition-\\[height\\]{transition-property:height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[opacity\\,transform\\,height\\]{transition-property:opacity,transform,height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\,margin\\]{transition-property:width,margin;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-75{--tw-duration:75ms;transition-duration:75ms}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:ease-out{--tw-ease:var(--skippr-ease-out);transition-timing-function:var(--skippr-ease-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:select-none{-webkit-user-select:none;user-select:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\:\\[overflow-anchor\\:none\\]{overflow-anchor:none}.skippr\\:group-focus-within\\:scale-100:is(:where(.skippr\\:group):focus-within *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-focus-within\\:opacity-100:is(:where(.skippr\\:group):focus-within *){opacity:1}@media (hover:hover){.skippr\\:group-hover\\:scale-100:is(:where(.skippr\\:group):hover *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-hover\\:text-red-300:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-red-300)}.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:color-mix(in oklab,var(--skippr-color-white)80%,transparent)}}.skippr\\:group-hover\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:hover\\:bg-\\[\\#3a384b\\]:hover{background-color:#3a384b}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-amber-100:hover{background-color:var(--skippr-color-amber-100)}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-green-200:hover{background-color:var(--skippr-color-green-200)}.skippr\\:hover\\:bg-muted:hover{background-color:oklch(97% .001 106.424)}.skippr\\:hover\\:bg-neutral-100:hover{background-color:var(--skippr-color-neutral-100)}.skippr\\:hover\\:bg-neutral-200:hover{background-color:var(--skippr-color-neutral-200)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-red-200:hover{background-color:var(--skippr-color-red-200)}.skippr\\:hover\\:bg-red-600:hover{background-color:var(--skippr-color-red-600)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:bg-white\\/10:hover{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-white\\/10:hover{background-color:color-mix(in oklab,var(--skippr-color-white)10%,transparent)}}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-brand:focus-visible{--tw-ring-color:#2bc0ae}.skippr\\:focus-visible\\:ring-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}@media (prefers-reduced-motion:reduce){.skippr\\:motion-reduce\\:hidden{display:none}.skippr\\:motion-reduce\\:animate-none{animation:none}}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tap{0%{transform:scale(1)}45%{transform:scale(.7)}to{transform:scale(1)}}@keyframes skippr-press{0%{transform:scale(1)}55%{transform:scale(1)}85%{transform:scale(.68)}to{transform:scale(1)}}@keyframes skippr-cursor-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes skippr-click-ping{0%{opacity:.9;transform:translate(-50%,-50%)scale(.4)}to{opacity:0;transform:translate(-50%,-50%)scale(2.4)}}@keyframes skippr-tab-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-speak{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-thinking-dot{0%,80%,to{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}@keyframes skippr-pulse-ring{0%,to{box-shadow:0 0 #2d2b3d66}50%{box-shadow:0 0 0 10px #2d2b3d00}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 #2bc0ae80}50%{box-shadow:0 0 0 6px #2bc0ae00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-tip-in{0%{opacity:0;transform:translateY(14px)scale(.96)}60%{opacity:1;transform:translateY(-2px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes skippr-finger-tap{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(2px)rotate(-6deg)}}@keyframes skippr-toolset-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes skippr-stage-fade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes skippr-agent-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes skippr-orb-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
4306
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-100:oklch(93.6% .032 17.717);--skippr-color-red-200:oklch(88.5% .062 18.334);--skippr-color-red-300:oklch(80.8% .114 19.571);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-500:oklch(63.7% .237 25.331);--skippr-color-red-600:oklch(57.7% .245 27.325);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-50:oklch(98.7% .022 95.277);--skippr-color-amber-100:oklch(96.2% .059 95.617);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-amber-700:oklch(55.5% .163 48.998);--skippr-color-amber-950:oklch(27.9% .077 45.635);--skippr-color-green-100:oklch(96.2% .044 156.743);--skippr-color-green-200:oklch(92.5% .084 155.995);--skippr-color-green-700:oklch(52.7% .154 150.069);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-neutral-100:oklch(97% 0 0);--skippr-color-neutral-200:oklch(92.2% 0 0);--skippr-color-neutral-500:oklch(55.6% 0 0);--skippr-color-neutral-700:oklch(37.1% 0 0);--skippr-color-black:#000;--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-leading-tight:1.25;--skippr-leading-snug:1.375;--skippr-leading-relaxed:1.625;--skippr-ease-out:cubic-bezier(0,0,.2,1);--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--skippr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:inset-y-0{inset-block:calc(var(--skippr-spacing)*0)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-1\\/2{top:50%}.skippr\\:top-full{top:100%}.skippr\\:-right-8{right:calc(var(--skippr-spacing)*-8)}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:-bottom-1{bottom:calc(var(--skippr-spacing)*-1)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-3{bottom:calc(var(--skippr-spacing)*3)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-full{bottom:100%}.skippr\\:-left-8{left:calc(var(--skippr-spacing)*-8)}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:z-10{z-index:10}.skippr\\:z-20{z-index:20}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:order-first{order:-9999}.skippr\\:order-last{order:9999}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:-mt-\\[27px\\]{margin-top:-27px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-2{margin-top:calc(var(--skippr-spacing)*2)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mt-3\\.5{margin-top:calc(var(--skippr-spacing)*3.5)}.skippr\\:mr-7{margin-right:calc(var(--skippr-spacing)*7)}.skippr\\:-mb-\\[5px\\]{margin-bottom:-5px}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:ml-0\\.5{margin-left:calc(var(--skippr-spacing)*.5)}.skippr\\:ml-1{margin-left:calc(var(--skippr-spacing)*1)}.skippr\\:ml-7{margin-left:calc(var(--skippr-spacing)*7)}.skippr\\:flex{display:flex}.skippr\\:hidden{display:none}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3{width:calc(var(--skippr-spacing)*3);height:calc(var(--skippr-spacing)*3)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-\\[5px\\]{width:5px;height:5px}.skippr\\:size-\\[38px\\]{width:38px;height:38px}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-3{height:calc(var(--skippr-spacing)*3)}.skippr\\:h-3\\.5{height:calc(var(--skippr-spacing)*3.5)}.skippr\\:h-4{height:calc(var(--skippr-spacing)*4)}.skippr\\:h-5{height:calc(var(--skippr-spacing)*5)}.skippr\\:h-6{height:calc(var(--skippr-spacing)*6)}.skippr\\:h-7{height:calc(var(--skippr-spacing)*7)}.skippr\\:h-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-\\[18\\.5px\\]{height:18.5px}.skippr\\:h-\\[36px\\]{height:36px}.skippr\\:h-\\[38px\\]{height:38px}.skippr\\:h-\\[48px\\]{height:48px}.skippr\\:h-\\[54px\\]{height:54px}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:min-h-11{min-height:calc(var(--skippr-spacing)*11)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3\\.5{width:calc(var(--skippr-spacing)*3.5)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.skippr\\:w-5{width:calc(var(--skippr-spacing)*5)}.skippr\\:w-6{width:calc(var(--skippr-spacing)*6)}.skippr\\:w-7{width:calc(var(--skippr-spacing)*7)}.skippr\\:w-8{width:calc(var(--skippr-spacing)*8)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-40{width:calc(var(--skippr-spacing)*40)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-\\[3px\\]{width:3px}.skippr\\:w-\\[15\\.4px\\]{width:15.4px}.skippr\\:w-\\[36px\\]{width:36px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-72{max-width:calc(var(--skippr-spacing)*72)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:min-w-11{min-width:calc(var(--skippr-spacing)*11)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:origin-left{transform-origin:0}.skippr\\:origin-right{transform-origin:100%}.skippr\\:origin-top-left{transform-origin:0 0}.skippr\\:origin-top-right{transform-origin:100% 0}.skippr\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-x-3{--tw-translate-x:calc(var(--skippr-spacing)*-3);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:-translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*-7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:translate-x-3{--tw-translate-x:calc(var(--skippr-spacing)*3);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:translate-x-7{--tw-translate-x:calc(var(--skippr-spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:scale-0{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out_240ms_both\\]{animation:.2s ease-out .24s both skippr-agent-in}.skippr\\:\\[animation\\:skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:\\[animation\\:skippr-finger-tap_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-finger-tap}.skippr\\:\\[animation\\:skippr-orb-in_320ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)\\]{animation:.32s cubic-bezier(.34,1.3,.64,1) skippr-orb-in}.skippr\\:\\[animation\\:skippr-stage-fade_240ms_ease-out\\]{animation:.24s ease-out skippr-stage-fade}.skippr\\:\\[animation\\:skippr-tip-in_360ms_cubic-bezier\\(0\\.34\\,1\\.3\\,0\\.64\\,1\\)_backwards\\]{animation:.36s cubic-bezier(.34,1.3,.64,1) backwards skippr-tip-in}.skippr\\:\\[animation\\:skippr-toolset-pop_280ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.28s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:\\[animation\\:skippr-toolset-pop_440ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{animation:.44s cubic-bezier(.22,1,.36,1) skippr-toolset-pop}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-click-ping{animation:.5s ease-out forwards skippr-click-ping}.skippr\\:animate-skippr-cursor-pop{animation:.22s ease-out skippr-cursor-pop}.skippr\\:animate-skippr-press{animation:.5s ease-in-out skippr-press}.skippr\\:animate-skippr-tab-fade{animation:.2s ease-out skippr-tab-fade}.skippr\\:animate-skippr-thinking-dot{animation:1.2s ease-in-out infinite skippr-thinking-dot}.skippr\\:animate-spin{animation:var(--skippr-animate-spin)}.skippr\\:cursor-default{cursor:default}.skippr\\:cursor-grab{cursor:grab}.skippr\\:cursor-not-allowed{cursor:not-allowed}.skippr\\:cursor-pointer{cursor:pointer}.skippr\\:touch-none{touch-action:none}.skippr\\:resize-none{resize:none}.skippr\\:flex-col{flex-direction:column}.skippr\\:flex-col-reverse{flex-direction:column-reverse}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:justify-start{justify-content:flex-start}.skippr\\:gap-0\\.5{gap:calc(var(--skippr-spacing)*.5)}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[11px\\]{border-radius:11px}.skippr\\:rounded-\\[12px\\]{border-radius:12px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-\\[16px\\]{border-radius:16px}.skippr\\:rounded-\\[20px\\]{border-radius:20px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:rounded-l-\\[18px\\]{border-top-left-radius:18px;border-bottom-left-radius:18px}.skippr\\:rounded-tl-md{border-top-left-radius:.5rem}.skippr\\:rounded-r-\\[18px\\]{border-top-right-radius:18px;border-bottom-right-radius:18px}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-\\[\\#2bc0ae\\]{border-color:#2bc0ae}.skippr\\:border-border,.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:oklab(29.9244% .0107414 -.0305411/.2)}.skippr\\:border-r-border{border-right-color:oklch(92.3% .003 48.717)}.skippr\\:border-l-border{border-left-color:oklch(92.3% .003 48.717)}.skippr\\:bg-\\[\\#2bc0ae\\]{background-color:#2bc0ae}.skippr\\:bg-\\[\\#2bc0ae\\]\\/50{background-color:oklab(72.9347% -.121518 -.00545585/.5)}.skippr\\:bg-amber-50{background-color:var(--skippr-color-amber-50)}.skippr\\:bg-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-black\\/\\[0\\.07\\]{background-color:color-mix(in oklab,var(--skippr-color-black)7.0%,transparent)}}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/95{background-color:oklab(29.9244% .0107414 -.0305411/.95)}.skippr\\:bg-card{background-color:oklch(100% 0 0)}.skippr\\:bg-current{background-color:currentColor}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-green-100{background-color:var(--skippr-color-green-100)}.skippr\\:bg-launcher{background-color:#2d2d3f}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-neutral-100{background-color:var(--skippr-color-neutral-100)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-100{background-color:var(--skippr-color-red-100)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-red-500{background-color:var(--skippr-color-red-500)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white,.skippr\\:bg-white\\/15{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/15{background-color:color-mix(in oklab,var(--skippr-color-white)15%,transparent)}}.skippr\\:fill-brand{fill:#2bc0ae}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:stroke-black\\/15{stroke:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:stroke-black\\/15{stroke:color-mix(in oklab,var(--skippr-color-black)15%,transparent)}}.skippr\\:stroke-bubble{stroke:#2d2b3d}.skippr\\:p-0{padding:calc(var(--skippr-spacing)*0)}.skippr\\:p-0\\.5{padding:calc(var(--skippr-spacing)*.5)}.skippr\\:p-1\\.5{padding:calc(var(--skippr-spacing)*1.5)}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-3\\.5{padding:calc(var(--skippr-spacing)*3.5)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:py-6{padding-block:calc(var(--skippr-spacing)*6)}.skippr\\:pt-1\\.5{padding-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:pr-2\\.5{padding-right:calc(var(--skippr-spacing)*2.5)}.skippr\\:pr-3{padding-right:calc(var(--skippr-spacing)*3)}.skippr\\:pb-2{padding-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:pl-1\\.5{padding-left:calc(var(--skippr-spacing)*1.5)}.skippr\\:pl-2\\.5{padding-left:calc(var(--skippr-spacing)*2.5)}.skippr\\:pl-3\\.5{padding-left:calc(var(--skippr-spacing)*3.5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:text-\\[13px\\]{font-size:13px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-snug{--tw-leading:var(--skippr-leading-snug);line-height:var(--skippr-leading-snug)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-\\[\\#2bc0ae\\]{color:#2bc0ae}.skippr\\:text-amber-700{color:var(--skippr-color-amber-700)}.skippr\\:text-amber-950{color:var(--skippr-color-amber-950)}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-black{color:var(--skippr-color-black)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-green-700{color:var(--skippr-color-green-700)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-neutral-500{color:var(--skippr-color-neutral-500)}.skippr\\:text-neutral-700{color:var(--skippr-color-neutral-700)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-400{color:var(--skippr-color-red-400)}.skippr\\:text-red-600{color:var(--skippr-color-red-600)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:capitalize{text-transform:capitalize}.skippr\\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-40{opacity:.4}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[-6px_8px_30px_rgba\\(15\\,18\\,26\\,0\\.32\\)\\]{--tw-shadow:-6px 8px 30px var(--tw-shadow-color,#0f121a52);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_14px_rgba\\(239\\,68\\,68\\,0\\.45\\)\\]{--tw-shadow:0 4px 14px var(--tw-shadow-color,#ef444473);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_10px_32px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\]{--tw-shadow:0 10px 32px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:ring-black\\/5{--tw-ring-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--skippr-color-black)5%,transparent)}}.skippr\\:ring-brand{--tw-ring-color:#2bc0ae}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-white\\/30{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/30{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)30%,transparent)}}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:drop-shadow-\\[0_2px_5px_rgba\\(0\\,0\\,0\\,0\\.4\\)\\]{--tw-drop-shadow-size:drop-shadow(0 2px 5px var(--tw-drop-shadow-color,#0006));--tw-drop-shadow:var(--tw-drop-shadow-size);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.skippr\\:backdrop-blur-sm{--tw-backdrop-blur:blur(var(--skippr-blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.skippr\\:transition-\\[height\\]{transition-property:height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[opacity\\,transform\\,height\\]{transition-property:opacity,transform,height;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\,margin\\]{transition-property:width,margin;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-75{--tw-duration:75ms;transition-duration:75ms}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:duration-\\[400ms\\]{--tw-duration:.4s;transition-duration:.4s}.skippr\\:ease-\\[cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\]{--tw-ease:cubic-bezier(.22,1,.36,1);transition-timing-function:cubic-bezier(.22,1,.36,1)}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:ease-out{--tw-ease:var(--skippr-ease-out);transition-timing-function:var(--skippr-ease-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:select-none{-webkit-user-select:none;user-select:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\:\\[overflow-anchor\\:none\\]{overflow-anchor:none}.skippr\\:group-focus-within\\:scale-100:is(:where(.skippr\\:group):focus-within *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-focus-within\\:opacity-100:is(:where(.skippr\\:group):focus-within *){opacity:1}@media (hover:hover){.skippr\\:group-hover\\:scale-100:is(:where(.skippr\\:group):hover *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-hover\\:text-red-300:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-red-300)}.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:group-hover\\:text-white\\/80:is(:where(.skippr\\:group):hover *){color:color-mix(in oklab,var(--skippr-color-white)80%,transparent)}}.skippr\\:group-hover\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:bg-\\[\\#3a384b\\]:hover{background-color:#3a384b}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-amber-100:hover{background-color:var(--skippr-color-amber-100)}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-green-200:hover{background-color:var(--skippr-color-green-200)}.skippr\\:hover\\:bg-muted:hover{background-color:oklch(97% .001 106.424)}.skippr\\:hover\\:bg-neutral-100:hover{background-color:var(--skippr-color-neutral-100)}.skippr\\:hover\\:bg-neutral-200:hover{background-color:var(--skippr-color-neutral-200)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-red-200:hover{background-color:var(--skippr-color-red-200)}.skippr\\:hover\\:bg-red-600:hover{background-color:var(--skippr-color-red-600)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:bg-white\\/10:hover{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-white\\/10:hover{background-color:color-mix(in oklab,var(--skippr-color-white)10%,transparent)}}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-brand:focus-visible{--tw-ring-color:#2bc0ae}.skippr\\:focus-visible\\:ring-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}@media (prefers-reduced-motion:reduce){.skippr\\:motion-reduce\\:hidden{display:none}}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tap{0%{transform:scale(1)}45%{transform:scale(.7)}to{transform:scale(1)}}@keyframes skippr-press{0%{transform:scale(1)}55%{transform:scale(1)}85%{transform:scale(.68)}to{transform:scale(1)}}@keyframes skippr-cursor-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes skippr-click-ping{0%{opacity:.9;transform:translate(-50%,-50%)scale(.4)}to{opacity:0;transform:translate(-50%,-50%)scale(2.4)}}@keyframes skippr-tab-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-speak{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-thinking-dot{0%,80%,to{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}@keyframes skippr-pulse-ring{0%,to{box-shadow:0 0 #2d2b3d66}50%{box-shadow:0 0 0 10px #2d2b3d00}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 #2bc0ae80}50%{box-shadow:0 0 0 6px #2bc0ae00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-tip-in{0%{opacity:0;transform:translateY(14px)scale(.96)}60%{opacity:1;transform:translateY(-2px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes skippr-finger-tap{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(2px)rotate(-6deg)}}@keyframes skippr-toolset-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes skippr-stage-fade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes skippr-agent-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes skippr-orb-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
4204
4307
  useLayoutEffect2(() => {
4205
4308
  const host = hostRef.current;
4206
4309
  if (!host || !css)
@@ -4215,17 +4318,17 @@ function ShadowHost({ children }) {
4215
4318
  setShadowRoot(root);
4216
4319
  }, [css]);
4217
4320
  if (!css)
4218
- return /* @__PURE__ */ jsx6(Fragment2, {
4321
+ return /* @__PURE__ */ jsx7(Fragment2, {
4219
4322
  children
4220
4323
  });
4221
- return /* @__PURE__ */ jsx6("div", {
4324
+ return /* @__PURE__ */ jsx7("div", {
4222
4325
  ref: hostRef,
4223
4326
  children: shadowRoot && createPortal(children, shadowRoot)
4224
4327
  });
4225
4328
  }
4226
4329
 
4227
4330
  // src/components/Sidebar.tsx
4228
- import { useContext as useContext10, useEffect as useEffect24 } from "react";
4331
+ import { useContext as useContext11, useEffect as useEffect25 } from "react";
4229
4332
 
4230
4333
  // src/hooks/useCombinedMessages.ts
4231
4334
  import { useContext as useContext7, useMemo as useMemo5 } from "react";
@@ -4313,8 +4416,31 @@ function useCombinedMessages() {
4313
4416
  return { allMessages, agentState, sendChatMessage, isSendingChat };
4314
4417
  }
4315
4418
 
4419
+ // src/hooks/usePhaseUpdates.ts
4420
+ import { useCallback as useCallback11, useContext as useContext8, useEffect as useEffect19 } from "react";
4421
+ function parsePhases(json) {
4422
+ try {
4423
+ const data = JSON.parse(json);
4424
+ if (data.type === "phase_update" && Array.isArray(data.phases)) {
4425
+ return data.phases;
4426
+ }
4427
+ } catch {}
4428
+ return null;
4429
+ }
4430
+ function usePhaseUpdates() {
4431
+ const parse = useCallback11(parsePhases, []);
4432
+ const livePhases = useAgentState("phases", parse, []);
4433
+ const ctx = useContext8(LiveAgentContext);
4434
+ useEffect19(() => {
4435
+ if (livePhases.length > 0)
4436
+ ctx?.setPhasesSnapshot(livePhases);
4437
+ }, [livePhases, ctx?.setPhasesSnapshot]);
4438
+ const phases = livePhases.length > 0 ? livePhases : ctx?.phasesSnapshot ?? [];
4439
+ return { phases };
4440
+ }
4441
+
4316
4442
  // src/hooks/useSessionRemaining.ts
4317
- import { useEffect as useEffect19, useRef as useRef11, useState as useState13 } from "react";
4443
+ import { useEffect as useEffect20, useRef as useRef11, useState as useState14 } from "react";
4318
4444
 
4319
4445
  // src/lib/format.ts
4320
4446
  function formatTime(seconds) {
@@ -4331,8 +4457,8 @@ function parseNumber(s) {
4331
4457
  function useSessionRemaining() {
4332
4458
  const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
4333
4459
  const endTimeRef = useRef11(null);
4334
- const [remaining, setRemaining] = useState13(null);
4335
- useEffect19(() => {
4460
+ const [remaining, setRemaining] = useState14(null);
4461
+ useEffect20(() => {
4336
4462
  if (maxCallDuration === null || endTimeRef.current !== null)
4337
4463
  return;
4338
4464
  const endTime = Date.now() + maxCallDuration * 1000;
@@ -4349,13 +4475,13 @@ function useSessionRemaining() {
4349
4475
  }
4350
4476
 
4351
4477
  // src/components/ChatHeader.tsx
4352
- import { useContext as useContext9, useRef as useRef13 } from "react";
4478
+ import { useContext as useContext10, useRef as useRef13 } from "react";
4353
4479
 
4354
4480
  // src/hooks/useElapsedSeconds.ts
4355
- import { useEffect as useEffect20, useState as useState14 } from "react";
4481
+ import { useEffect as useEffect21, useState as useState15 } from "react";
4356
4482
  function useElapsedSeconds(isRunning) {
4357
- const [elapsed, setElapsed] = useState14(0);
4358
- useEffect20(() => {
4483
+ const [elapsed, setElapsed] = useState15(0);
4484
+ useEffect21(() => {
4359
4485
  if (!isRunning) {
4360
4486
  setElapsed(0);
4361
4487
  return;
@@ -4372,10 +4498,10 @@ function useElapsedSeconds(isRunning) {
4372
4498
 
4373
4499
  // src/hooks/useTextMode.ts
4374
4500
  import { useLocalParticipant as useLocalParticipant9 } from "@livekit/components-react/hooks";
4375
- import { useCallback as useCallback12, useContext as useContext8, useRef as useRef12 } from "react";
4501
+ import { useCallback as useCallback12, useContext as useContext9, useRef as useRef12 } from "react";
4376
4502
  var textEncoder5 = new TextEncoder;
4377
4503
  function useTextMode() {
4378
- const ctx = useContext8(LiveAgentContext);
4504
+ const ctx = useContext9(LiveAgentContext);
4379
4505
  if (!ctx) {
4380
4506
  throw new Error("useTextMode must be used within a <LiveAgent> provider");
4381
4507
  }
@@ -4404,9 +4530,9 @@ function useTextMode() {
4404
4530
  }
4405
4531
 
4406
4532
  // src/components/ChatHeader.tsx
4407
- import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
4533
+ import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
4408
4534
  function ChatHeader() {
4409
- const ctx = useContext9(LiveAgentContext);
4535
+ const ctx = useContext10(LiveAgentContext);
4410
4536
  if (!ctx) {
4411
4537
  throw new Error("ChatHeader must be used within a <LiveAgent> provider");
4412
4538
  }
@@ -4433,26 +4559,26 @@ function ChatHeader() {
4433
4559
  /* @__PURE__ */ jsxs7("div", {
4434
4560
  className: "skippr:flex skippr:items-center skippr:gap-3",
4435
4561
  children: [
4436
- isConnected && /* @__PURE__ */ jsx7(HeaderModeToggle, {}),
4562
+ isConnected && /* @__PURE__ */ jsx8(HeaderModeToggle, {}),
4437
4563
  isConnected && /* @__PURE__ */ jsxs7("div", {
4438
4564
  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",
4439
4565
  children: [
4440
4566
  /* @__PURE__ */ jsxs7("span", {
4441
4567
  className: "skippr:relative skippr:flex skippr:size-1.5",
4442
4568
  children: [
4443
- /* @__PURE__ */ jsx7("span", {
4569
+ /* @__PURE__ */ jsx8("span", {
4444
4570
  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"
4445
4571
  }),
4446
- /* @__PURE__ */ jsx7("span", {
4572
+ /* @__PURE__ */ jsx8("span", {
4447
4573
  className: "skippr:relative skippr:inline-flex skippr:size-1.5 skippr:rounded-full skippr:bg-red-400"
4448
4574
  })
4449
4575
  ]
4450
4576
  }),
4451
- /* @__PURE__ */ jsx7("span", {
4577
+ /* @__PURE__ */ jsx8("span", {
4452
4578
  className: "skippr:text-[10px] skippr:font-medium skippr:text-primary-foreground",
4453
4579
  children: "REC"
4454
4580
  }),
4455
- /* @__PURE__ */ jsx7("span", {
4581
+ /* @__PURE__ */ jsx8("span", {
4456
4582
  className: "skippr:text-[10px] skippr:font-mono skippr:text-primary-foreground",
4457
4583
  children: formatTime(elapsed)
4458
4584
  })
@@ -4460,7 +4586,7 @@ function ChatHeader() {
4460
4586
  })
4461
4587
  ]
4462
4588
  }),
4463
- minimizable && /* @__PURE__ */ jsx7("button", {
4589
+ minimizable && /* @__PURE__ */ jsx8("button", {
4464
4590
  type: "button",
4465
4591
  onClick: () => {
4466
4592
  if (!wasDraggedRef.current)
@@ -4469,7 +4595,7 @@ function ChatHeader() {
4469
4595
  "aria-label": "Close",
4470
4596
  title: "Close",
4471
4597
  className: "skippr:flex skippr:h-8 skippr:w-8 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-lg skippr:text-primary-foreground/70 skippr:transition-colors skippr:hover:bg-white/10 skippr:hover:text-primary-foreground skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand",
4472
- children: /* @__PURE__ */ jsx7(X, {
4598
+ children: /* @__PURE__ */ jsx8(X, {
4473
4599
  className: "skippr:h-4 skippr:w-4"
4474
4600
  })
4475
4601
  })
@@ -4478,28 +4604,32 @@ function ChatHeader() {
4478
4604
  }
4479
4605
  function HeaderModeToggle() {
4480
4606
  const { textMode, toggleTextMode } = useTextMode();
4607
+ const { isHeld } = useSessionHoldContext();
4481
4608
  return /* @__PURE__ */ jsxs7("fieldset", {
4482
4609
  "aria-label": "Response mode",
4483
- className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-white/15 skippr:p-0.5 skippr:text-xs skippr:font-medium skippr:ring-1 skippr:ring-white/30",
4610
+ disabled: isHeld,
4611
+ className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-white/15 skippr:p-0.5 skippr:text-xs skippr:font-medium skippr:ring-1 skippr:ring-white/30 skippr:disabled:opacity-50",
4484
4612
  children: [
4485
- /* @__PURE__ */ jsx7("button", {
4613
+ /* @__PURE__ */ jsx8("button", {
4486
4614
  type: "button",
4487
4615
  "aria-pressed": !textMode,
4616
+ disabled: isHeld,
4488
4617
  onClick: () => {
4489
4618
  if (textMode)
4490
4619
  toggleTextMode();
4491
4620
  },
4492
- className: cn("skippr:cursor-pointer skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand", textMode ? "skippr:font-semibold skippr:text-primary-foreground" : "skippr:bg-white skippr:text-primary skippr:shadow-sm"),
4621
+ className: cn("skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand skippr:disabled:cursor-not-allowed", isHeld ? "skippr:cursor-not-allowed" : "skippr:cursor-pointer", textMode ? "skippr:font-semibold skippr:text-primary-foreground" : "skippr:bg-white skippr:text-primary skippr:shadow-sm"),
4493
4622
  children: "Voice"
4494
4623
  }),
4495
- /* @__PURE__ */ jsx7("button", {
4624
+ /* @__PURE__ */ jsx8("button", {
4496
4625
  type: "button",
4497
4626
  "aria-pressed": textMode,
4627
+ disabled: isHeld,
4498
4628
  onClick: () => {
4499
4629
  if (!textMode)
4500
4630
  toggleTextMode();
4501
4631
  },
4502
- className: cn("skippr:cursor-pointer skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand", textMode ? "skippr:bg-white skippr:text-primary skippr:shadow-sm" : "skippr:font-semibold skippr:text-primary-foreground"),
4632
+ className: cn("skippr:rounded-md skippr:px-2.5 skippr:py-1 skippr:transition-colors skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-brand skippr:disabled:cursor-not-allowed", isHeld ? "skippr:cursor-not-allowed" : "skippr:cursor-pointer", textMode ? "skippr:bg-white skippr:text-primary skippr:shadow-sm" : "skippr:font-semibold skippr:text-primary-foreground"),
4503
4633
  children: "Text"
4504
4634
  })
4505
4635
  ]
@@ -4507,7 +4637,7 @@ function HeaderModeToggle() {
4507
4637
  }
4508
4638
 
4509
4639
  // src/components/LoadingDots.tsx
4510
- import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
4640
+ import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
4511
4641
  function LoadingDots({ label }) {
4512
4642
  return /* @__PURE__ */ jsxs8("div", {
4513
4643
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:py-4",
@@ -4515,18 +4645,18 @@ function LoadingDots({ label }) {
4515
4645
  /* @__PURE__ */ jsxs8("div", {
4516
4646
  className: "skippr:flex skippr:gap-1",
4517
4647
  children: [
4518
- /* @__PURE__ */ jsx8("span", {
4648
+ /* @__PURE__ */ jsx9("span", {
4519
4649
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:0ms]"
4520
4650
  }),
4521
- /* @__PURE__ */ jsx8("span", {
4651
+ /* @__PURE__ */ jsx9("span", {
4522
4652
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:150ms]"
4523
4653
  }),
4524
- /* @__PURE__ */ jsx8("span", {
4654
+ /* @__PURE__ */ jsx9("span", {
4525
4655
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:300ms]"
4526
4656
  })
4527
4657
  ]
4528
4658
  }),
4529
- /* @__PURE__ */ jsx8("p", {
4659
+ /* @__PURE__ */ jsx9("p", {
4530
4660
  className: "skippr:text-xs skippr:text-muted-foreground",
4531
4661
  children: label
4532
4662
  })
@@ -4535,11 +4665,11 @@ function LoadingDots({ label }) {
4535
4665
  }
4536
4666
 
4537
4667
  // src/components/LoginFlow.tsx
4538
- import { useCallback as useCallback13, useEffect as useEffect21, useRef as useRef14, useState as useState15 } from "react";
4668
+ import { useCallback as useCallback13, useEffect as useEffect22, useRef as useRef14, useState as useState16 } from "react";
4539
4669
 
4540
4670
  // src/components/ui/button.tsx
4541
4671
  import { forwardRef as forwardRef3 } from "react";
4542
- import { jsx as jsx9 } from "react/jsx-runtime";
4672
+ import { jsx as jsx10 } from "react/jsx-runtime";
4543
4673
  var variantClasses = {
4544
4674
  default: "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90",
4545
4675
  destructive: "skippr:bg-destructive skippr:text-white skippr:hover:bg-destructive/90",
@@ -4558,7 +4688,7 @@ var sizeClasses = {
4558
4688
  "icon-lg": "skippr:size-10"
4559
4689
  };
4560
4690
  var Button = forwardRef3(({ className, variant = "default", size = "default", ...props }, ref) => {
4561
- return /* @__PURE__ */ jsx9("button", {
4691
+ return /* @__PURE__ */ jsx10("button", {
4562
4692
  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),
4563
4693
  ref,
4564
4694
  ...props
@@ -4567,12 +4697,12 @@ var Button = forwardRef3(({ className, variant = "default", size = "default", ..
4567
4697
  Button.displayName = "Button";
4568
4698
 
4569
4699
  // src/components/LoginFlow.tsx
4570
- import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
4700
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
4571
4701
  var OTP_LENGTH = 6;
4572
4702
  var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
4573
4703
  function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4574
- const [step, setStep] = useState15("email");
4575
- const [email, setEmail] = useState15("");
4704
+ const [step, setStep] = useState16("email");
4705
+ const [email, setEmail] = useState16("");
4576
4706
  const handleRequestOtp = useCallback13(async (emailValue) => {
4577
4707
  const success = await requestOtp(emailValue);
4578
4708
  if (success)
@@ -4588,7 +4718,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4588
4718
  await requestOtp(email);
4589
4719
  }, [requestOtp, email]);
4590
4720
  if (step === "otp") {
4591
- return /* @__PURE__ */ jsx10(OtpStep, {
4721
+ return /* @__PURE__ */ jsx11(OtpStep, {
4592
4722
  email,
4593
4723
  onSubmit: handleVerifyOtp,
4594
4724
  onResend: handleResend,
@@ -4597,7 +4727,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
4597
4727
  isSubmitting
4598
4728
  });
4599
4729
  }
4600
- return /* @__PURE__ */ jsx10(EmailStep, {
4730
+ return /* @__PURE__ */ jsx11(EmailStep, {
4601
4731
  email,
4602
4732
  onEmailChange: setEmail,
4603
4733
  onSubmit: handleRequestOtp,
@@ -4617,14 +4747,14 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4617
4747
  /* @__PURE__ */ jsxs9("div", {
4618
4748
  className: "skippr:mb-4 skippr:text-center",
4619
4749
  children: [
4620
- /* @__PURE__ */ jsx10(Mail, {
4750
+ /* @__PURE__ */ jsx11(Mail, {
4621
4751
  className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
4622
4752
  }),
4623
- /* @__PURE__ */ jsx10("p", {
4753
+ /* @__PURE__ */ jsx11("p", {
4624
4754
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
4625
4755
  children: "Sign in to continue"
4626
4756
  }),
4627
- /* @__PURE__ */ jsx10("p", {
4757
+ /* @__PURE__ */ jsx11("p", {
4628
4758
  className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
4629
4759
  children: "Your email will be used to identify you across sessions"
4630
4760
  })
@@ -4634,7 +4764,7 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4634
4764
  onSubmit: handleSubmit,
4635
4765
  className: "skippr:flex skippr:flex-col skippr:gap-3",
4636
4766
  children: [
4637
- /* @__PURE__ */ jsx10("input", {
4767
+ /* @__PURE__ */ jsx11("input", {
4638
4768
  type: "email",
4639
4769
  placeholder: "you@example.com",
4640
4770
  value: email,
@@ -4643,15 +4773,15 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4643
4773
  required: true,
4644
4774
  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"
4645
4775
  }),
4646
- /* @__PURE__ */ jsx10(Button, {
4776
+ /* @__PURE__ */ jsx11(Button, {
4647
4777
  type: "submit",
4648
4778
  disabled: isSubmitting || !email.trim(),
4649
4779
  className: "skippr:w-full",
4650
- children: isSubmitting ? /* @__PURE__ */ jsx10(LoaderCircle, {
4780
+ children: isSubmitting ? /* @__PURE__ */ jsx11(LoaderCircle, {
4651
4781
  className: "skippr:size-4 skippr:animate-spin"
4652
4782
  }) : "Continue"
4653
4783
  }),
4654
- error && /* @__PURE__ */ jsx10("p", {
4784
+ error && /* @__PURE__ */ jsx11("p", {
4655
4785
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
4656
4786
  children: error
4657
4787
  })
@@ -4661,18 +4791,18 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
4661
4791
  });
4662
4792
  }
4663
4793
  function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4664
- const [digits, setDigits] = useState15(Array(OTP_LENGTH).fill(""));
4665
- const [resendCooldown, setResendCooldown] = useState15(0);
4794
+ const [digits, setDigits] = useState16(Array(OTP_LENGTH).fill(""));
4795
+ const [resendCooldown, setResendCooldown] = useState16(0);
4666
4796
  const inputRefs = useRef14([]);
4667
4797
  const submittedRef = useRef14(false);
4668
- useEffect21(() => {
4798
+ useEffect22(() => {
4669
4799
  inputRefs.current[0]?.focus();
4670
4800
  }, []);
4671
- useEffect21(() => {
4801
+ useEffect22(() => {
4672
4802
  if (error)
4673
4803
  submittedRef.current = false;
4674
4804
  }, [error]);
4675
- useEffect21(() => {
4805
+ useEffect22(() => {
4676
4806
  if (resendCooldown <= 0)
4677
4807
  return;
4678
4808
  const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
@@ -4737,7 +4867,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4737
4867
  /* @__PURE__ */ jsxs9("div", {
4738
4868
  className: "skippr:mb-4 skippr:text-center",
4739
4869
  children: [
4740
- /* @__PURE__ */ jsx10("p", {
4870
+ /* @__PURE__ */ jsx11("p", {
4741
4871
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
4742
4872
  children: "Enter verification code"
4743
4873
  }),
@@ -4746,7 +4876,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4746
4876
  children: [
4747
4877
  "We sent a 6-digit code to",
4748
4878
  " ",
4749
- /* @__PURE__ */ jsx10("span", {
4879
+ /* @__PURE__ */ jsx11("span", {
4750
4880
  className: "skippr:font-medium skippr:text-foreground",
4751
4881
  children: email
4752
4882
  })
@@ -4758,9 +4888,9 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4758
4888
  onSubmit: handleSubmit,
4759
4889
  className: "skippr:flex skippr:flex-col skippr:gap-3",
4760
4890
  children: [
4761
- /* @__PURE__ */ jsx10("div", {
4891
+ /* @__PURE__ */ jsx11("div", {
4762
4892
  className: "skippr:flex skippr:justify-center skippr:gap-1.5",
4763
- children: digits.map((digit, index2) => /* @__PURE__ */ jsx10("input", {
4893
+ children: digits.map((digit, index2) => /* @__PURE__ */ jsx11("input", {
4764
4894
  ref: (el) => {
4765
4895
  inputRefs.current[index2] = el;
4766
4896
  },
@@ -4775,29 +4905,29 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4775
4905
  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"
4776
4906
  }, DIGIT_KEYS[index2]))
4777
4907
  }),
4778
- error && /* @__PURE__ */ jsx10("p", {
4908
+ error && /* @__PURE__ */ jsx11("p", {
4779
4909
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
4780
4910
  children: error
4781
4911
  }),
4782
- /* @__PURE__ */ jsx10(Button, {
4912
+ /* @__PURE__ */ jsx11(Button, {
4783
4913
  type: "submit",
4784
4914
  disabled: isSubmitting || digits.join("").length !== OTP_LENGTH,
4785
4915
  className: "skippr:w-full",
4786
- children: isSubmitting ? /* @__PURE__ */ jsx10(LoaderCircle, {
4916
+ children: isSubmitting ? /* @__PURE__ */ jsx11(LoaderCircle, {
4787
4917
  className: "skippr:size-4 skippr:animate-spin"
4788
4918
  }) : "Verify"
4789
4919
  }),
4790
4920
  /* @__PURE__ */ jsxs9("div", {
4791
4921
  className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
4792
4922
  children: [
4793
- /* @__PURE__ */ jsx10("button", {
4923
+ /* @__PURE__ */ jsx11("button", {
4794
4924
  type: "button",
4795
4925
  onClick: onBack,
4796
4926
  disabled: isSubmitting,
4797
4927
  className: "skippr:text-muted-foreground hover:skippr:text-foreground skippr:transition-colors disabled:skippr:opacity-50",
4798
4928
  children: "Change email"
4799
4929
  }),
4800
- /* @__PURE__ */ jsx10("button", {
4930
+ /* @__PURE__ */ jsx11("button", {
4801
4931
  type: "button",
4802
4932
  onClick: handleResend,
4803
4933
  disabled: isSubmitting || resendCooldown > 0,
@@ -4813,17 +4943,17 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
4813
4943
  }
4814
4944
 
4815
4945
  // src/components/MessageList.tsx
4816
- import { useCallback as useCallback14, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState17 } from "react";
4946
+ import { useCallback as useCallback14, useLayoutEffect as useLayoutEffect3, useRef as useRef16, useState as useState18 } from "react";
4817
4947
 
4818
4948
  // src/components/ChatInput.tsx
4819
- import { useEffect as useEffect22, useRef as useRef15, useState as useState16 } from "react";
4820
- import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
4949
+ import { useEffect as useEffect23, useRef as useRef15, useState as useState17 } from "react";
4950
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
4821
4951
  var MAX_INPUT_HEIGHT = 60;
4822
4952
  function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4823
- const [inputText, setInputText] = useState16("");
4953
+ const [inputText, setInputText] = useState17("");
4824
4954
  const textareaRef = useRef15(null);
4825
4955
  const canSend = inputText.trim().length > 0 && !isSendingChat;
4826
- useEffect22(() => {
4956
+ useEffect23(() => {
4827
4957
  if (autoFocus)
4828
4958
  textareaRef.current?.focus();
4829
4959
  }, [autoFocus]);
@@ -4854,13 +4984,13 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4854
4984
  handleSubmit(e);
4855
4985
  }
4856
4986
  }
4857
- return /* @__PURE__ */ jsx11("form", {
4987
+ return /* @__PURE__ */ jsx12("form", {
4858
4988
  onSubmit: handleSubmit,
4859
4989
  className: "skippr:border-t skippr:border-border skippr:p-3",
4860
4990
  children: /* @__PURE__ */ jsxs10("div", {
4861
4991
  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",
4862
4992
  children: [
4863
- /* @__PURE__ */ jsx11("textarea", {
4993
+ /* @__PURE__ */ jsx12("textarea", {
4864
4994
  ref: textareaRef,
4865
4995
  rows: 1,
4866
4996
  value: inputText,
@@ -4870,12 +5000,12 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4870
5000
  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",
4871
5001
  style: { maxHeight: `${MAX_INPUT_HEIGHT}px` }
4872
5002
  }),
4873
- /* @__PURE__ */ jsx11("button", {
5003
+ /* @__PURE__ */ jsx12("button", {
4874
5004
  type: "submit",
4875
5005
  disabled: !canSend,
4876
5006
  "aria-label": "Send message",
4877
5007
  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"),
4878
- children: /* @__PURE__ */ jsx11(Send, {
5008
+ children: /* @__PURE__ */ jsx12(Send, {
4879
5009
  className: "skippr:size-3.5"
4880
5010
  })
4881
5011
  })
@@ -4885,7 +5015,7 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
4885
5015
  }
4886
5016
 
4887
5017
  // src/components/ChatMessage.tsx
4888
- import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
5018
+ import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
4889
5019
  function formatTimestamp(ts) {
4890
5020
  return new Date(ts).toLocaleTimeString("en-US", {
4891
5021
  hour: "numeric",
@@ -4895,16 +5025,16 @@ function formatTimestamp(ts) {
4895
5025
  }
4896
5026
  function ChatMessage({ message }) {
4897
5027
  const isAgent = message.role === "assistant";
4898
- return /* @__PURE__ */ jsx12("div", {
5028
+ return /* @__PURE__ */ jsx13("div", {
4899
5029
  className: cn("skippr:flex skippr:gap-2", isAgent ? "skippr:items-start" : "skippr:justify-end"),
4900
5030
  children: /* @__PURE__ */ jsxs11("div", {
4901
5031
  className: cn("skippr:flex skippr:max-w-[80%] skippr:flex-col", isAgent ? "skippr:items-start" : "skippr:items-end"),
4902
5032
  children: [
4903
- /* @__PURE__ */ jsx12("div", {
5033
+ /* @__PURE__ */ jsx13("div", {
4904
5034
  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"),
4905
5035
  children: message.content
4906
5036
  }),
4907
- message.timestamp && /* @__PURE__ */ jsx12("span", {
5037
+ message.timestamp && /* @__PURE__ */ jsx13("span", {
4908
5038
  className: "skippr:mt-1 skippr:px-1 skippr:text-[10px] skippr:text-muted-foreground/60",
4909
5039
  children: formatTimestamp(message.timestamp)
4910
5040
  })
@@ -4914,34 +5044,34 @@ function ChatMessage({ message }) {
4914
5044
  }
4915
5045
 
4916
5046
  // src/components/PlanCard.tsx
4917
- import { useEffect as useEffect23 } from "react";
4918
- import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
5047
+ import { useEffect as useEffect24 } from "react";
5048
+ import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
4919
5049
  var APPROVE_MESSAGE = "Yes, go ahead.";
4920
5050
  var CANCEL_MESSAGE = "No, cancel that.";
4921
5051
  var COMPLETED_CARD_VISIBLE_MS = 2500;
4922
5052
  function StepIcon({ status }) {
4923
5053
  if (status === "done") {
4924
- return /* @__PURE__ */ jsx13(CircleCheck, {
5054
+ return /* @__PURE__ */ jsx14(CircleCheck, {
4925
5055
  className: "skippr:size-4 skippr:text-chart-3"
4926
5056
  });
4927
5057
  }
4928
5058
  if (status === "failed") {
4929
- return /* @__PURE__ */ jsx13(CircleX, {
5059
+ return /* @__PURE__ */ jsx14(CircleX, {
4930
5060
  className: "skippr:size-4 skippr:text-destructive"
4931
5061
  });
4932
5062
  }
4933
5063
  if (status === "active") {
4934
- return /* @__PURE__ */ jsx13(Circle, {
5064
+ return /* @__PURE__ */ jsx14(Circle, {
4935
5065
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
4936
5066
  });
4937
5067
  }
4938
- return /* @__PURE__ */ jsx13(Circle, {
5068
+ return /* @__PURE__ */ jsx14(Circle, {
4939
5069
  className: "skippr:size-4 skippr:text-muted-foreground/30"
4940
5070
  });
4941
5071
  }
4942
5072
  function PlanCard({ plan, sendChatMessage, onDismiss }) {
4943
5073
  const awaitingApproval = plan.state === "proposed";
4944
- useEffect23(() => {
5074
+ useEffect24(() => {
4945
5075
  if (plan.state !== "completed")
4946
5076
  return;
4947
5077
  const timer = setTimeout(onDismiss, COMPLETED_CARD_VISIBLE_MS);
@@ -4950,19 +5080,19 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4950
5080
  return /* @__PURE__ */ jsxs12("div", {
4951
5081
  className: "skippr:rounded-2xl skippr:rounded-tl-md skippr:bg-card skippr:p-3.5 skippr:ring-2 skippr:ring-brand",
4952
5082
  children: [
4953
- /* @__PURE__ */ jsx13("p", {
5083
+ /* @__PURE__ */ jsx14("p", {
4954
5084
  className: "skippr:mb-3 skippr:text-sm skippr:font-semibold skippr:leading-snug skippr:text-foreground",
4955
5085
  children: "Plan"
4956
5086
  }),
4957
- /* @__PURE__ */ jsx13("div", {
5087
+ /* @__PURE__ */ jsx14("div", {
4958
5088
  className: "skippr:space-y-2",
4959
5089
  children: plan.steps.map((step) => /* @__PURE__ */ jsxs12("div", {
4960
5090
  className: "skippr:flex skippr:items-center skippr:gap-2",
4961
5091
  children: [
4962
- /* @__PURE__ */ jsx13(StepIcon, {
5092
+ /* @__PURE__ */ jsx14(StepIcon, {
4963
5093
  status: step.status
4964
5094
  }),
4965
- /* @__PURE__ */ jsx13("p", {
5095
+ /* @__PURE__ */ jsx14("p", {
4966
5096
  className: cn("skippr:text-sm skippr:leading-snug", step.status === "done" && "skippr:text-muted-foreground skippr:line-through", step.status === "active" && "skippr:font-medium skippr:text-foreground", step.status === "pending" && "skippr:text-muted-foreground", step.status === "failed" && "skippr:text-destructive"),
4967
5097
  children: step.label
4968
5098
  })
@@ -4972,12 +5102,12 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4972
5102
  awaitingApproval && /* @__PURE__ */ jsxs12("div", {
4973
5103
  className: "skippr:mt-3.5 skippr:flex skippr:gap-2",
4974
5104
  children: [
4975
- /* @__PURE__ */ jsx13(Button, {
5105
+ /* @__PURE__ */ jsx14(Button, {
4976
5106
  className: "skippr:flex-1 skippr:py-2",
4977
5107
  onClick: () => sendChatMessage(APPROVE_MESSAGE),
4978
5108
  children: "Approve"
4979
5109
  }),
4980
- /* @__PURE__ */ jsx13(Button, {
5110
+ /* @__PURE__ */ jsx14(Button, {
4981
5111
  variant: "outline",
4982
5112
  className: "skippr:flex-1 skippr:py-2",
4983
5113
  onClick: () => sendChatMessage(CANCEL_MESSAGE),
@@ -4990,26 +5120,26 @@ function PlanCard({ plan, sendChatMessage, onDismiss }) {
4990
5120
  }
4991
5121
 
4992
5122
  // src/components/TypingIndicator.tsx
4993
- import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
5123
+ import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
4994
5124
  function TypingIndicator() {
4995
- return /* @__PURE__ */ jsx14("div", {
5125
+ return /* @__PURE__ */ jsx15("div", {
4996
5126
  className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
4997
5127
  children: /* @__PURE__ */ jsxs13("div", {
4998
5128
  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",
4999
5129
  children: [
5000
- /* @__PURE__ */ jsx14("span", {
5130
+ /* @__PURE__ */ jsx15("span", {
5001
5131
  children: "Agent is analyzing your screen"
5002
5132
  }),
5003
5133
  /* @__PURE__ */ jsxs13("span", {
5004
5134
  className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
5005
5135
  children: [
5006
- /* @__PURE__ */ jsx14("span", {
5136
+ /* @__PURE__ */ jsx15("span", {
5007
5137
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
5008
5138
  }),
5009
- /* @__PURE__ */ jsx14("span", {
5139
+ /* @__PURE__ */ jsx15("span", {
5010
5140
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
5011
5141
  }),
5012
- /* @__PURE__ */ jsx14("span", {
5142
+ /* @__PURE__ */ jsx15("span", {
5013
5143
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
5014
5144
  })
5015
5145
  ]
@@ -5020,7 +5150,7 @@ function TypingIndicator() {
5020
5150
  }
5021
5151
 
5022
5152
  // src/components/MessageList.tsx
5023
- import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
5153
+ import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
5024
5154
  var BOTTOM_THRESHOLD_PX = 32;
5025
5155
  function isPlanVisible(plan) {
5026
5156
  return !!plan && plan.steps.length > 0 && plan.state !== "abandoned";
@@ -5029,16 +5159,17 @@ function MessageList({
5029
5159
  messages,
5030
5160
  isStreaming,
5031
5161
  sendChatMessage,
5032
- isSendingChat,
5162
+ isSendingChat = false,
5033
5163
  plan,
5034
- autoFocus = false
5164
+ autoFocus = false,
5165
+ readOnly = false
5035
5166
  }) {
5036
5167
  const containerRef = useRef16(null);
5037
5168
  const isPinnedToBottom = useRef16(true);
5038
5169
  const lastSeenMessageId = useRef16(undefined);
5039
- const [showJumpToLatest, setShowJumpToLatest] = useState17(false);
5170
+ const [showJumpToLatest, setShowJumpToLatest] = useState18(false);
5040
5171
  const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
5041
- const [dismissedPlanId, setDismissedPlanId] = useState17(null);
5172
+ const [dismissedPlanId, setDismissedPlanId] = useState18(null);
5042
5173
  const dismissPlan = useCallback14(() => {
5043
5174
  if (plan)
5044
5175
  setDismissedPlanId(plan.planId);
@@ -5086,35 +5217,38 @@ function MessageList({
5086
5217
  onScroll: handleScroll,
5087
5218
  className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4 skippr:[overflow-anchor:none]",
5088
5219
  children: [
5089
- messages.length === 0 && !showTyping && /* @__PURE__ */ jsx15(LoadingDots, {
5220
+ messages.length === 0 && !showTyping && (readOnly ? /* @__PURE__ */ jsx16("p", {
5221
+ className: "skippr:px-2 skippr:py-6 skippr:text-center skippr:text-sm skippr:text-muted-foreground",
5222
+ children: "No messages in this conversation yet."
5223
+ }) : /* @__PURE__ */ jsx16(LoadingDots, {
5090
5224
  label: "Waiting for conversation to begin..."
5091
- }),
5092
- messages.map((message) => /* @__PURE__ */ jsx15(ChatMessage, {
5225
+ })),
5226
+ messages.map((message) => /* @__PURE__ */ jsx16(ChatMessage, {
5093
5227
  message
5094
5228
  }, message.id)),
5095
- showTyping && /* @__PURE__ */ jsx15(TypingIndicator, {})
5229
+ showTyping && /* @__PURE__ */ jsx16(TypingIndicator, {})
5096
5230
  ]
5097
5231
  }),
5098
- showJumpToLatest && /* @__PURE__ */ jsx15("button", {
5232
+ showJumpToLatest && /* @__PURE__ */ jsx16("button", {
5099
5233
  type: "button",
5100
5234
  onClick: jumpToLatest,
5101
5235
  "aria-label": "Jump to latest message",
5102
5236
  className: "skippr:-translate-x-1/2 skippr:absolute skippr:bottom-3 skippr:left-1/2 skippr:flex skippr:min-h-11 skippr:min-w-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:border skippr:border-border skippr:bg-background skippr:p-1.5 skippr:text-foreground skippr:shadow-md skippr:transition-colors skippr:hover:bg-muted",
5103
- children: /* @__PURE__ */ jsx15(ChevronDown, {
5237
+ children: /* @__PURE__ */ jsx16(ChevronDown, {
5104
5238
  className: "skippr:size-4"
5105
5239
  })
5106
5240
  })
5107
5241
  ]
5108
5242
  }),
5109
- isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx15("div", {
5243
+ sendChatMessage && isPlanVisible(plan) && plan.planId !== dismissedPlanId && /* @__PURE__ */ jsx16("div", {
5110
5244
  className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
5111
- children: /* @__PURE__ */ jsx15(PlanCard, {
5245
+ children: /* @__PURE__ */ jsx16(PlanCard, {
5112
5246
  plan,
5113
5247
  sendChatMessage,
5114
5248
  onDismiss: dismissPlan
5115
5249
  }, plan.planId)
5116
5250
  }),
5117
- /* @__PURE__ */ jsx15(ChatInput, {
5251
+ !readOnly && sendChatMessage && /* @__PURE__ */ jsx16(ChatInput, {
5118
5252
  sendChatMessage,
5119
5253
  isSendingChat,
5120
5254
  autoFocus
@@ -5124,19 +5258,19 @@ function MessageList({
5124
5258
  }
5125
5259
 
5126
5260
  // src/components/SessionAgenda.tsx
5127
- import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
5261
+ import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
5128
5262
  function SessionAgenda({ phases, hasStarted }) {
5129
5263
  if (phases.length === 0 || !hasStarted) {
5130
- return /* @__PURE__ */ jsx16("div", {
5264
+ return /* @__PURE__ */ jsx17("div", {
5131
5265
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5132
- children: /* @__PURE__ */ jsx16(LoadingDots, {
5266
+ children: /* @__PURE__ */ jsx17(LoadingDots, {
5133
5267
  label: "Waiting for agenda to load..."
5134
5268
  })
5135
5269
  });
5136
5270
  }
5137
- return /* @__PURE__ */ jsx16("div", {
5271
+ return /* @__PURE__ */ jsx17("div", {
5138
5272
  className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
5139
- children: /* @__PURE__ */ jsx16("div", {
5273
+ children: /* @__PURE__ */ jsx17("div", {
5140
5274
  className: "skippr:space-y-1",
5141
5275
  children: phases.map((phase) => {
5142
5276
  const isActive = phase.status === "active";
@@ -5144,29 +5278,29 @@ function SessionAgenda({ phases, hasStarted }) {
5144
5278
  return /* @__PURE__ */ jsxs15("div", {
5145
5279
  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"),
5146
5280
  children: [
5147
- /* @__PURE__ */ jsx16("div", {
5281
+ /* @__PURE__ */ jsx17("div", {
5148
5282
  className: "skippr:mt-0.5",
5149
- children: isCompleted ? /* @__PURE__ */ jsx16(CircleCheck, {
5283
+ children: isCompleted ? /* @__PURE__ */ jsx17(CircleCheck, {
5150
5284
  className: "skippr:size-4 skippr:text-chart-3"
5151
- }) : isActive ? /* @__PURE__ */ jsx16(Circle, {
5285
+ }) : isActive ? /* @__PURE__ */ jsx17(Circle, {
5152
5286
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
5153
- }) : /* @__PURE__ */ jsx16(Circle, {
5287
+ }) : /* @__PURE__ */ jsx17(Circle, {
5154
5288
  className: "skippr:size-4 skippr:text-muted-foreground/30"
5155
5289
  })
5156
5290
  }),
5157
5291
  /* @__PURE__ */ jsxs15("div", {
5158
5292
  className: "skippr:min-w-0 skippr:flex-1",
5159
5293
  children: [
5160
- /* @__PURE__ */ jsx16("p", {
5294
+ /* @__PURE__ */ jsx17("p", {
5161
5295
  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"),
5162
5296
  children: phase.name
5163
5297
  }),
5164
- phase.highlights.length > 0 && /* @__PURE__ */ jsx16("ul", {
5298
+ phase.highlights.length > 0 && /* @__PURE__ */ jsx17("ul", {
5165
5299
  className: "skippr:mt-1 skippr:space-y-0.5",
5166
5300
  children: phase.highlights.map((text) => /* @__PURE__ */ jsxs15("li", {
5167
5301
  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"),
5168
5302
  children: [
5169
- /* @__PURE__ */ jsx16("span", {
5303
+ /* @__PURE__ */ jsx17("span", {
5170
5304
  className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
5171
5305
  }),
5172
5306
  text
@@ -5183,61 +5317,20 @@ function SessionAgenda({ phases, hasStarted }) {
5183
5317
  }
5184
5318
 
5185
5319
  // src/components/SessionWarningBanner.tsx
5186
- import { jsx as jsx17 } from "react/jsx-runtime";
5320
+ import { jsx as jsx18 } from "react/jsx-runtime";
5187
5321
  var SESSION_WARNING_THRESHOLD_SECS = 60;
5188
5322
  function SessionWarningBanner({ remaining }) {
5189
5323
  if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
5190
5324
  return null;
5191
- return /* @__PURE__ */ jsx17("div", {
5325
+ return /* @__PURE__ */ jsx18("div", {
5192
5326
  "data-testid": "session-warning-banner",
5193
5327
  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",
5194
5328
  children: "Session ending soon"
5195
5329
  });
5196
5330
  }
5197
5331
 
5198
- // src/components/StartSessionPrompt.tsx
5199
- import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
5200
- var PROMPT_BUTTON = "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";
5201
- function StartSessionPrompt({
5202
- onStartSession,
5203
- agentId,
5204
- agentControls,
5205
- isStarting,
5206
- error,
5207
- label = "Talk to Skippr",
5208
- canResume = false,
5209
- onResume
5210
- }) {
5211
- return /* @__PURE__ */ jsxs16("div", {
5212
- className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
5213
- children: [
5214
- canResume && onResume ? /* @__PURE__ */ jsx18("button", {
5215
- type: "button",
5216
- onClick: onResume,
5217
- disabled: isStarting,
5218
- className: PROMPT_BUTTON,
5219
- children: isStarting ? "Resuming..." : "Resume session"
5220
- }) : /* @__PURE__ */ jsx18("button", {
5221
- type: "button",
5222
- onClick: () => {
5223
- if (!agentId)
5224
- return;
5225
- onStartSession(agentControls ? { agentId, agentControls } : { agentId });
5226
- },
5227
- disabled: isStarting || !agentId,
5228
- className: PROMPT_BUTTON,
5229
- children: isStarting ? "Starting..." : label
5230
- }),
5231
- error && /* @__PURE__ */ jsx18("p", {
5232
- className: "skippr:text-xs skippr:text-destructive",
5233
- children: error
5234
- })
5235
- ]
5236
- });
5237
- }
5238
-
5239
5332
  // src/components/Sidebar.tsx
5240
- import { jsx as jsx19, jsxs as jsxs17, Fragment as Fragment3 } from "react/jsx-runtime";
5333
+ import { jsx as jsx19, jsxs as jsxs16, Fragment as Fragment3 } from "react/jsx-runtime";
5241
5334
  var PANEL_GAP_PX = 12;
5242
5335
  var PANEL_VIEWPORT_MARGIN_PX = 24;
5243
5336
  var PANEL_MAX_HEIGHT_PX = 460;
@@ -5254,9 +5347,6 @@ function Sidebar({
5254
5347
  isPausing,
5255
5348
  isPaused,
5256
5349
  error,
5257
- startSession,
5258
- resumeSession,
5259
- resumableSession,
5260
5350
  isPanelOpen,
5261
5351
  position,
5262
5352
  isAuthenticated,
@@ -5268,17 +5358,26 @@ function Sidebar({
5268
5358
  sidebarTab: activeTab,
5269
5359
  setSidebarTab: setActiveTab,
5270
5360
  autoFocusChat,
5271
- agentId,
5272
5361
  agentMode,
5273
- agentControls
5362
+ displayModules
5274
5363
  } = useLiveAgent();
5275
- const internalCtx = useContext10(LiveAgentContext);
5364
+ const internalCtx = useContext11(LiveAgentContext);
5365
+ const defaultAgentId = internalCtx?.defaultAgentId ?? null;
5366
+ const startDefaultSession = internalCtx?.startDefaultSession ?? (() => {});
5367
+ const talkDisabled = !(internalCtx?.hasResolvedModules ?? false);
5276
5368
  const usesHostAuth = internalCtx?.usesHostAuth ?? false;
5277
5369
  const authFailed = internalCtx?.authFailed ?? false;
5370
+ const idleHistory = internalCtx?.idleHistory ?? {
5371
+ messages: [],
5372
+ phases: [],
5373
+ isLoading: false
5374
+ };
5278
5375
  const launcherBottomPx = internalCtx?.launcherBottomPx ?? DEFAULT_LAUNCHER_BOTTOM_PX;
5279
5376
  const popsDown = internalCtx?.popsDown ?? false;
5280
5377
  const panelExpanded = internalCtx?.panelExpanded ?? false;
5281
- const showAgenda = agentMode !== AGENT_MODE.AlwaysOn;
5378
+ const defaultModule = displayModules.find((m) => m.id === defaultAgentId) ?? null;
5379
+ const displayedMode = agentMode ?? defaultModule?.mode ?? null;
5380
+ const showAgenda = displayedMode !== AGENT_MODE.AlwaysOn;
5282
5381
  const isFloating = variant === "floating";
5283
5382
  const isSidebar = variant === "sidebar";
5284
5383
  const inSession = isConnected || isStarting || isPausing;
@@ -5291,7 +5390,7 @@ function Sidebar({
5291
5390
  height: panelExpanded ? availableHeight : `min(${PANEL_MAX_HEIGHT_PX}px, ${availableHeight})`
5292
5391
  };
5293
5392
  }
5294
- useEffect24(() => {
5393
+ useEffect25(() => {
5295
5394
  if (!isSidebar)
5296
5395
  return;
5297
5396
  const prop = position === "right" ? "marginRight" : "marginLeft";
@@ -5305,7 +5404,7 @@ function Sidebar({
5305
5404
  document.body.style.transition = "";
5306
5405
  };
5307
5406
  }, [isSidebar, isPanelOpen, position]);
5308
- return /* @__PURE__ */ jsxs17("div", {
5407
+ return /* @__PURE__ */ jsxs16("div", {
5309
5408
  ref: internalCtx?.panelRef,
5310
5409
  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: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,height] skippr:duration-300 skippr:ease-in-out", isFloating && (popsDown ? position === "right" ? "skippr:origin-top-right" : "skippr:origin-top-left" : 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"),
5311
5410
  style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined, ...floatingStyle },
@@ -5316,19 +5415,17 @@ function Sidebar({
5316
5415
  isPaused,
5317
5416
  isPausing,
5318
5417
  isDisconnecting,
5319
- canResume: resumableSession !== null,
5320
- onStartSession: startSession,
5321
- onResume: resumeSession,
5322
5418
  isStarting,
5323
5419
  error,
5324
5420
  activeTab,
5325
5421
  onTabChange: setActiveTab,
5326
5422
  hideControls,
5327
- startSessionLabel,
5328
5423
  autoFocusChat,
5329
- agentId,
5330
- agentControls,
5331
- showAgenda
5424
+ showAgenda,
5425
+ idleHistory,
5426
+ onTalk: startDefaultSession,
5427
+ talkLabel: startSessionLabel,
5428
+ talkDisabled
5332
5429
  }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx19("div", {
5333
5430
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5334
5431
  children: /* @__PURE__ */ jsx19(LoadingDots, {
@@ -5348,35 +5445,31 @@ function AuthenticatedContent({
5348
5445
  isPaused,
5349
5446
  isPausing,
5350
5447
  isDisconnecting,
5351
- canResume,
5352
- onStartSession,
5353
- onResume,
5354
5448
  isStarting,
5355
5449
  error,
5356
5450
  activeTab,
5357
5451
  onTabChange,
5358
5452
  hideControls,
5359
- startSessionLabel,
5360
5453
  autoFocusChat,
5361
- agentId,
5362
- agentControls,
5363
- showAgenda
5454
+ showAgenda,
5455
+ idleHistory,
5456
+ onTalk,
5457
+ talkLabel,
5458
+ talkDisabled
5364
5459
  }) {
5365
5460
  const inSession = isConnected || isStarting || isPaused || isPausing;
5366
5461
  const effectiveTab = showAgenda ? activeTab : "chat";
5367
5462
  let transitionLabel = null;
5368
5463
  if (isStarting && !isConnected) {
5369
5464
  transitionLabel = "Reconnecting...";
5370
- } else if (isPaused) {
5371
- transitionLabel = "Paused";
5372
5465
  }
5373
- return /* @__PURE__ */ jsxs17(Fragment3, {
5466
+ return /* @__PURE__ */ jsxs16(Fragment3, {
5374
5467
  children: [
5375
5468
  isConnected && /* @__PURE__ */ jsx19(ConnectedBanner, {}),
5376
- showAgenda && /* @__PURE__ */ jsxs17("div", {
5469
+ showAgenda && /* @__PURE__ */ jsxs16("div", {
5377
5470
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-1",
5378
5471
  children: [
5379
- /* @__PURE__ */ jsxs17("button", {
5472
+ /* @__PURE__ */ jsxs16("button", {
5380
5473
  type: "button",
5381
5474
  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-1.5 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "chat" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
5382
5475
  onClick: () => onTabChange("chat"),
@@ -5390,7 +5483,7 @@ function AuthenticatedContent({
5390
5483
  })
5391
5484
  ]
5392
5485
  }),
5393
- /* @__PURE__ */ jsxs17("button", {
5486
+ /* @__PURE__ */ jsxs16("button", {
5394
5487
  type: "button",
5395
5488
  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-1.5 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "agenda" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
5396
5489
  onClick: () => onTabChange("agenda"),
@@ -5413,7 +5506,7 @@ function AuthenticatedContent({
5413
5506
  children: /* @__PURE__ */ jsx19(LoadingDots, {
5414
5507
  label: "Ending session..."
5415
5508
  })
5416
- }) : inSession ? /* @__PURE__ */ jsxs17(Fragment3, {
5509
+ }) : inSession ? /* @__PURE__ */ jsxs16(Fragment3, {
5417
5510
  children: [
5418
5511
  transitionLabel && /* @__PURE__ */ jsx19("div", {
5419
5512
  className: "skippr:shrink-0 skippr:border-b skippr:border-border skippr:bg-muted/50 skippr:px-3 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:text-muted-foreground",
@@ -5424,26 +5517,21 @@ function AuthenticatedContent({
5424
5517
  autoFocusChat
5425
5518
  })
5426
5519
  ]
5427
- }) : /* @__PURE__ */ jsx19("div", {
5428
- className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
5429
- children: /* @__PURE__ */ jsx19(StartSessionPrompt, {
5430
- onStartSession,
5431
- agentId,
5432
- agentControls,
5433
- isStarting,
5434
- error,
5435
- label: startSessionLabel,
5436
- canResume,
5437
- onResume
5438
- })
5439
- }, `${activeTab}-empty`)
5520
+ }) : /* @__PURE__ */ jsx19(IdleHistory, {
5521
+ activeTab: effectiveTab,
5522
+ history: idleHistory,
5523
+ onTalk,
5524
+ talkLabel,
5525
+ talkDisabled,
5526
+ error
5527
+ })
5440
5528
  }),
5441
5529
  !hideControls && /* @__PURE__ */ jsx19("div", {
5442
5530
  className: "skippr:shrink-0 skippr:border-t skippr:border-border",
5443
- children: /* @__PURE__ */ jsxs17("div", {
5531
+ children: /* @__PURE__ */ jsxs16("div", {
5444
5532
  className: "skippr:flex skippr:items-center skippr:justify-center skippr:gap-1 skippr:px-4 skippr:pt-1.5 skippr:pb-2 skippr:text-[10px] skippr:text-muted-foreground",
5445
5533
  children: [
5446
- /* @__PURE__ */ jsxs17("svg", {
5534
+ /* @__PURE__ */ jsxs16("svg", {
5447
5535
  viewBox: "21 21 109 109",
5448
5536
  className: "skippr:size-3",
5449
5537
  fill: "none",
@@ -5467,7 +5555,7 @@ function AuthenticatedContent({
5467
5555
  });
5468
5556
  }
5469
5557
  function AuthError() {
5470
- return /* @__PURE__ */ jsxs17("div", {
5558
+ return /* @__PURE__ */ jsxs16("div", {
5471
5559
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:px-6 skippr:py-4 skippr:text-center",
5472
5560
  children: [
5473
5561
  /* @__PURE__ */ jsx19(CircleAlert, {
@@ -5490,6 +5578,60 @@ function ConnectedBanner() {
5490
5578
  remaining
5491
5579
  });
5492
5580
  }
5581
+ function IdleHistory({
5582
+ activeTab,
5583
+ history: history2,
5584
+ onTalk,
5585
+ talkLabel,
5586
+ talkDisabled,
5587
+ error
5588
+ }) {
5589
+ if (history2.isLoading) {
5590
+ return /* @__PURE__ */ jsx19("div", {
5591
+ className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
5592
+ children: /* @__PURE__ */ jsx19(LoadingDots, {
5593
+ label: "Loading conversation..."
5594
+ })
5595
+ });
5596
+ }
5597
+ return /* @__PURE__ */ jsxs16("div", {
5598
+ className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
5599
+ children: [
5600
+ activeTab === "agenda" ? /* @__PURE__ */ jsx19("div", {
5601
+ className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto",
5602
+ children: /* @__PURE__ */ jsx19(SessionAgenda, {
5603
+ phases: history2.phases,
5604
+ hasStarted: history2.phases.length > 0
5605
+ })
5606
+ }) : /* @__PURE__ */ jsx19(MessageList, {
5607
+ messages: history2.messages,
5608
+ isStreaming: false,
5609
+ readOnly: true
5610
+ }),
5611
+ /* @__PURE__ */ jsxs16("div", {
5612
+ className: "skippr:shrink-0 skippr:border-t skippr:border-border skippr:p-3",
5613
+ children: [
5614
+ /* @__PURE__ */ jsxs16("button", {
5615
+ type: "button",
5616
+ onClick: onTalk,
5617
+ disabled: talkDisabled,
5618
+ className: "skippr:flex skippr:w-full skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:gap-2 skippr:rounded-xl skippr:bg-primary skippr:px-4 skippr:py-3 skippr:font-semibold skippr:text-[13px] skippr:text-primary-foreground skippr:transition-colors skippr:hover:bg-primary/90 skippr:disabled:cursor-not-allowed skippr:disabled:opacity-50",
5619
+ children: [
5620
+ /* @__PURE__ */ jsx19(Mic, {
5621
+ className: "skippr:size-4"
5622
+ }),
5623
+ talkLabel
5624
+ ]
5625
+ }),
5626
+ error && /* @__PURE__ */ jsx19("p", {
5627
+ className: "skippr:mt-2 skippr:text-center skippr:text-xs skippr:text-destructive",
5628
+ children: error
5629
+ })
5630
+ ]
5631
+ })
5632
+ ]
5633
+ }, `idle-${activeTab}`);
5634
+ }
5493
5635
  function ConnectedBody({
5494
5636
  activeTab,
5495
5637
  autoFocusChat
@@ -5497,7 +5639,8 @@ function ConnectedBody({
5497
5639
  const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
5498
5640
  const { phases } = usePhaseUpdates();
5499
5641
  const plan = usePlanUpdates();
5500
- const { agentControls } = useLiveAgent();
5642
+ const { agentControls, isPaused } = useLiveAgent();
5643
+ const { isHeld } = useSessionHoldContext();
5501
5644
  if (activeTab === "agenda") {
5502
5645
  return /* @__PURE__ */ jsx19("div", {
5503
5646
  className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
@@ -5515,18 +5658,19 @@ function ConnectedBody({
5515
5658
  sendChatMessage,
5516
5659
  isSendingChat,
5517
5660
  plan: agentControls?.actions ? plan : null,
5518
- autoFocus: autoFocusChat
5661
+ autoFocus: autoFocusChat,
5662
+ readOnly: isPaused || isHeld
5519
5663
  })
5520
5664
  }, "chat");
5521
5665
  }
5522
5666
 
5523
5667
  // src/components/SidebarTrigger.tsx
5524
- import { useContext as useContext11 } from "react";
5668
+ import { useContext as useContext12 } from "react";
5525
5669
 
5526
5670
  // src/components/Logo.tsx
5527
- import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
5671
+ import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
5528
5672
  function Logo({ className }) {
5529
- return /* @__PURE__ */ jsxs18("svg", {
5673
+ return /* @__PURE__ */ jsxs17("svg", {
5530
5674
  width: "1em",
5531
5675
  height: "1em",
5532
5676
  viewBox: "0 0 200 200",
@@ -5542,7 +5686,7 @@ function Logo({ className }) {
5542
5686
  rx: "40",
5543
5687
  fill: "#2D2D3F"
5544
5688
  }),
5545
- /* @__PURE__ */ jsxs18("g", {
5689
+ /* @__PURE__ */ jsxs17("g", {
5546
5690
  transform: "translate(100 100) scale(0.8) translate(-100 -100)",
5547
5691
  children: [
5548
5692
  /* @__PURE__ */ jsx20("path", {
@@ -5573,7 +5717,7 @@ function SidebarTrigger() {
5573
5717
  isStarting,
5574
5718
  isPausing
5575
5719
  } = useLiveAgent();
5576
- const internalCtx = useContext11(LiveAgentContext);
5720
+ const internalCtx = useContext12(LiveAgentContext);
5577
5721
  const launcherBottomPx = internalCtx?.launcherBottomPx ?? DEFAULT_LAUNCHER_BOTTOM_PX;
5578
5722
  const popsDown = internalCtx?.popsDown ?? false;
5579
5723
  if (isMinimized || isConnected || isStarting || isPausing)
@@ -5595,7 +5739,7 @@ function SidebarTrigger() {
5595
5739
  }
5596
5740
 
5597
5741
  // src/components/LiveAgent.tsx
5598
- import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
5742
+ import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
5599
5743
  function readSavedLauncherBottom() {
5600
5744
  try {
5601
5745
  const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
@@ -5614,7 +5758,7 @@ function PlanPanelOpener() {
5614
5758
  const plan = usePlanUpdates();
5615
5759
  const { expandPanel } = useLiveAgent();
5616
5760
  const surfacedPlanIdRef = useRef17(null);
5617
- useEffect25(() => {
5761
+ useEffect26(() => {
5618
5762
  if (plan?.state !== "proposed" || surfacedPlanIdRef.current === plan.planId)
5619
5763
  return;
5620
5764
  surfacedPlanIdRef.current = plan.planId;
@@ -5654,7 +5798,7 @@ function LiveAgent(props) {
5654
5798
  const auth = useAuth({ appKey });
5655
5799
  const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
5656
5800
  const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
5657
- const [activeModule, setActiveModule] = useState18(null);
5801
+ const [activeModule, setActiveModule] = useState19(null);
5658
5802
  const minimizeOnSessionStart = useCallback15(() => {
5659
5803
  if (minimizable) {
5660
5804
  setIsMinimized(true);
@@ -5708,27 +5852,28 @@ function LiveAgent(props) {
5708
5852
  disconnect();
5709
5853
  }, [disconnect]);
5710
5854
  const isSessionLive = connection !== null || isStarting || isPausing || isDisconnecting;
5711
- const [isPanelOpen, setIsPanelOpen] = useState18(defaultOpen);
5712
- const [isMinimized, setIsMinimized] = useState18(minimizable && !defaultOpen);
5713
- const [sidebarTab, setSidebarTab] = useState18("agenda");
5714
- const [phasesSnapshot, setPhasesSnapshot] = useState18([]);
5715
- const [textMode, setTextMode] = useState18(false);
5716
- const [panelExpanded, setPanelExpanded] = useState18(false);
5855
+ const [isPanelOpen, setIsPanelOpen] = useState19(defaultOpen);
5856
+ const [isMinimized, setIsMinimized] = useState19(minimizable && !defaultOpen);
5857
+ const [sidebarTab, setSidebarTab] = useState19("agenda");
5858
+ const [phasesSnapshot, setPhasesSnapshot] = useState19([]);
5859
+ const [textMode, setTextMode] = useState19(false);
5860
+ const [panelExpanded, setPanelExpanded] = useState19(false);
5717
5861
  const togglePanelExpanded = useCallback15(() => setPanelExpanded((prev) => !prev), []);
5718
5862
  const panelRef = useRef17(null);
5719
5863
  const controlBarRef = useRef17(null);
5720
- const [isDragging, setIsDragging] = useState18(false);
5864
+ const [isDragging, setIsDragging] = useState19(false);
5721
5865
  const setTextModeState = useCallback15((enabled) => {
5722
5866
  setTextMode(enabled);
5723
5867
  }, []);
5724
5868
  const isConnected = connection !== null;
5725
5869
  const showControlBar = isConnected || isStarting || isPausing;
5726
- useEffect25(() => {
5870
+ useEffect26(() => {
5727
5871
  if (!isConnected)
5728
5872
  setTextModeState(false);
5729
5873
  }, [isConnected, setTextModeState]);
5730
5874
  const {
5731
5875
  modules: availableModules,
5876
+ defaultSelection,
5732
5877
  isLoading: isLoadingModules,
5733
5878
  hasResolved: hasResolvedModules,
5734
5879
  error: modulesError,
@@ -5736,15 +5881,15 @@ function LiveAgent(props) {
5736
5881
  } = useAvailableModules({
5737
5882
  enabled: !isSessionLive,
5738
5883
  bearerToken,
5739
- authedFetch
5884
+ authedFetch,
5885
+ agentId: hostAgentId ?? undefined
5740
5886
  });
5741
5887
  const { goals: adoptionGoals, attendGoal } = useAdoptionGoals({
5742
5888
  enabled: !isSessionLive,
5743
5889
  bearerToken,
5744
5890
  authedFetch
5745
5891
  });
5746
- const displayModules = useMemo6(() => hostAgentId ? availableModules.filter((m) => m.id === hostAgentId) : availableModules, [hostAgentId, availableModules]);
5747
- const operatingModule = activeModule ?? (hostAgentId ? displayModules[0] ?? null : null);
5892
+ const operatingModule = activeModule ?? (hostAgentId ? availableModules[0] ?? null : null);
5748
5893
  const agentId = operatingModule?.id ?? null;
5749
5894
  const agentControls = operatingModule?.controls ?? hostAgentControls;
5750
5895
  const agentMode = operatingModule?.mode ?? null;
@@ -5781,9 +5926,9 @@ function LiveAgent(props) {
5781
5926
  adoptionGoalId: goal.goalId
5782
5927
  });
5783
5928
  }, [attendGoal, availableModules, startSession]);
5784
- const [welcomeDismissed, setWelcomeDismissed] = useState18(false);
5929
+ const [welcomeDismissed, setWelcomeDismissed] = useState19(false);
5785
5930
  const dismissWelcome = useCallback15(() => setWelcomeDismissed(true), []);
5786
- const [currentPosition, setCurrentPosition] = useState18(() => {
5931
+ const [currentPosition, setCurrentPosition] = useState19(() => {
5787
5932
  try {
5788
5933
  const saved = localStorage.getItem("skippr_widget_position");
5789
5934
  if (saved === "left" || saved === "right")
@@ -5800,8 +5945,8 @@ function LiveAgent(props) {
5800
5945
  const savedLauncherBottom = readSavedLauncherBottom();
5801
5946
  const hasDraggedRef = useRef17(savedLauncherBottom !== null);
5802
5947
  const verticalAlignRef = useRef17(verticalAlign);
5803
- const [launcherBottomPx, setLauncherBottomPxState] = useState18(() => savedLauncherBottom !== null ? clampLauncherBottom(savedLauncherBottom) : verticalAlignToBottomPx(verticalAlign));
5804
- const [popsDown, setPopsDown] = useState18(() => launcherPopsDown(launcherBottomPx));
5948
+ const [launcherBottomPx, setLauncherBottomPxState] = useState19(() => savedLauncherBottom !== null ? clampLauncherBottom(savedLauncherBottom) : verticalAlignToBottomPx(verticalAlign));
5949
+ const [popsDown, setPopsDown] = useState19(() => launcherPopsDown(launcherBottomPx));
5805
5950
  const setLauncherBottomPx = useCallback15((px) => {
5806
5951
  hasDraggedRef.current = true;
5807
5952
  setLauncherBottomPxState(px);
@@ -5816,7 +5961,7 @@ function LiveAgent(props) {
5816
5961
  setPositionWithPersist(side);
5817
5962
  setLauncherBottomPx(bottomPx);
5818
5963
  }, [setPositionWithPersist, setLauncherBottomPx]);
5819
- useEffect25(() => {
5964
+ useEffect26(() => {
5820
5965
  const syncToViewport = () => {
5821
5966
  const next = hasDraggedRef.current ? clampLauncherBottom(launcherBottomPxRef.current) : verticalAlignToBottomPx(verticalAlignRef.current);
5822
5967
  setLauncherBottomPxState(next);
@@ -5844,6 +5989,32 @@ function LiveAgent(props) {
5844
5989
  minimizePanel();
5845
5990
  }, [pauseSession, minimizePanel]);
5846
5991
  const isAuthenticated = bearerToken !== null || auth.isAuthenticated;
5992
+ const defaultAgentId = hostAgentId ?? defaultSelection.agentId;
5993
+ const startDefaultSession = useCallback15(() => {
5994
+ const target = availableModules.find((m) => m.id === defaultAgentId);
5995
+ if (!target)
5996
+ return;
5997
+ startSession({
5998
+ agentId: target.id,
5999
+ agentControls: target.controls,
6000
+ existingSessionId: defaultSelection.sessionId ?? undefined
6001
+ });
6002
+ }, [defaultAgentId, availableModules, defaultSelection.sessionId, startSession]);
6003
+ const idleHistoryEnabled = !isSessionLive && !isPaused && isPanelOpen && isAuthenticated;
6004
+ const {
6005
+ messages: idleHistoryMessages,
6006
+ phases: idleHistoryPhases,
6007
+ isLoading: isLoadingHistory
6008
+ } = useSessionHistory({
6009
+ agentId: defaultAgentId ?? undefined,
6010
+ enabled: idleHistoryEnabled,
6011
+ authedFetch
6012
+ });
6013
+ const idleHistory = useMemo6(() => ({
6014
+ messages: idleHistoryMessages,
6015
+ phases: idleHistoryPhases,
6016
+ isLoading: isLoadingHistory
6017
+ }), [idleHistoryMessages, idleHistoryPhases, isLoadingHistory]);
5847
6018
  const ctx = useMemo6(() => ({
5848
6019
  connection,
5849
6020
  shouldConnect,
@@ -5861,6 +6032,7 @@ function LiveAgent(props) {
5861
6032
  pauseTimeoutSeconds,
5862
6033
  resumableSession,
5863
6034
  historyMessages,
6035
+ idleHistory,
5864
6036
  phasesSnapshot,
5865
6037
  setPhasesSnapshot,
5866
6038
  isPanelOpen,
@@ -5902,8 +6074,10 @@ function LiveAgent(props) {
5902
6074
  agentId,
5903
6075
  agentMode,
5904
6076
  agentControls,
5905
- displayModules,
6077
+ displayModules: availableModules,
5906
6078
  activeModule,
6079
+ defaultAgentId,
6080
+ startDefaultSession,
5907
6081
  isLoadingModules,
5908
6082
  modulesError,
5909
6083
  refetchModules,
@@ -5928,6 +6102,7 @@ function LiveAgent(props) {
5928
6102
  pauseTimeoutSeconds,
5929
6103
  resumableSession,
5930
6104
  historyMessages,
6105
+ idleHistory,
5931
6106
  phasesSnapshot,
5932
6107
  isPanelOpen,
5933
6108
  openPanel,
@@ -5964,8 +6139,10 @@ function LiveAgent(props) {
5964
6139
  agentId,
5965
6140
  agentMode,
5966
6141
  agentControls,
5967
- displayModules,
6142
+ availableModules,
5968
6143
  activeModule,
6144
+ defaultAgentId,
6145
+ startDefaultSession,
5969
6146
  isLoadingModules,
5970
6147
  modulesError,
5971
6148
  refetchModules,
@@ -5976,7 +6153,7 @@ function LiveAgent(props) {
5976
6153
  ]);
5977
6154
  return /* @__PURE__ */ jsx22(LiveAgentContext.Provider, {
5978
6155
  value: ctx,
5979
- children: /* @__PURE__ */ jsxs19(LiveKitRoom, {
6156
+ children: /* @__PURE__ */ jsxs18(LiveKitRoom, {
5980
6157
  serverUrl: connection?.livekitUrl,
5981
6158
  token: connection?.token,
5982
6159
  connect: shouldConnect,
@@ -5988,7 +6165,7 @@ function LiveAgent(props) {
5988
6165
  pendingScreenStream
5989
6166
  }),
5990
6167
  connection && captureMode === CAPTURE_MODE.Auto && /* @__PURE__ */ jsx22(DomCapture, {}),
5991
- /* @__PURE__ */ jsxs19(ShadowHost, {
6168
+ /* @__PURE__ */ jsxs18(ShadowHost, {
5992
6169
  children: [
5993
6170
  connection && captureMode === CAPTURE_MODE.Auto && agentControls?.highlight && /* @__PURE__ */ jsx22(HighlightOverlay, {}),
5994
6171
  connection && captureMode === CAPTURE_MODE.Auto && agentControls?.actions && /* @__PURE__ */ jsx22(PageActionHandler, {}),
@@ -5996,22 +6173,24 @@ function LiveAgent(props) {
5996
6173
  connection && captureMode === CAPTURE_MODE.Auto && (agentControls?.highlight || agentControls?.actions) && /* @__PURE__ */ jsx22(AgentCursorMount, {
5997
6174
  animated: shouldAnimateCursor
5998
6175
  }),
5999
- /* @__PURE__ */ jsxs19("div", {
6000
- id: WIDGET_ROOT_ID,
6001
- children: [
6002
- isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
6003
- welcomeMessage,
6004
- welcomeDismissed,
6005
- onDismissWelcome: dismissWelcome
6006
- }),
6007
- showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
6008
- /* @__PURE__ */ jsx22(SidebarTrigger, {}),
6009
- /* @__PURE__ */ jsx22(Sidebar, {
6010
- hideControls,
6011
- hideHeader,
6012
- startSessionLabel
6013
- })
6014
- ]
6176
+ /* @__PURE__ */ jsx22(SessionHoldProvider, {
6177
+ children: /* @__PURE__ */ jsxs18("div", {
6178
+ id: WIDGET_ROOT_ID,
6179
+ children: [
6180
+ isMinimized && !showControlBar && /* @__PURE__ */ jsx22(MinimizedBubble, {
6181
+ welcomeMessage,
6182
+ welcomeDismissed,
6183
+ onDismissWelcome: dismissWelcome
6184
+ }),
6185
+ showControlBar && !hideControls && /* @__PURE__ */ jsx22(SessionControlBar, {}),
6186
+ /* @__PURE__ */ jsx22(SidebarTrigger, {}),
6187
+ /* @__PURE__ */ jsx22(Sidebar, {
6188
+ hideControls,
6189
+ hideHeader,
6190
+ startSessionLabel
6191
+ })
6192
+ ]
6193
+ })
6015
6194
  })
6016
6195
  ]
6017
6196
  }),