@skippr/live-agent-sdk 0.83.0 → 0.84.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.
- package/README.md +1 -2
- package/dist/esm/lib-exports.js +239 -150
- package/dist/skippr-sdk.css +1 -1
- package/dist/skippr-sdk.js +142 -142
- package/dist/types/components/LiveAgent.d.ts +0 -1
- package/dist/types/components/ShadowHost.d.ts +2 -1
- package/dist/types/context/LiveAgentContext.d.ts +7 -0
- package/dist/types/hooks/useAuth.d.ts +1 -0
- package/dist/types/hooks/useAvailableModules.d.ts +2 -1
- package/dist/types/hooks/useOnceTrue.d.ts +1 -0
- package/dist/types/lib/brandForeground.d.ts +2 -0
- package/package.json +1 -1
package/dist/esm/lib-exports.js
CHANGED
|
@@ -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 useCallback18, useEffect as
|
|
11
|
+
import { useCallback as useCallback18, useEffect as useEffect30, useMemo as useMemo7, useRef as useRef25, useState as useState22 } from "react";
|
|
12
12
|
|
|
13
13
|
// src/capture/useAgentCursor.ts
|
|
14
14
|
import { useEffect, useState } from "react";
|
|
@@ -599,15 +599,20 @@ function clearStoredToken(appKey) {
|
|
|
599
599
|
function useAuth({ appKey }) {
|
|
600
600
|
const [authToken, setAuthToken] = useState5(null);
|
|
601
601
|
const [isValidating, setIsValidating] = useState5(false);
|
|
602
|
+
const [hasResolvedStoredToken, setHasResolvedStoredToken] = useState5(false);
|
|
602
603
|
const [isSubmitting, setIsSubmitting] = useState5(false);
|
|
603
604
|
const [error, setError] = useState5("");
|
|
604
605
|
const isAuthenticated = authToken !== null;
|
|
605
606
|
useEffect4(() => {
|
|
606
|
-
if (!appKey)
|
|
607
|
+
if (!appKey) {
|
|
608
|
+
setHasResolvedStoredToken(true);
|
|
607
609
|
return;
|
|
610
|
+
}
|
|
608
611
|
const stored = getStoredToken(appKey);
|
|
609
|
-
if (!stored)
|
|
612
|
+
if (!stored) {
|
|
613
|
+
setHasResolvedStoredToken(true);
|
|
610
614
|
return;
|
|
615
|
+
}
|
|
611
616
|
async function validateStoredToken() {
|
|
612
617
|
setIsValidating(true);
|
|
613
618
|
try {
|
|
@@ -624,6 +629,7 @@ function useAuth({ appKey }) {
|
|
|
624
629
|
clearStoredToken(appKey);
|
|
625
630
|
} finally {
|
|
626
631
|
setIsValidating(false);
|
|
632
|
+
setHasResolvedStoredToken(true);
|
|
627
633
|
}
|
|
628
634
|
}
|
|
629
635
|
validateStoredToken();
|
|
@@ -713,6 +719,7 @@ function useAuth({ appKey }) {
|
|
|
713
719
|
return {
|
|
714
720
|
isAuthenticated,
|
|
715
721
|
isValidating,
|
|
722
|
+
hasResolvedStoredToken,
|
|
716
723
|
authToken,
|
|
717
724
|
requestOtp,
|
|
718
725
|
verifyOtp,
|
|
@@ -853,6 +860,7 @@ function useAvailableModules({
|
|
|
853
860
|
}) {
|
|
854
861
|
const [modules, setModules] = useState6([]);
|
|
855
862
|
const [defaultSelection, setDefaultSelection] = useState6(EMPTY_DEFAULT);
|
|
863
|
+
const [appearance, setAppearance] = useState6(null);
|
|
856
864
|
const [isLoading, setIsLoading] = useState6(false);
|
|
857
865
|
const [hasResolved, setHasResolved] = useState6(false);
|
|
858
866
|
const [error, setError] = useState6(null);
|
|
@@ -870,6 +878,7 @@ function useAvailableModules({
|
|
|
870
878
|
const data = await resp.json();
|
|
871
879
|
setModules(Array.isArray(data?.modules) ? data.modules : []);
|
|
872
880
|
setDefaultSelection(data?.default ?? EMPTY_DEFAULT);
|
|
881
|
+
setAppearance(data?.appearance ?? null);
|
|
873
882
|
} catch (e) {
|
|
874
883
|
setError(e instanceof Error ? e.message : "Failed to load modules");
|
|
875
884
|
} finally {
|
|
@@ -885,6 +894,7 @@ function useAvailableModules({
|
|
|
885
894
|
return {
|
|
886
895
|
modules,
|
|
887
896
|
defaultSelection,
|
|
897
|
+
appearance,
|
|
888
898
|
isLoading,
|
|
889
899
|
hasResolved,
|
|
890
900
|
error,
|
|
@@ -892,16 +902,27 @@ function useAvailableModules({
|
|
|
892
902
|
};
|
|
893
903
|
}
|
|
894
904
|
|
|
905
|
+
// src/hooks/useOnceTrue.ts
|
|
906
|
+
import { useEffect as useEffect7, useState as useState7 } from "react";
|
|
907
|
+
function useOnceTrue(value) {
|
|
908
|
+
const [latched, setLatched] = useState7(false);
|
|
909
|
+
useEffect7(() => {
|
|
910
|
+
if (value)
|
|
911
|
+
setLatched(true);
|
|
912
|
+
}, [value]);
|
|
913
|
+
return latched;
|
|
914
|
+
}
|
|
915
|
+
|
|
895
916
|
// src/hooks/usePlanUpdates.ts
|
|
896
917
|
import { useCallback as useCallback7 } from "react";
|
|
897
918
|
|
|
898
919
|
// src/hooks/useAgentState.ts
|
|
899
920
|
import { useRemoteParticipants } from "@livekit/components-react/hooks";
|
|
900
|
-
import { useEffect as
|
|
921
|
+
import { useEffect as useEffect8, useState as useState8 } from "react";
|
|
901
922
|
function useAgentState(attributeKey, parse, initial) {
|
|
902
|
-
const [value, setValue] =
|
|
923
|
+
const [value, setValue] = useState8(initial);
|
|
903
924
|
const remoteParticipants = useRemoteParticipants();
|
|
904
|
-
|
|
925
|
+
useEffect8(() => {
|
|
905
926
|
const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
|
|
906
927
|
if (agentParticipant) {
|
|
907
928
|
const attr = agentParticipant.attributes?.[attributeKey];
|
|
@@ -952,7 +973,7 @@ function usePlanUpdates() {
|
|
|
952
973
|
}
|
|
953
974
|
|
|
954
975
|
// src/hooks/useSession.ts
|
|
955
|
-
import { useCallback as useCallback8, useEffect as
|
|
976
|
+
import { useCallback as useCallback8, useEffect as useEffect9, useRef as useRef4, useState as useState9 } from "react";
|
|
956
977
|
var API_URL4 = "https://specialist.skippr.ai/api";
|
|
957
978
|
async function fetchSessionMessages(sessionId, authedFetch) {
|
|
958
979
|
try {
|
|
@@ -1004,20 +1025,20 @@ function useSession({
|
|
|
1004
1025
|
onStartError,
|
|
1005
1026
|
onDisconnect
|
|
1006
1027
|
}) {
|
|
1007
|
-
const [connection, setConnection] =
|
|
1008
|
-
const [shouldConnect, setShouldConnect] =
|
|
1009
|
-
const [isStarting, setIsStarting] =
|
|
1010
|
-
const [isDisconnecting, setIsDisconnecting] =
|
|
1011
|
-
const [error, setError] =
|
|
1012
|
-
const [errorCode, setErrorCode] =
|
|
1013
|
-
const [sessionId, setSessionId] =
|
|
1014
|
-
const [bearerToken, setBearerToken] =
|
|
1015
|
-
const [pendingScreenStream, setPendingScreenStream] =
|
|
1016
|
-
const [isPaused, setIsPaused] =
|
|
1017
|
-
const [isPausing, setIsPausing] =
|
|
1018
|
-
const [pauseTimeoutSeconds, setPauseTimeoutSeconds] =
|
|
1019
|
-
const [historyMessages, setHistoryMessages] =
|
|
1020
|
-
const [authFailed, setAuthFailed] =
|
|
1028
|
+
const [connection, setConnection] = useState9(null);
|
|
1029
|
+
const [shouldConnect, setShouldConnect] = useState9(false);
|
|
1030
|
+
const [isStarting, setIsStarting] = useState9(false);
|
|
1031
|
+
const [isDisconnecting, setIsDisconnecting] = useState9(false);
|
|
1032
|
+
const [error, setError] = useState9("");
|
|
1033
|
+
const [errorCode, setErrorCode] = useState9(null);
|
|
1034
|
+
const [sessionId, setSessionId] = useState9(null);
|
|
1035
|
+
const [bearerToken, setBearerToken] = useState9(authToken ?? null);
|
|
1036
|
+
const [pendingScreenStream, setPendingScreenStream] = useState9(null);
|
|
1037
|
+
const [isPaused, setIsPaused] = useState9(false);
|
|
1038
|
+
const [isPausing, setIsPausing] = useState9(false);
|
|
1039
|
+
const [pauseTimeoutSeconds, setPauseTimeoutSeconds] = useState9(null);
|
|
1040
|
+
const [historyMessages, setHistoryMessages] = useState9([]);
|
|
1041
|
+
const [authFailed, setAuthFailed] = useState9(false);
|
|
1021
1042
|
const tokenRef = useRef4(authToken ? { token: authToken, expiresAt: null } : null);
|
|
1022
1043
|
const getUserTokenRef = useRef4(getUserToken);
|
|
1023
1044
|
getUserTokenRef.current = getUserToken ?? (userToken ? () => Promise.resolve(userToken) : undefined);
|
|
@@ -1098,7 +1119,7 @@ function useSession({
|
|
|
1098
1119
|
setAuthFailed(false);
|
|
1099
1120
|
return resp;
|
|
1100
1121
|
}, [canExchange, getValidBearer, reExchange]);
|
|
1101
|
-
|
|
1122
|
+
useEffect9(() => {
|
|
1102
1123
|
let stale = false;
|
|
1103
1124
|
if (authToken) {
|
|
1104
1125
|
tokenRef.current = { token: authToken, expiresAt: null };
|
|
@@ -1120,7 +1141,7 @@ function useSession({
|
|
|
1120
1141
|
const isStartingRef = useRef4(false);
|
|
1121
1142
|
const pauseOnUnloadRef = useRef4(null);
|
|
1122
1143
|
pauseOnUnloadRef.current = connection !== null && !isPaused && sessionId && bearerToken ? { sessionId, bearerToken } : null;
|
|
1123
|
-
|
|
1144
|
+
useEffect9(() => {
|
|
1124
1145
|
const onPageHide = () => {
|
|
1125
1146
|
const pending = pauseOnUnloadRef.current;
|
|
1126
1147
|
if (!pending)
|
|
@@ -1301,7 +1322,7 @@ function useSession({
|
|
|
1301
1322
|
}
|
|
1302
1323
|
|
|
1303
1324
|
// src/hooks/useSessionHistory.ts
|
|
1304
|
-
import { useEffect as
|
|
1325
|
+
import { useEffect as useEffect10, useState as useState10 } from "react";
|
|
1305
1326
|
var API_URL5 = "https://specialist.skippr.ai/api";
|
|
1306
1327
|
var EMPTY = { messages: [], phases: [] };
|
|
1307
1328
|
function useSessionHistory({
|
|
@@ -1309,11 +1330,11 @@ function useSessionHistory({
|
|
|
1309
1330
|
enabled,
|
|
1310
1331
|
authedFetch
|
|
1311
1332
|
}) {
|
|
1312
|
-
const [history2, setHistory] =
|
|
1313
|
-
const [loadedAgentId, setLoadedAgentId] =
|
|
1333
|
+
const [history2, setHistory] = useState10(EMPTY);
|
|
1334
|
+
const [loadedAgentId, setLoadedAgentId] = useState10(null);
|
|
1314
1335
|
const activeAgentId = enabled && agentId ? agentId : null;
|
|
1315
1336
|
const isLoading = activeAgentId !== null && activeAgentId !== loadedAgentId;
|
|
1316
|
-
|
|
1337
|
+
useEffect10(() => {
|
|
1317
1338
|
if (!enabled || !agentId) {
|
|
1318
1339
|
setHistory(EMPTY);
|
|
1319
1340
|
setLoadedAgentId(null);
|
|
@@ -1661,7 +1682,7 @@ var __iconNode24 = [
|
|
|
1661
1682
|
];
|
|
1662
1683
|
var X = createLucideIcon("x", __iconNode24);
|
|
1663
1684
|
// src/components/AgentCursor.tsx
|
|
1664
|
-
import { useContext as useContext6, useEffect as
|
|
1685
|
+
import { useContext as useContext6, useEffect as useEffect11, useLayoutEffect, useRef as useRef5, useState as useState11 } from "react";
|
|
1665
1686
|
|
|
1666
1687
|
// src/capture/elementRef.ts
|
|
1667
1688
|
function safeGetIframeDocument(iframe) {
|
|
@@ -1800,7 +1821,7 @@ function traceRing(path, durationMs, onFrame, onDone) {
|
|
|
1800
1821
|
// src/components/AgentCursor.tsx
|
|
1801
1822
|
import { jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
1802
1823
|
var Z_INDEX = 2147483646;
|
|
1803
|
-
var
|
|
1824
|
+
var BRAND_COLOR = "var(--skippr-brand, #2bc0ae)";
|
|
1804
1825
|
var GLIDE_EASE = "cubic-bezier(0.45, 0, 0.25, 1)";
|
|
1805
1826
|
var GLIDE_MIN_MS = 900;
|
|
1806
1827
|
var GLIDE_MAX_MS = 1500;
|
|
@@ -1844,11 +1865,11 @@ function AgentCursor({
|
|
|
1844
1865
|
animated = false
|
|
1845
1866
|
}) {
|
|
1846
1867
|
const ctx = useContext6(LiveAgentContext);
|
|
1847
|
-
const [cursor, setCursor] =
|
|
1848
|
-
const [glideMs, setGlideMs] =
|
|
1849
|
-
const [phase, setPhase] =
|
|
1850
|
-
const [ringBox, setRingBox] =
|
|
1851
|
-
const [clickPulse, setClickPulse] =
|
|
1868
|
+
const [cursor, setCursor] = useState11(null);
|
|
1869
|
+
const [glideMs, setGlideMs] = useState11(0);
|
|
1870
|
+
const [phase, setPhase] = useState11("idle");
|
|
1871
|
+
const [ringBox, setRingBox] = useState11(null);
|
|
1872
|
+
const [clickPulse, setClickPulse] = useState11(0);
|
|
1852
1873
|
const cursorElRef = useRef5(null);
|
|
1853
1874
|
const pathRef = useRef5(null);
|
|
1854
1875
|
const prevCursorRef = useRef5(null);
|
|
@@ -1971,7 +1992,7 @@ function AgentCursor({
|
|
|
1971
1992
|
});
|
|
1972
1993
|
return cancelAnimation;
|
|
1973
1994
|
}, [target, animated]);
|
|
1974
|
-
|
|
1995
|
+
useEffect11(() => {
|
|
1975
1996
|
if (!target || target.kind === "gesture" || phase === "idle")
|
|
1976
1997
|
return;
|
|
1977
1998
|
const track = () => {
|
|
@@ -2003,7 +2024,7 @@ function AgentCursor({
|
|
|
2003
2024
|
}
|
|
2004
2025
|
};
|
|
2005
2026
|
}, [target, phase]);
|
|
2006
|
-
|
|
2027
|
+
useEffect11(() => {
|
|
2007
2028
|
return () => {
|
|
2008
2029
|
traceRef.current?.cancel();
|
|
2009
2030
|
for (const t of timersRef.current)
|
|
@@ -2027,7 +2048,7 @@ function AgentCursor({
|
|
|
2027
2048
|
ref: pathRef,
|
|
2028
2049
|
d: ringPathD(ringBox),
|
|
2029
2050
|
fill: "none",
|
|
2030
|
-
stroke:
|
|
2051
|
+
stroke: BRAND_COLOR,
|
|
2031
2052
|
strokeWidth: 2,
|
|
2032
2053
|
strokeLinecap: "round",
|
|
2033
2054
|
style: { strokeDasharray: "0 99999" }
|
|
@@ -2038,13 +2059,13 @@ function AgentCursor({
|
|
|
2038
2059
|
className: "skippr:relative",
|
|
2039
2060
|
children: [
|
|
2040
2061
|
/* @__PURE__ */ jsx4("div", {
|
|
2041
|
-
className: "skippr:absolute skippr:inset-0 skippr:rounded-[1rem] skippr:border-2 skippr:border-
|
|
2062
|
+
className: "skippr:absolute skippr:inset-0 skippr:rounded-[1rem] skippr:border-2 skippr:border-brand skippr:animate-skippr-annotation-pulse"
|
|
2042
2063
|
}),
|
|
2043
2064
|
/* @__PURE__ */ jsx4("div", {
|
|
2044
2065
|
role: "status",
|
|
2045
|
-
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-
|
|
2066
|
+
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-brand skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
|
|
2046
2067
|
children: /* @__PURE__ */ jsx4("span", {
|
|
2047
|
-
className: "skippr:text-[11px] skippr:font-medium skippr:text-
|
|
2068
|
+
className: "skippr:text-[11px] skippr:font-medium skippr:text-primary-foreground skippr:whitespace-nowrap",
|
|
2048
2069
|
children: target.label
|
|
2049
2070
|
})
|
|
2050
2071
|
})
|
|
@@ -2052,7 +2073,7 @@ function AgentCursor({
|
|
|
2052
2073
|
}),
|
|
2053
2074
|
target.kind === "gesture" && /* @__PURE__ */ jsx4("div", {
|
|
2054
2075
|
role: "status",
|
|
2055
|
-
className: "skippr:fixed skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-
|
|
2076
|
+
className: "skippr:fixed skippr:-translate-x-1/2 skippr:flex skippr:items-center skippr:gap-1.5 skippr:rounded-full skippr:bg-brand skippr:px-2.5 skippr:py-1 skippr:shadow-[0_4px_12px_rgba(0,0,0,0.12)]",
|
|
2056
2077
|
style: {
|
|
2057
2078
|
left: `${cursor.x}px`,
|
|
2058
2079
|
top: `${cursor.y + 18}px`,
|
|
@@ -2061,7 +2082,7 @@ function AgentCursor({
|
|
|
2061
2082
|
transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
|
|
2062
2083
|
},
|
|
2063
2084
|
children: /* @__PURE__ */ jsx4("span", {
|
|
2064
|
-
className: "skippr:text-[11px] skippr:font-medium skippr:text-
|
|
2085
|
+
className: "skippr:text-[11px] skippr:font-medium skippr:text-primary-foreground skippr:whitespace-nowrap",
|
|
2065
2086
|
children: target.label
|
|
2066
2087
|
})
|
|
2067
2088
|
}),
|
|
@@ -2076,12 +2097,12 @@ function AgentCursor({
|
|
|
2076
2097
|
transition: `left ${glideMs}ms ${GLIDE_EASE}, top ${glideMs}ms ${GLIDE_EASE}`
|
|
2077
2098
|
},
|
|
2078
2099
|
children: /* @__PURE__ */ jsx4(MousePointer2, {
|
|
2079
|
-
className: `skippr:h-5 skippr:w-5 skippr:text-
|
|
2100
|
+
className: `skippr:h-5 skippr:w-5 skippr:text-brand skippr:drop-shadow-[0_2px_5px_rgba(0,0,0,0.4)] ${clickPulse > 0 ? "skippr:animate-skippr-press" : "skippr:animate-skippr-cursor-pop"}`,
|
|
2080
2101
|
fill: "currentColor"
|
|
2081
2102
|
}, clickPulse)
|
|
2082
2103
|
}),
|
|
2083
2104
|
clickPulse > 0 && rippleCenter && /* @__PURE__ */ jsx4("span", {
|
|
2084
|
-
className: "skippr:fixed skippr:h-7 skippr:w-7 skippr:rounded-full skippr:bg-
|
|
2105
|
+
className: "skippr:fixed skippr:h-7 skippr:w-7 skippr:rounded-full skippr:bg-brand/50 skippr:animate-skippr-click-ping",
|
|
2085
2106
|
style: {
|
|
2086
2107
|
left: `${rippleCenter.x}px`,
|
|
2087
2108
|
top: `${rippleCenter.y}px`,
|
|
@@ -2096,7 +2117,7 @@ function AgentCursor({
|
|
|
2096
2117
|
// src/components/AutoStartMedia.tsx
|
|
2097
2118
|
import { useConnectionState, useLocalParticipant as useLocalParticipant4 } from "@livekit/components-react/hooks";
|
|
2098
2119
|
import { ConnectionState, Track as Track2 } from "livekit-client";
|
|
2099
|
-
import { useEffect as
|
|
2120
|
+
import { useEffect as useEffect12, useRef as useRef6 } from "react";
|
|
2100
2121
|
function AutoStartMedia({
|
|
2101
2122
|
pendingScreenStream,
|
|
2102
2123
|
pushOrTapMicMode = false
|
|
@@ -2104,7 +2125,7 @@ function AutoStartMedia({
|
|
|
2104
2125
|
const { localParticipant } = useLocalParticipant4();
|
|
2105
2126
|
const connectionState = useConnectionState();
|
|
2106
2127
|
const didStartRef = useRef6(false);
|
|
2107
|
-
|
|
2128
|
+
useEffect12(() => {
|
|
2108
2129
|
if (didStartRef.current)
|
|
2109
2130
|
return;
|
|
2110
2131
|
if (connectionState !== ConnectionState.Connected)
|
|
@@ -2131,7 +2152,7 @@ function AutoStartMedia({
|
|
|
2131
2152
|
// src/components/DomCapture.tsx
|
|
2132
2153
|
import { useConnectionState as useConnectionState2, useLocalParticipant as useLocalParticipant5 } from "@livekit/components-react/hooks";
|
|
2133
2154
|
import { ConnectionState as ConnectionState2, ScreenSharePresets as ScreenSharePresets2, Track as Track3 } from "livekit-client";
|
|
2134
|
-
import { useEffect as
|
|
2155
|
+
import { useEffect as useEffect13, useRef as useRef7 } from "react";
|
|
2135
2156
|
|
|
2136
2157
|
// src/capture/a11yUtils.ts
|
|
2137
2158
|
var ROLE_BY_TAG = {
|
|
@@ -3039,7 +3060,7 @@ function DomCapture({ pushOrTapMicMode = false }) {
|
|
|
3039
3060
|
const pausedRef = useRef7(false);
|
|
3040
3061
|
const freezeCaptureRef = useRef7(null);
|
|
3041
3062
|
const resumeCaptureRef = useRef7(null);
|
|
3042
|
-
|
|
3063
|
+
useEffect13(() => {
|
|
3043
3064
|
if (didStartRef.current)
|
|
3044
3065
|
return;
|
|
3045
3066
|
if (connectionState !== ConnectionState2.Connected)
|
|
@@ -3157,7 +3178,7 @@ function DomCapture({ pushOrTapMicMode = false }) {
|
|
|
3157
3178
|
track.stop();
|
|
3158
3179
|
};
|
|
3159
3180
|
}, [connectionState, localParticipant, pushOrTapMicMode]);
|
|
3160
|
-
|
|
3181
|
+
useEffect13(() => {
|
|
3161
3182
|
if (isHeld) {
|
|
3162
3183
|
freezeCaptureRef.current?.();
|
|
3163
3184
|
} else {
|
|
@@ -3169,7 +3190,7 @@ function DomCapture({ pushOrTapMicMode = false }) {
|
|
|
3169
3190
|
|
|
3170
3191
|
// src/components/HighlightOverlay.tsx
|
|
3171
3192
|
import { useDataChannel } from "@livekit/components-react/hooks";
|
|
3172
|
-
import { useCallback as useCallback9, useEffect as
|
|
3193
|
+
import { useCallback as useCallback9, useEffect as useEffect14, useRef as useRef8 } from "react";
|
|
3173
3194
|
var HIGHLIGHT_AUTO_CLEAR_MS = 25000;
|
|
3174
3195
|
var textDecoder = new TextDecoder;
|
|
3175
3196
|
function parseHighlightMessage(payload) {
|
|
@@ -3225,7 +3246,7 @@ function HighlightOverlay() {
|
|
|
3225
3246
|
autoClearRef.current = setTimeout(clear, HIGHLIGHT_AUTO_CLEAR_MS);
|
|
3226
3247
|
}, [clear]);
|
|
3227
3248
|
useDataChannel(HIGHLIGHT_TOPIC, onHighlightMessage);
|
|
3228
|
-
|
|
3249
|
+
useEffect14(() => {
|
|
3229
3250
|
const onClick = (event) => {
|
|
3230
3251
|
const target = targetRef.current;
|
|
3231
3252
|
const node = event.target;
|
|
@@ -3235,15 +3256,15 @@ function HighlightOverlay() {
|
|
|
3235
3256
|
document.addEventListener("click", onClick, { capture: true });
|
|
3236
3257
|
return () => document.removeEventListener("click", onClick, { capture: true });
|
|
3237
3258
|
}, [clear]);
|
|
3238
|
-
|
|
3259
|
+
useEffect14(() => clear, [clear]);
|
|
3239
3260
|
return null;
|
|
3240
3261
|
}
|
|
3241
3262
|
|
|
3242
3263
|
// src/components/MinimizedBubble.tsx
|
|
3243
|
-
import { useContext as useContext7, useEffect as
|
|
3264
|
+
import { useContext as useContext7, useEffect as useEffect16, useRef as useRef10, useState as useState12 } from "react";
|
|
3244
3265
|
|
|
3245
3266
|
// src/hooks/useLauncherDrag.ts
|
|
3246
|
-
import { useEffect as
|
|
3267
|
+
import { useEffect as useEffect15, useRef as useRef9 } from "react";
|
|
3247
3268
|
import { flushSync } from "react-dom";
|
|
3248
3269
|
var DRAG_THRESHOLD_PX = 5;
|
|
3249
3270
|
function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
|
|
@@ -3254,7 +3275,7 @@ function useLauncherDrag(containerRef, onDrop, followRefs, reportDragging) {
|
|
|
3254
3275
|
followTargetsRef.current = followRefs;
|
|
3255
3276
|
const reportDraggingRef = useRef9(reportDragging);
|
|
3256
3277
|
reportDraggingRef.current = reportDragging;
|
|
3257
|
-
|
|
3278
|
+
useEffect15(() => {
|
|
3258
3279
|
const el = containerRef.current;
|
|
3259
3280
|
if (!el)
|
|
3260
3281
|
return;
|
|
@@ -3505,13 +3526,17 @@ var GOAL_APPEAR_STAGGER_MS = 150;
|
|
|
3505
3526
|
var GOAL_EXIT_STAGGER_MS = 250;
|
|
3506
3527
|
var MAX_GOAL_BUBBLES = 3;
|
|
3507
3528
|
var MAX_MODULE_PILLS = 3;
|
|
3508
|
-
function SkipprMark({ onStart }) {
|
|
3529
|
+
function SkipprMark({ onStart, logoUrl }) {
|
|
3509
3530
|
return /* @__PURE__ */ jsx7("button", {
|
|
3510
3531
|
type: "button",
|
|
3511
3532
|
onClick: onStart,
|
|
3512
3533
|
"aria-label": "Ask Me Anything",
|
|
3513
3534
|
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",
|
|
3514
|
-
children: /* @__PURE__ */ jsx7("
|
|
3535
|
+
children: logoUrl ? /* @__PURE__ */ jsx7("img", {
|
|
3536
|
+
src: logoUrl,
|
|
3537
|
+
alt: "",
|
|
3538
|
+
className: "skippr:h-[36px] skippr:w-[36px] skippr:rounded-[11px] skippr:object-cover"
|
|
3539
|
+
}) : /* @__PURE__ */ jsx7("svg", {
|
|
3515
3540
|
viewBox: "0 0 15.4044 18.4853",
|
|
3516
3541
|
className: "skippr:h-[18.5px] skippr:w-[15.4px]",
|
|
3517
3542
|
fill: "none",
|
|
@@ -3562,11 +3587,12 @@ function ChatButton({
|
|
|
3562
3587
|
function IdleLauncher({
|
|
3563
3588
|
position,
|
|
3564
3589
|
isHovered,
|
|
3590
|
+
logoUrl,
|
|
3565
3591
|
onStart,
|
|
3566
3592
|
onChat
|
|
3567
3593
|
}) {
|
|
3568
3594
|
return /* @__PURE__ */ jsxs4("div", {
|
|
3569
|
-
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"),
|
|
3595
|
+
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 || logoUrl ? "skippr:translate-x-3" : "skippr:translate-x-7" : isHovered || logoUrl ? "skippr:-translate-x-3" : "skippr:-translate-x-7"),
|
|
3570
3596
|
style: { gap: isHovered ? 8 : 0 },
|
|
3571
3597
|
children: [
|
|
3572
3598
|
/* @__PURE__ */ jsx7(ChatButton, {
|
|
@@ -3575,7 +3601,8 @@ function IdleLauncher({
|
|
|
3575
3601
|
onClick: onChat
|
|
3576
3602
|
}),
|
|
3577
3603
|
/* @__PURE__ */ jsx7(SkipprMark, {
|
|
3578
|
-
onStart
|
|
3604
|
+
onStart,
|
|
3605
|
+
logoUrl
|
|
3579
3606
|
})
|
|
3580
3607
|
]
|
|
3581
3608
|
});
|
|
@@ -3587,7 +3614,7 @@ function WelcomeBubble({
|
|
|
3587
3614
|
onDismiss,
|
|
3588
3615
|
onClick
|
|
3589
3616
|
}) {
|
|
3590
|
-
|
|
3617
|
+
useEffect16(() => {
|
|
3591
3618
|
const timer = setTimeout(onDismiss, 5000);
|
|
3592
3619
|
return () => clearTimeout(timer);
|
|
3593
3620
|
}, [onDismiss]);
|
|
@@ -3629,15 +3656,16 @@ function MinimizedBubble({
|
|
|
3629
3656
|
selectModule,
|
|
3630
3657
|
expandPanel,
|
|
3631
3658
|
setSidebarTab,
|
|
3632
|
-
commitLauncherDrop
|
|
3659
|
+
commitLauncherDrop,
|
|
3660
|
+
appearance
|
|
3633
3661
|
} = ctx;
|
|
3634
|
-
const [goalsAutoHidden, setGoalsAutoHidden] =
|
|
3635
|
-
const [isLauncherHovered, setIsLauncherHovered] =
|
|
3636
|
-
const [visitHref, setVisitHref] =
|
|
3662
|
+
const [goalsAutoHidden, setGoalsAutoHidden] = useState12(false);
|
|
3663
|
+
const [isLauncherHovered, setIsLauncherHovered] = useState12(false);
|
|
3664
|
+
const [visitHref, setVisitHref] = useState12(() => window.location.href);
|
|
3637
3665
|
const revealedHrefRef = useRef10(null);
|
|
3638
3666
|
const hoverContainerRef = useRef10(null);
|
|
3639
|
-
|
|
3640
|
-
|
|
3667
|
+
useEffect16(() => subscribeToLocationChange(() => setVisitHref(window.location.href)), []);
|
|
3668
|
+
useEffect16(() => {
|
|
3641
3669
|
const el = hoverContainerRef.current;
|
|
3642
3670
|
if (!el)
|
|
3643
3671
|
return;
|
|
@@ -3659,7 +3687,7 @@ function MinimizedBubble({
|
|
|
3659
3687
|
const onboardingModule = pillCandidates.find((module) => module.type === "onboarding");
|
|
3660
3688
|
const modulePills = onboardingModule ? [onboardingModule] : pillCandidates.slice(0, MAX_MODULE_PILLS).reverse();
|
|
3661
3689
|
const goalsEligible = adoptionGoals.length > 0 && !onboardingModule && hasResolvedModules;
|
|
3662
|
-
|
|
3690
|
+
useEffect16(() => {
|
|
3663
3691
|
if (!goalsEligible)
|
|
3664
3692
|
return;
|
|
3665
3693
|
if (revealedHrefRef.current === visitHref) {
|
|
@@ -3673,8 +3701,8 @@ function MinimizedBubble({
|
|
|
3673
3701
|
}, [goalsEligible, visitHref]);
|
|
3674
3702
|
const matchedGoals = goalsEligible ? adoptionGoals.slice(0, MAX_GOAL_BUBBLES) : [];
|
|
3675
3703
|
const goalsHidden = goalsAutoHidden && !isLauncherHovered;
|
|
3676
|
-
const [goalsUnmounted, setGoalsUnmounted] =
|
|
3677
|
-
|
|
3704
|
+
const [goalsUnmounted, setGoalsUnmounted] = useState12(false);
|
|
3705
|
+
useEffect16(() => {
|
|
3678
3706
|
if (!goalsHidden) {
|
|
3679
3707
|
setGoalsUnmounted(false);
|
|
3680
3708
|
return;
|
|
@@ -3740,6 +3768,7 @@ function MinimizedBubble({
|
|
|
3740
3768
|
/* @__PURE__ */ jsx7(IdleLauncher, {
|
|
3741
3769
|
position,
|
|
3742
3770
|
isHovered: isLauncherHovered,
|
|
3771
|
+
logoUrl: appearance?.logoUrl ?? null,
|
|
3743
3772
|
onStart: launchDefaultSession,
|
|
3744
3773
|
onChat: openChat
|
|
3745
3774
|
})
|
|
@@ -3749,7 +3778,7 @@ function MinimizedBubble({
|
|
|
3749
3778
|
|
|
3750
3779
|
// src/components/PageActionHandler.tsx
|
|
3751
3780
|
import { useDataChannel as useDataChannel2 } from "@livekit/components-react/hooks";
|
|
3752
|
-
import { useCallback as useCallback10, useEffect as
|
|
3781
|
+
import { useCallback as useCallback10, useEffect as useEffect17, useRef as useRef11 } from "react";
|
|
3753
3782
|
var STEP_MAX_WAIT_MS = 5000;
|
|
3754
3783
|
var POST_ACTION_SETTLE_SNAPSHOT_MS = 300;
|
|
3755
3784
|
var TRAILING_ACTION_FLUSH_AFTER_STOP_MS = 1000;
|
|
@@ -4073,7 +4102,7 @@ function PageActionHandler() {
|
|
|
4073
4102
|
queueRef.current.push(action);
|
|
4074
4103
|
drain();
|
|
4075
4104
|
}, [drain]);
|
|
4076
|
-
|
|
4105
|
+
useEffect17(() => {
|
|
4077
4106
|
mountedRef.current = true;
|
|
4078
4107
|
drainingRef.current = false;
|
|
4079
4108
|
return () => {
|
|
@@ -4085,7 +4114,7 @@ function PageActionHandler() {
|
|
|
4085
4114
|
setActionsBusy(false);
|
|
4086
4115
|
};
|
|
4087
4116
|
}, []);
|
|
4088
|
-
|
|
4117
|
+
useEffect17(() => {
|
|
4089
4118
|
return onActionsStopped(() => {
|
|
4090
4119
|
actionsStoppedRef.current = true;
|
|
4091
4120
|
ignoreActionsArrivingBeforeRef.current = Date.now() + TRAILING_ACTION_FLUSH_AFTER_STOP_MS;
|
|
@@ -4103,17 +4132,17 @@ function PageActionHandler() {
|
|
|
4103
4132
|
}
|
|
4104
4133
|
|
|
4105
4134
|
// src/components/SessionControlBar.tsx
|
|
4106
|
-
import { useCallback as useCallback13, useContext as useContext8, useEffect as
|
|
4135
|
+
import { useCallback as useCallback13, useContext as useContext8, useEffect as useEffect22, useState as useState15 } from "react";
|
|
4107
4136
|
|
|
4108
4137
|
// src/hooks/useActionControl.ts
|
|
4109
4138
|
import { useLocalParticipant as useLocalParticipant6 } from "@livekit/components-react/hooks";
|
|
4110
|
-
import { useCallback as useCallback11, useEffect as
|
|
4139
|
+
import { useCallback as useCallback11, useEffect as useEffect18, useState as useState13 } from "react";
|
|
4111
4140
|
var textEncoder5 = new TextEncoder;
|
|
4112
4141
|
function useActionControl() {
|
|
4113
4142
|
const { localParticipant } = useLocalParticipant6();
|
|
4114
4143
|
const plan = usePlanUpdates();
|
|
4115
|
-
const [busy, setBusy] =
|
|
4116
|
-
|
|
4144
|
+
const [busy, setBusy] = useState13(isActionsBusy);
|
|
4145
|
+
useEffect18(() => subscribeActionsBusy(setBusy), []);
|
|
4117
4146
|
const actionsActive = busy || plan?.state === "executing";
|
|
4118
4147
|
const requestStop = useCallback11(async () => {
|
|
4119
4148
|
stopActions();
|
|
@@ -4142,13 +4171,13 @@ function useAgentVoiceState() {
|
|
|
4142
4171
|
}
|
|
4143
4172
|
|
|
4144
4173
|
// src/hooks/useAudioLevelBars.ts
|
|
4145
|
-
import { useEffect as
|
|
4174
|
+
import { useEffect as useEffect19, useRef as useRef12, useState as useState14 } from "react";
|
|
4146
4175
|
var TALKING_LEVEL_THRESHOLD = 0.2;
|
|
4147
4176
|
var TALKING_HOLD_MS = 400;
|
|
4148
4177
|
function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowthPx, noiseGate }) {
|
|
4149
4178
|
const barRefs = useRef12([]);
|
|
4150
|
-
const [isTalking, setIsTalking] =
|
|
4151
|
-
|
|
4179
|
+
const [isTalking, setIsTalking] = useState14(false);
|
|
4180
|
+
useEffect19(() => {
|
|
4152
4181
|
if (!mediaStreamTrack) {
|
|
4153
4182
|
for (const bar of barRefs.current) {
|
|
4154
4183
|
if (bar)
|
|
@@ -4199,7 +4228,7 @@ function useAudioLevelBars(mediaStreamTrack, { barCount, idleHeightPx, maxGrowth
|
|
|
4199
4228
|
}
|
|
4200
4229
|
|
|
4201
4230
|
// src/hooks/useIdleAutoPause.ts
|
|
4202
|
-
import { useCallback as useCallback12, useEffect as
|
|
4231
|
+
import { useCallback as useCallback12, useEffect as useEffect20, useRef as useRef13 } from "react";
|
|
4203
4232
|
function useIdleAutoPause({
|
|
4204
4233
|
enabled,
|
|
4205
4234
|
active,
|
|
@@ -4223,7 +4252,7 @@ function useIdleAutoPause({
|
|
|
4223
4252
|
if (enabled && !isHeld)
|
|
4224
4253
|
armTimer();
|
|
4225
4254
|
}, [enabled, isHeld, armTimer]);
|
|
4226
|
-
|
|
4255
|
+
useEffect20(() => {
|
|
4227
4256
|
if (!enabled || isHeld || active) {
|
|
4228
4257
|
clearTimer();
|
|
4229
4258
|
return;
|
|
@@ -4235,7 +4264,7 @@ function useIdleAutoPause({
|
|
|
4235
4264
|
}
|
|
4236
4265
|
|
|
4237
4266
|
// src/hooks/useKeyboardPushToTalk.ts
|
|
4238
|
-
import { useEffect as
|
|
4267
|
+
import { useEffect as useEffect21, useRef as useRef14 } from "react";
|
|
4239
4268
|
function isEditableTarget() {
|
|
4240
4269
|
const el = document.activeElement;
|
|
4241
4270
|
if (!el)
|
|
@@ -4251,7 +4280,7 @@ function useKeyboardPushToTalk({
|
|
|
4251
4280
|
}) {
|
|
4252
4281
|
const handlers = useRef14({ onStart, onCommit, onKeyUsed });
|
|
4253
4282
|
handlers.current = { onStart, onCommit, onKeyUsed };
|
|
4254
|
-
|
|
4283
|
+
useEffect21(() => {
|
|
4255
4284
|
if (!enabled)
|
|
4256
4285
|
return;
|
|
4257
4286
|
let keyHeld = false;
|
|
@@ -4656,7 +4685,7 @@ function SessionControlBar() {
|
|
|
4656
4685
|
togglePause();
|
|
4657
4686
|
}
|
|
4658
4687
|
});
|
|
4659
|
-
const [pushToTalkHintSeen, setPushToTalkHintSeen] =
|
|
4688
|
+
const [pushToTalkHintSeen, setPushToTalkHintSeen] = useState15(false);
|
|
4660
4689
|
const startPushToTalk = useCallback13(() => {
|
|
4661
4690
|
start();
|
|
4662
4691
|
reportActivity();
|
|
@@ -4674,7 +4703,7 @@ function SessionControlBar() {
|
|
|
4674
4703
|
onCommit: commitPushToTalk,
|
|
4675
4704
|
onKeyUsed: dismissPushToTalkHint
|
|
4676
4705
|
});
|
|
4677
|
-
|
|
4706
|
+
useEffect22(() => {
|
|
4678
4707
|
if (isHeld)
|
|
4679
4708
|
minimizePanel();
|
|
4680
4709
|
}, [isHeld, minimizePanel]);
|
|
@@ -4927,8 +4956,29 @@ function SessionControlBar() {
|
|
|
4927
4956
|
}
|
|
4928
4957
|
|
|
4929
4958
|
// src/components/ShadowHost.tsx
|
|
4930
|
-
import { useLayoutEffect as useLayoutEffect2, useRef as useRef16, useState as
|
|
4959
|
+
import { useLayoutEffect as useLayoutEffect2, useRef as useRef16, useState as useState16 } from "react";
|
|
4931
4960
|
import { createPortal } from "react-dom";
|
|
4961
|
+
|
|
4962
|
+
// src/lib/brandForeground.ts
|
|
4963
|
+
var DARK_FOREGROUND = "#2d2b3d";
|
|
4964
|
+
var LIGHT_FOREGROUND = "#ffffff";
|
|
4965
|
+
var LUMINANCE_THRESHOLD = 0.179;
|
|
4966
|
+
var HEX_COLOR = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
|
|
4967
|
+
function isHexColor(value) {
|
|
4968
|
+
return HEX_COLOR.test(value);
|
|
4969
|
+
}
|
|
4970
|
+
function linearChannel(hex, offset) {
|
|
4971
|
+
const channel = Number.parseInt(hex.slice(offset, offset + 2), 16) / 255;
|
|
4972
|
+
return channel <= 0.03928 ? channel / 12.92 : ((channel + 0.055) / 1.055) ** 2.4;
|
|
4973
|
+
}
|
|
4974
|
+
function brandForeground(accentColor) {
|
|
4975
|
+
const hex = accentColor.replace("#", "");
|
|
4976
|
+
const fullHex = hex.length === 3 ? hex.split("").map((char) => char + char).join("") : hex;
|
|
4977
|
+
const luminance = 0.2126 * linearChannel(fullHex, 0) + 0.7152 * linearChannel(fullHex, 2) + 0.0722 * linearChannel(fullHex, 4);
|
|
4978
|
+
return luminance > LUMINANCE_THRESHOLD ? DARK_FOREGROUND : LIGHT_FOREGROUND;
|
|
4979
|
+
}
|
|
4980
|
+
|
|
4981
|
+
// src/components/ShadowHost.tsx
|
|
4932
4982
|
import { jsx as jsx13, Fragment as Fragment2 } from "react/jsx-runtime";
|
|
4933
4983
|
var PROPERTIES_STYLE_ID = "skippr-tw-properties";
|
|
4934
4984
|
var PROPERTY_RULE = /@property\s+[^{]+\{[^}]*\}/g;
|
|
@@ -4943,11 +4993,18 @@ function hoistTailwindProperties(css) {
|
|
|
4943
4993
|
}
|
|
4944
4994
|
return css.replace(PROPERTY_RULE, "");
|
|
4945
4995
|
}
|
|
4946
|
-
function ShadowHost({
|
|
4996
|
+
function ShadowHost({
|
|
4997
|
+
children,
|
|
4998
|
+
accentColor
|
|
4999
|
+
}) {
|
|
4947
5000
|
const hostRef = useRef16(null);
|
|
4948
|
-
const [shadowRoot, setShadowRoot] =
|
|
5001
|
+
const [shadowRoot, setShadowRoot] = useState16(null);
|
|
4949
5002
|
const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
|
|
4950
|
-
@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-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-2{left:calc(var(--skippr-spacing)*2)}.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\\:z-\\[10000\\]{z-index:10000}.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-\\[38px\\]{width:38px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-fit{width:fit-content}.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\\:max-w-\\[280px\\]{max-width:280px}.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\\:scale-\\[0\\.94\\]{scale:.94}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out\\]{animation:.2s ease-out skippr-agent-in}.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-ptt-transmit{animation:1.4s ease-out infinite skippr-ptt-transmit}.skippr\\:animate-skippr-rec-ring{animation:2s ease-out infinite skippr-rec-ring}.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{border-radius:.25rem}.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-black\\/25{border-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:border-black\\/25{border-color:color-mix(in oklab,var(--skippr-color-black)25%,transparent)}}.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-\\[\\#f4ecd8\\]{background-color:#f4ecd8}.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-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\\:bg-white\\/70{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/70{background-color:color-mix(in oklab,var(--skippr-color-white)70%,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-3\\.5{padding-inline:calc(var(--skippr-spacing)*3.5)}.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-none{--tw-leading:1;line-height:1}.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,.skippr\\:text-black\\/40{color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-black\\/40{color:color-mix(in oklab,var(--skippr-color-black)40%,transparent)}}.skippr\\:text-brand{color:#2bc0ae}.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-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,.skippr\\:text-white\\/60{color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-white\\/60{color:color-mix(in oklab,var(--skippr-color-white)60%,transparent)}}.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_2px_6px_rgba\\(0\\,0\\,0\\,0\\.28\\)\\]{--tw-shadow:0 2px 6px var(--tw-shadow-color,#00000047);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\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 14px 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-inner{--tw-shadow:inset 0 2px 4px 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\\: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\\/15{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/15{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)15%,transparent)}}.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-100{--tw-duration:.1s;transition-duration:.1s}.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-\\[cubic-bezier\\(0\\.34\\,1\\.56\\,0\\.64\\,1\\)\\]{--tw-ease:cubic-bezier(.34,1.56,.64,1);transition-timing-function:cubic-bezier(.34,1.56,.64,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-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\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.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-rec-ring{0%{box-shadow:0 0 #2bc0ae8c}70%{box-shadow:0 0 0 11px #2bc0ae00}to{box-shadow:0 0 #2bc0ae00}}@keyframes skippr-ptt-transmit{0%{box-shadow:0 0 #2bc0ae99,0 0 #2bc0ae59}70%{box-shadow:0 0 0 9px #2bc0ae00,0 0 0 16px #2bc0ae00}to{box-shadow:0 0 #2bc0ae00,0 0 #2bc0ae00}}@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}}`;
|
|
5003
|
+
@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-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-2{left:calc(var(--skippr-spacing)*2)}.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\\:z-\\[10000\\]{z-index:10000}.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-\\[38px\\]{width:38px}.skippr\\:w-\\[50px\\]{width:50px}.skippr\\:w-fit{width:fit-content}.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\\:max-w-\\[280px\\]{max-width:280px}.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\\:scale-\\[0\\.94\\]{scale:.94}.skippr\\:-rotate-90{rotate:-90deg}.skippr\\:rotate-45{rotate:45deg}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:\\[animation\\:skippr-agent-in_200ms_ease-out\\]{animation:.2s ease-out skippr-agent-in}.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-ptt-transmit{animation:1.4s ease-out infinite skippr-ptt-transmit}.skippr\\:animate-skippr-rec-ring{animation:2s ease-out infinite skippr-rec-ring}.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{border-radius:.25rem}.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-black\\/25{border-color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:border-black\\/25{border-color:color-mix(in oklab,var(--skippr-color-black)25%,transparent)}}.skippr\\:border-border{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-brand{border-color:var(--skippr-brand,#2bc0ae)}.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:var(--skippr-brand,#2d2b3d)}@supports (color:color-mix(in lab, red, red)){.skippr\\:border-primary\\/20{border-color:color-mix(in oklab,var(--skippr-brand,#2d2b3d)20%,transparent)}}.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-\\[\\#f4ecd8\\]{background-color:#f4ecd8}.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-brand,.skippr\\:bg-brand\\/50{background-color:var(--skippr-brand,#2bc0ae)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-brand\\/50{background-color:color-mix(in oklab,var(--skippr-brand,#2bc0ae)50%,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-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:var(--skippr-brand,#2d2b3d)}.skippr\\:bg-primary-foreground\\/15{background-color:var(--skippr-brand-foreground,#fff)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-primary-foreground\\/15{background-color:color-mix(in oklab,var(--skippr-brand-foreground,#fff)15%,transparent)}}.skippr\\:bg-primary-foreground\\/20{background-color:var(--skippr-brand-foreground,#fff)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-primary-foreground\\/20{background-color:color-mix(in oklab,var(--skippr-brand-foreground,#fff)20%,transparent)}}.skippr\\:bg-primary\\/10{background-color:var(--skippr-brand,#2d2b3d)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-primary\\/10{background-color:color-mix(in oklab,var(--skippr-brand,#2d2b3d)10%,transparent)}}.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\\/70{background-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:bg-white\\/70{background-color:color-mix(in oklab,var(--skippr-color-white)70%,transparent)}}.skippr\\:fill-brand{fill:var(--skippr-brand,#2bc0ae)}.skippr\\:fill-primary\\/30{fill:var(--skippr-brand,#2d2b3d)}@supports (color:color-mix(in lab, red, red)){.skippr\\:fill-primary\\/30{fill:color-mix(in oklab,var(--skippr-brand,#2d2b3d)30%,transparent)}}.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\\:object-cover{object-fit:cover}.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-3\\.5{padding-inline:calc(var(--skippr-spacing)*3.5)}.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-none{--tw-leading:1;line-height:1}.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-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,.skippr\\:text-black\\/40{color:var(--skippr-color-black)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-black\\/40{color:color-mix(in oklab,var(--skippr-color-black)40%,transparent)}}.skippr\\:text-brand{color:var(--skippr-brand,#2bc0ae)}.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-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:var(--skippr-brand,#2d2b3d)}.skippr\\:text-primary-foreground,.skippr\\:text-primary-foreground\\/70{color:var(--skippr-brand-foreground,#fff)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-primary-foreground\\/70{color:color-mix(in oklab,var(--skippr-brand-foreground,#fff)70%,transparent)}}.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,.skippr\\:text-white\\/60{color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:text-white\\/60{color:color-mix(in oklab,var(--skippr-color-white)60%,transparent)}}.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_2px_6px_rgba\\(0\\,0\\,0\\,0\\.28\\)\\]{--tw-shadow:0 2px 6px var(--tw-shadow-color,#00000047);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\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 14px 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-inner{--tw-shadow:inset 0 2px 4px 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\\: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:var(--skippr-brand,#2bc0ae)}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-primary-foreground\\/30{--tw-ring-color:var(--skippr-brand-foreground,#fff)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-primary-foreground\\/30{--tw-ring-color:color-mix(in oklab,var(--skippr-brand-foreground,#fff)30%,transparent)}}.skippr\\:ring-white\\/15{--tw-ring-color:var(--skippr-color-white)}@supports (color:color-mix(in lab, red, red)){.skippr\\:ring-white\\/15{--tw-ring-color:color-mix(in oklab,var(--skippr-color-white)15%,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-100{--tw-duration:.1s;transition-duration:.1s}.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-\\[cubic-bezier\\(0\\.34\\,1\\.56\\,0\\.64\\,1\\)\\]{--tw-ease:cubic-bezier(.34,1.56,.64,1);transition-timing-function:cubic-bezier(.34,1.56,.64,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-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-foreground\\/10:hover{background-color:var(--skippr-brand-foreground,#fff)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:color-mix(in oklab,var(--skippr-brand-foreground,#fff)10%,transparent)}}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:var(--skippr-brand,#2d2b3d)}@supports (color:color-mix(in lab, red, red)){.skippr\\:hover\\:bg-primary\\/90:hover{background-color:color-mix(in oklab,var(--skippr-brand,#2d2b3d)90%,transparent)}}.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\\: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:var(--skippr-brand-foreground,#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-bubble\\/60:focus-visible{--tw-ring-color:oklab(29.9244% .0107414 -.0305411/.6)}.skippr\\:focus-visible\\:ring-primary-foreground:focus-visible{--tw-ring-color:var(--skippr-brand-foreground,#fff)}.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\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.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-rec-ring{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--skippr-brand,#2bc0ae)55%,transparent)}70%{box-shadow:0 0 0 11px #0000}to{box-shadow:0 0 #0000}}@keyframes skippr-ptt-transmit{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--skippr-brand,#2bc0ae)60%,transparent),0 0 0 0 color-mix(in srgb,var(--skippr-brand,#2bc0ae)35%,transparent)}70%{box-shadow:0 0 0 9px #0000,0 0 0 16px #0000}to{box-shadow:0 0 #0000,0 0 #0000}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb,var(--skippr-brand,#2bc0ae)50%,transparent)}50%{box-shadow:0 0 0 6px #0000}}@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}}`;
|
|
5004
|
+
const hostStyle = accentColor && isHexColor(accentColor) ? {
|
|
5005
|
+
"--skippr-brand": accentColor,
|
|
5006
|
+
"--skippr-brand-foreground": brandForeground(accentColor)
|
|
5007
|
+
} : undefined;
|
|
4951
5008
|
useLayoutEffect2(() => {
|
|
4952
5009
|
const host = hostRef.current;
|
|
4953
5010
|
if (!host || !css)
|
|
@@ -4967,12 +5024,13 @@ function ShadowHost({ children }) {
|
|
|
4967
5024
|
});
|
|
4968
5025
|
return /* @__PURE__ */ jsx13("div", {
|
|
4969
5026
|
ref: hostRef,
|
|
5027
|
+
style: hostStyle,
|
|
4970
5028
|
children: shadowRoot && createPortal(children, shadowRoot)
|
|
4971
5029
|
});
|
|
4972
5030
|
}
|
|
4973
5031
|
|
|
4974
5032
|
// src/components/Sidebar.tsx
|
|
4975
|
-
import { useContext as useContext13, useEffect as
|
|
5033
|
+
import { useContext as useContext13, useEffect as useEffect29 } from "react";
|
|
4976
5034
|
|
|
4977
5035
|
// src/hooks/useCombinedMessages.ts
|
|
4978
5036
|
import { useContext as useContext9, useMemo as useMemo6 } from "react";
|
|
@@ -5075,7 +5133,7 @@ function useCombinedMessages() {
|
|
|
5075
5133
|
}
|
|
5076
5134
|
|
|
5077
5135
|
// src/hooks/usePhaseUpdates.ts
|
|
5078
|
-
import { useCallback as useCallback14, useContext as useContext10, useEffect as
|
|
5136
|
+
import { useCallback as useCallback14, useContext as useContext10, useEffect as useEffect23 } from "react";
|
|
5079
5137
|
function parsePhases(json) {
|
|
5080
5138
|
try {
|
|
5081
5139
|
const data = JSON.parse(json);
|
|
@@ -5089,7 +5147,7 @@ function usePhaseUpdates() {
|
|
|
5089
5147
|
const parse = useCallback14(parsePhases, []);
|
|
5090
5148
|
const livePhases = useAgentState("phases", parse, []);
|
|
5091
5149
|
const ctx = useContext10(LiveAgentContext);
|
|
5092
|
-
|
|
5150
|
+
useEffect23(() => {
|
|
5093
5151
|
if (livePhases.length > 0)
|
|
5094
5152
|
ctx?.setPhasesSnapshot(livePhases);
|
|
5095
5153
|
}, [livePhases, ctx?.setPhasesSnapshot]);
|
|
@@ -5098,7 +5156,7 @@ function usePhaseUpdates() {
|
|
|
5098
5156
|
}
|
|
5099
5157
|
|
|
5100
5158
|
// src/hooks/useSessionRemaining.ts
|
|
5101
|
-
import { useEffect as
|
|
5159
|
+
import { useEffect as useEffect24, useRef as useRef18, useState as useState17 } from "react";
|
|
5102
5160
|
|
|
5103
5161
|
// src/lib/format.ts
|
|
5104
5162
|
function formatTime(seconds) {
|
|
@@ -5115,8 +5173,8 @@ function parseNumber(s) {
|
|
|
5115
5173
|
function useSessionRemaining() {
|
|
5116
5174
|
const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
|
|
5117
5175
|
const endTimeRef = useRef18(null);
|
|
5118
|
-
const [remaining, setRemaining] =
|
|
5119
|
-
|
|
5176
|
+
const [remaining, setRemaining] = useState17(null);
|
|
5177
|
+
useEffect24(() => {
|
|
5120
5178
|
if (maxCallDuration === null || endTimeRef.current !== null)
|
|
5121
5179
|
return;
|
|
5122
5180
|
const endTime = Date.now() + maxCallDuration * 1000;
|
|
@@ -5136,15 +5194,15 @@ function useSessionRemaining() {
|
|
|
5136
5194
|
import { useContext as useContext12, useRef as useRef21 } from "react";
|
|
5137
5195
|
|
|
5138
5196
|
// src/hooks/useElapsedSeconds.ts
|
|
5139
|
-
import { useEffect as
|
|
5197
|
+
import { useEffect as useEffect25, useRef as useRef19, useState as useState18 } from "react";
|
|
5140
5198
|
function useElapsedSeconds(isRunning, resetSignal) {
|
|
5141
|
-
const [elapsed, setElapsed] =
|
|
5199
|
+
const [elapsed, setElapsed] = useState18(0);
|
|
5142
5200
|
const accumulatedSecondsRef = useRef19(0);
|
|
5143
|
-
|
|
5201
|
+
useEffect25(() => {
|
|
5144
5202
|
accumulatedSecondsRef.current = 0;
|
|
5145
5203
|
setElapsed(0);
|
|
5146
5204
|
}, [resetSignal]);
|
|
5147
|
-
|
|
5205
|
+
useEffect25(() => {
|
|
5148
5206
|
if (!isRunning)
|
|
5149
5207
|
return;
|
|
5150
5208
|
const resumedAt = Date.now();
|
|
@@ -5261,7 +5319,7 @@ function ChatHeader() {
|
|
|
5261
5319
|
},
|
|
5262
5320
|
"aria-label": "Close",
|
|
5263
5321
|
title: "Close",
|
|
5264
|
-
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-
|
|
5322
|
+
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-primary-foreground/10 skippr:hover:text-primary-foreground skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-primary-foreground",
|
|
5265
5323
|
children: /* @__PURE__ */ jsx14(X, {
|
|
5266
5324
|
className: "skippr:h-4 skippr:w-4"
|
|
5267
5325
|
})
|
|
@@ -5275,7 +5333,7 @@ function HeaderModeToggle() {
|
|
|
5275
5333
|
return /* @__PURE__ */ jsxs11("fieldset", {
|
|
5276
5334
|
"aria-label": "Response mode",
|
|
5277
5335
|
disabled: isHeld,
|
|
5278
|
-
className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-
|
|
5336
|
+
className: "skippr:flex skippr:items-center skippr:gap-0.5 skippr:rounded-lg skippr:bg-primary-foreground/15 skippr:p-0.5 skippr:text-xs skippr:font-medium skippr:ring-1 skippr:ring-primary-foreground/30 skippr:disabled:opacity-50",
|
|
5279
5337
|
children: [
|
|
5280
5338
|
/* @__PURE__ */ jsx14("button", {
|
|
5281
5339
|
type: "button",
|
|
@@ -5285,7 +5343,7 @@ function HeaderModeToggle() {
|
|
|
5285
5343
|
if (textMode)
|
|
5286
5344
|
toggleTextMode();
|
|
5287
5345
|
},
|
|
5288
|
-
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-
|
|
5346
|
+
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-primary-foreground 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-foreground skippr:shadow-sm"),
|
|
5289
5347
|
children: "Voice"
|
|
5290
5348
|
}),
|
|
5291
5349
|
/* @__PURE__ */ jsx14("button", {
|
|
@@ -5296,7 +5354,7 @@ function HeaderModeToggle() {
|
|
|
5296
5354
|
if (!textMode)
|
|
5297
5355
|
toggleTextMode();
|
|
5298
5356
|
},
|
|
5299
|
-
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-
|
|
5357
|
+
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-primary-foreground skippr:disabled:cursor-not-allowed", isHeld ? "skippr:cursor-not-allowed" : "skippr:cursor-pointer", textMode ? "skippr:bg-white skippr:text-foreground skippr:shadow-sm" : "skippr:font-semibold skippr:text-primary-foreground"),
|
|
5300
5358
|
children: "Text"
|
|
5301
5359
|
})
|
|
5302
5360
|
]
|
|
@@ -5332,7 +5390,7 @@ function LoadingDots({ label }) {
|
|
|
5332
5390
|
}
|
|
5333
5391
|
|
|
5334
5392
|
// src/components/LoginFlow.tsx
|
|
5335
|
-
import { useCallback as useCallback16, useEffect as
|
|
5393
|
+
import { useCallback as useCallback16, useEffect as useEffect26, useRef as useRef22, useState as useState19 } from "react";
|
|
5336
5394
|
|
|
5337
5395
|
// src/components/ui/button.tsx
|
|
5338
5396
|
import { forwardRef as forwardRef3 } from "react";
|
|
@@ -5368,8 +5426,8 @@ import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
|
5368
5426
|
var OTP_LENGTH = 6;
|
|
5369
5427
|
var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
|
|
5370
5428
|
function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
|
|
5371
|
-
const [step, setStep] =
|
|
5372
|
-
const [email, setEmail] =
|
|
5429
|
+
const [step, setStep] = useState19("email");
|
|
5430
|
+
const [email, setEmail] = useState19("");
|
|
5373
5431
|
const handleRequestOtp = useCallback16(async (emailValue) => {
|
|
5374
5432
|
const success = await requestOtp(emailValue);
|
|
5375
5433
|
if (success)
|
|
@@ -5458,18 +5516,18 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
|
|
|
5458
5516
|
});
|
|
5459
5517
|
}
|
|
5460
5518
|
function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
5461
|
-
const [digits, setDigits] =
|
|
5462
|
-
const [resendCooldown, setResendCooldown] =
|
|
5519
|
+
const [digits, setDigits] = useState19(Array(OTP_LENGTH).fill(""));
|
|
5520
|
+
const [resendCooldown, setResendCooldown] = useState19(0);
|
|
5463
5521
|
const inputRefs = useRef22([]);
|
|
5464
5522
|
const submittedRef = useRef22(false);
|
|
5465
|
-
|
|
5523
|
+
useEffect26(() => {
|
|
5466
5524
|
inputRefs.current[0]?.focus();
|
|
5467
5525
|
}, []);
|
|
5468
|
-
|
|
5526
|
+
useEffect26(() => {
|
|
5469
5527
|
if (error)
|
|
5470
5528
|
submittedRef.current = false;
|
|
5471
5529
|
}, [error]);
|
|
5472
|
-
|
|
5530
|
+
useEffect26(() => {
|
|
5473
5531
|
if (resendCooldown <= 0)
|
|
5474
5532
|
return;
|
|
5475
5533
|
const timer = setTimeout(() => setResendCooldown((c) => c - 1), 1000);
|
|
@@ -5610,17 +5668,17 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
|
|
|
5610
5668
|
}
|
|
5611
5669
|
|
|
5612
5670
|
// src/components/MessageList.tsx
|
|
5613
|
-
import { useCallback as useCallback17, useLayoutEffect as useLayoutEffect3, useRef as useRef24, useState as
|
|
5671
|
+
import { useCallback as useCallback17, useLayoutEffect as useLayoutEffect3, useRef as useRef24, useState as useState21 } from "react";
|
|
5614
5672
|
|
|
5615
5673
|
// src/components/ChatInput.tsx
|
|
5616
|
-
import { useEffect as
|
|
5674
|
+
import { useEffect as useEffect27, useRef as useRef23, useState as useState20 } from "react";
|
|
5617
5675
|
import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
5618
5676
|
var MAX_INPUT_HEIGHT = 60;
|
|
5619
5677
|
function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
|
|
5620
|
-
const [inputText, setInputText] =
|
|
5678
|
+
const [inputText, setInputText] = useState20("");
|
|
5621
5679
|
const textareaRef = useRef23(null);
|
|
5622
5680
|
const canSend = inputText.trim().length > 0 && !isSendingChat;
|
|
5623
|
-
|
|
5681
|
+
useEffect27(() => {
|
|
5624
5682
|
if (autoFocus)
|
|
5625
5683
|
textareaRef.current?.focus();
|
|
5626
5684
|
}, [autoFocus]);
|
|
@@ -5711,7 +5769,7 @@ function ChatMessage({ message }) {
|
|
|
5711
5769
|
}
|
|
5712
5770
|
|
|
5713
5771
|
// src/components/PlanCard.tsx
|
|
5714
|
-
import { useEffect as
|
|
5772
|
+
import { useEffect as useEffect28 } from "react";
|
|
5715
5773
|
import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
5716
5774
|
var APPROVE_MESSAGE = "Yes, go ahead.";
|
|
5717
5775
|
var CANCEL_MESSAGE = "No, cancel that.";
|
|
@@ -5738,7 +5796,7 @@ function StepIcon({ status }) {
|
|
|
5738
5796
|
}
|
|
5739
5797
|
function PlanCard({ plan, sendChatMessage, onDismiss }) {
|
|
5740
5798
|
const awaitingApproval = plan.state === "proposed";
|
|
5741
|
-
|
|
5799
|
+
useEffect28(() => {
|
|
5742
5800
|
if (plan.state !== "completed")
|
|
5743
5801
|
return;
|
|
5744
5802
|
const timer = setTimeout(onDismiss, COMPLETED_CARD_VISIBLE_MS);
|
|
@@ -5834,9 +5892,9 @@ function MessageList({
|
|
|
5834
5892
|
const containerRef = useRef24(null);
|
|
5835
5893
|
const isPinnedToBottom = useRef24(true);
|
|
5836
5894
|
const lastSeenMessageId = useRef24(undefined);
|
|
5837
|
-
const [showJumpToLatest, setShowJumpToLatest] =
|
|
5895
|
+
const [showJumpToLatest, setShowJumpToLatest] = useState21(false);
|
|
5838
5896
|
const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
|
|
5839
|
-
const [dismissedPlanId, setDismissedPlanId] =
|
|
5897
|
+
const [dismissedPlanId, setDismissedPlanId] = useState21(null);
|
|
5840
5898
|
const dismissPlan = useCallback17(() => {
|
|
5841
5899
|
if (plan)
|
|
5842
5900
|
setDismissedPlanId(plan.planId);
|
|
@@ -6032,6 +6090,7 @@ function Sidebar({
|
|
|
6032
6090
|
const defaultAgentId = internalCtx?.defaultAgentId ?? null;
|
|
6033
6091
|
const startDefaultSession = internalCtx?.startDefaultSession ?? (() => {});
|
|
6034
6092
|
const talkDisabled = !(internalCtx?.hasResolvedModules ?? false);
|
|
6093
|
+
const hasResolvedModules = useOnceTrue(internalCtx?.hasResolvedModules ?? false);
|
|
6035
6094
|
const usesHostAuth = internalCtx?.usesHostAuth ?? false;
|
|
6036
6095
|
const authFailed = internalCtx?.authFailed ?? false;
|
|
6037
6096
|
const idleHistory = internalCtx?.idleHistory ?? {
|
|
@@ -6057,7 +6116,7 @@ function Sidebar({
|
|
|
6057
6116
|
height: panelExpanded ? availableHeight : `min(${PANEL_MAX_HEIGHT_PX}px, ${availableHeight})`
|
|
6058
6117
|
};
|
|
6059
6118
|
}
|
|
6060
|
-
|
|
6119
|
+
useEffect29(() => {
|
|
6061
6120
|
if (!isSidebar)
|
|
6062
6121
|
return;
|
|
6063
6122
|
const prop = position === "right" ? "marginRight" : "marginLeft";
|
|
@@ -6077,7 +6136,7 @@ function Sidebar({
|
|
|
6077
6136
|
style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined, ...floatingStyle },
|
|
6078
6137
|
children: [
|
|
6079
6138
|
!hideHeader && /* @__PURE__ */ jsx25(ChatHeader, {}),
|
|
6080
|
-
authFailed ? /* @__PURE__ */ jsx25(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx25(AuthenticatedContent, {
|
|
6139
|
+
authFailed ? /* @__PURE__ */ jsx25(AuthError, {}) : isAuthenticated && hasResolvedModules ? /* @__PURE__ */ jsx25(AuthenticatedContent, {
|
|
6081
6140
|
isConnected,
|
|
6082
6141
|
isPaused,
|
|
6083
6142
|
isPausing,
|
|
@@ -6093,7 +6152,7 @@ function Sidebar({
|
|
|
6093
6152
|
onTalk: startDefaultSession,
|
|
6094
6153
|
talkLabel: startSessionLabel,
|
|
6095
6154
|
talkDisabled
|
|
6096
|
-
}) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx25("div", {
|
|
6155
|
+
}) : usesHostAuth || isValidating || isAuthenticated ? /* @__PURE__ */ jsx25("div", {
|
|
6097
6156
|
className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
|
|
6098
6157
|
children: /* @__PURE__ */ jsx25(LoadingDots, {
|
|
6099
6158
|
label: "Loading..."
|
|
@@ -6387,6 +6446,7 @@ function SidebarTrigger() {
|
|
|
6387
6446
|
const internalCtx = useContext14(LiveAgentContext);
|
|
6388
6447
|
const launcherBottomPx = internalCtx?.launcherBottomPx ?? DEFAULT_LAUNCHER_BOTTOM_PX;
|
|
6389
6448
|
const popsDown = internalCtx?.popsDown ?? false;
|
|
6449
|
+
const logoUrl = internalCtx?.appearance?.logoUrl ?? null;
|
|
6390
6450
|
if (isMinimized || isConnected || isStarting || isPausing)
|
|
6391
6451
|
return null;
|
|
6392
6452
|
const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
|
|
@@ -6399,6 +6459,10 @@ function SidebarTrigger() {
|
|
|
6399
6459
|
className: cn("skippr:fixed skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", isPanelOpen ? "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white" : "skippr:rounded-[10px] skippr:overflow-hidden", position === "right" ? "skippr:right-6" : "skippr:left-6"),
|
|
6400
6460
|
children: isPanelOpen ? /* @__PURE__ */ jsx27(ChevronDown, {
|
|
6401
6461
|
className: "skippr:size-5"
|
|
6462
|
+
}) : logoUrl ? /* @__PURE__ */ jsx27("img", {
|
|
6463
|
+
src: logoUrl,
|
|
6464
|
+
alt: "",
|
|
6465
|
+
className: "skippr:size-12 skippr:object-cover"
|
|
6402
6466
|
}) : /* @__PURE__ */ jsx27(Logo, {
|
|
6403
6467
|
className: "skippr:size-12"
|
|
6404
6468
|
})
|
|
@@ -6407,6 +6471,14 @@ function SidebarTrigger() {
|
|
|
6407
6471
|
|
|
6408
6472
|
// src/components/LiveAgent.tsx
|
|
6409
6473
|
import { jsx as jsx28, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
6474
|
+
function readSavedPosition() {
|
|
6475
|
+
try {
|
|
6476
|
+
const saved = localStorage.getItem("skippr_widget_position");
|
|
6477
|
+
return saved === "left" || saved === "right" ? saved : null;
|
|
6478
|
+
} catch {
|
|
6479
|
+
return null;
|
|
6480
|
+
}
|
|
6481
|
+
}
|
|
6410
6482
|
function readSavedLauncherBottom() {
|
|
6411
6483
|
try {
|
|
6412
6484
|
const saved = Number.parseInt(localStorage.getItem("skippr_widget_bottom") ?? "", 10);
|
|
@@ -6425,7 +6497,7 @@ function PlanPanelOpener() {
|
|
|
6425
6497
|
const plan = usePlanUpdates();
|
|
6426
6498
|
const { expandPanel } = useLiveAgent();
|
|
6427
6499
|
const surfacedPlanIdRef = useRef25(null);
|
|
6428
|
-
|
|
6500
|
+
useEffect30(() => {
|
|
6429
6501
|
if (plan?.state !== "proposed" || surfacedPlanIdRef.current === plan.planId)
|
|
6430
6502
|
return;
|
|
6431
6503
|
surfacedPlanIdRef.current = plan.planId;
|
|
@@ -6440,8 +6512,7 @@ function LiveAgent(props) {
|
|
|
6440
6512
|
appKey,
|
|
6441
6513
|
getUserToken,
|
|
6442
6514
|
userToken,
|
|
6443
|
-
|
|
6444
|
-
verticalAlign = "bottom",
|
|
6515
|
+
verticalAlign: hostVerticalAlign,
|
|
6445
6516
|
variant = "floating",
|
|
6446
6517
|
minimizable = true,
|
|
6447
6518
|
defaultOpen = false,
|
|
@@ -6465,7 +6536,7 @@ function LiveAgent(props) {
|
|
|
6465
6536
|
const auth = useAuth({ appKey });
|
|
6466
6537
|
const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
|
|
6467
6538
|
const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
|
|
6468
|
-
const [activeModule, setActiveModule] =
|
|
6539
|
+
const [activeModule, setActiveModule] = useState22(null);
|
|
6469
6540
|
const minimizeOnSessionStart = useCallback18(() => {
|
|
6470
6541
|
if (minimizable) {
|
|
6471
6542
|
setIsMinimized(true);
|
|
@@ -6519,28 +6590,29 @@ function LiveAgent(props) {
|
|
|
6519
6590
|
disconnect();
|
|
6520
6591
|
}, [disconnect]);
|
|
6521
6592
|
const isSessionLive = connection !== null || isStarting || isPausing || isDisconnecting;
|
|
6522
|
-
const [isPanelOpen, setIsPanelOpen] =
|
|
6523
|
-
const [isMinimized, setIsMinimized] =
|
|
6524
|
-
const [sidebarTab, setSidebarTab] =
|
|
6525
|
-
const [phasesSnapshot, setPhasesSnapshot] =
|
|
6526
|
-
const [textMode, setTextMode] =
|
|
6527
|
-
const [panelExpanded, setPanelExpanded] =
|
|
6593
|
+
const [isPanelOpen, setIsPanelOpen] = useState22(defaultOpen);
|
|
6594
|
+
const [isMinimized, setIsMinimized] = useState22(minimizable && !defaultOpen);
|
|
6595
|
+
const [sidebarTab, setSidebarTab] = useState22("agenda");
|
|
6596
|
+
const [phasesSnapshot, setPhasesSnapshot] = useState22([]);
|
|
6597
|
+
const [textMode, setTextMode] = useState22(false);
|
|
6598
|
+
const [panelExpanded, setPanelExpanded] = useState22(false);
|
|
6528
6599
|
const togglePanelExpanded = useCallback18(() => setPanelExpanded((prev) => !prev), []);
|
|
6529
6600
|
const panelRef = useRef25(null);
|
|
6530
6601
|
const controlBarRef = useRef25(null);
|
|
6531
|
-
const [isDragging, setIsDragging] =
|
|
6602
|
+
const [isDragging, setIsDragging] = useState22(false);
|
|
6532
6603
|
const setTextModeState = useCallback18((enabled) => {
|
|
6533
6604
|
setTextMode(enabled);
|
|
6534
6605
|
}, []);
|
|
6535
6606
|
const isConnected = connection !== null;
|
|
6536
6607
|
const showControlBar = isConnected || isStarting || isPausing;
|
|
6537
|
-
|
|
6608
|
+
useEffect30(() => {
|
|
6538
6609
|
if (!isConnected)
|
|
6539
6610
|
setTextModeState(false);
|
|
6540
6611
|
}, [isConnected, setTextModeState]);
|
|
6541
6612
|
const {
|
|
6542
6613
|
modules: availableModules,
|
|
6543
6614
|
defaultSelection,
|
|
6615
|
+
appearance,
|
|
6544
6616
|
isLoading: isLoadingModules,
|
|
6545
6617
|
hasResolved: hasResolvedModules,
|
|
6546
6618
|
error: modulesError,
|
|
@@ -6551,6 +6623,10 @@ function LiveAgent(props) {
|
|
|
6551
6623
|
authedFetch,
|
|
6552
6624
|
agentId: hostAgentId ?? undefined
|
|
6553
6625
|
});
|
|
6626
|
+
const isAuthenticated = bearerToken !== null || auth.isAuthenticated;
|
|
6627
|
+
const isBootAuthPending = usesHostAuth ? !!appKey && !isAuthenticated && !authFailed : !!appKey && !auth.hasResolvedStoredToken;
|
|
6628
|
+
const isAwaitingModules = isAuthenticated ? !hasResolvedModules : isBootAuthPending;
|
|
6629
|
+
const isLauncherRevealed = useOnceTrue(!isAwaitingModules);
|
|
6554
6630
|
const { goals: adoptionGoals, attendGoal } = useAdoptionGoals({
|
|
6555
6631
|
enabled: !isSessionLive,
|
|
6556
6632
|
bearerToken,
|
|
@@ -6596,27 +6672,38 @@ function LiveAgent(props) {
|
|
|
6596
6672
|
adoptionGoalId: goal.goalId
|
|
6597
6673
|
});
|
|
6598
6674
|
}, [attendGoal, availableModules, startSession]);
|
|
6599
|
-
const [welcomeDismissed, setWelcomeDismissed] =
|
|
6675
|
+
const [welcomeDismissed, setWelcomeDismissed] = useState22(false);
|
|
6600
6676
|
const dismissWelcome = useCallback18(() => setWelcomeDismissed(true), []);
|
|
6601
|
-
const [
|
|
6602
|
-
|
|
6603
|
-
|
|
6604
|
-
if (saved === "left" || saved === "right")
|
|
6605
|
-
return saved;
|
|
6606
|
-
} catch {}
|
|
6607
|
-
return position;
|
|
6608
|
-
});
|
|
6677
|
+
const [savedPosition] = useState22(readSavedPosition);
|
|
6678
|
+
const [currentPosition, setCurrentPosition] = useState22(savedPosition ?? "right");
|
|
6679
|
+
const positionLockedRef = useRef25(savedPosition !== null);
|
|
6609
6680
|
const setPositionWithPersist = useCallback18((pos) => {
|
|
6681
|
+
positionLockedRef.current = true;
|
|
6610
6682
|
setCurrentPosition(pos);
|
|
6611
6683
|
try {
|
|
6612
6684
|
localStorage.setItem("skippr_widget_position", pos);
|
|
6613
6685
|
} catch {}
|
|
6614
6686
|
}, []);
|
|
6615
|
-
const
|
|
6687
|
+
const serverPosition = appearance?.position ?? null;
|
|
6688
|
+
useEffect30(() => {
|
|
6689
|
+
if (!serverPosition || positionLockedRef.current)
|
|
6690
|
+
return;
|
|
6691
|
+
setCurrentPosition(serverPosition);
|
|
6692
|
+
}, [serverPosition]);
|
|
6693
|
+
const [savedLauncherBottom] = useState22(readSavedLauncherBottom);
|
|
6616
6694
|
const hasDraggedRef = useRef25(savedLauncherBottom !== null);
|
|
6617
|
-
const verticalAlignRef = useRef25(
|
|
6618
|
-
const [launcherBottomPx, setLauncherBottomPxState] =
|
|
6619
|
-
const [popsDown, setPopsDown] =
|
|
6695
|
+
const verticalAlignRef = useRef25(hostVerticalAlign ?? "bottom");
|
|
6696
|
+
const [launcherBottomPx, setLauncherBottomPxState] = useState22(() => savedLauncherBottom !== null ? clampLauncherBottom(savedLauncherBottom) : verticalAlignToBottomPx(verticalAlignRef.current));
|
|
6697
|
+
const [popsDown, setPopsDown] = useState22(() => launcherPopsDown(launcherBottomPx));
|
|
6698
|
+
const serverVerticalAlign = appearance?.verticalAlign ?? null;
|
|
6699
|
+
useEffect30(() => {
|
|
6700
|
+
if (!serverVerticalAlign || hostVerticalAlign !== undefined || hasDraggedRef.current)
|
|
6701
|
+
return;
|
|
6702
|
+
verticalAlignRef.current = serverVerticalAlign;
|
|
6703
|
+
const next = verticalAlignToBottomPx(serverVerticalAlign);
|
|
6704
|
+
setLauncherBottomPxState(next);
|
|
6705
|
+
setPopsDown(launcherPopsDown(next));
|
|
6706
|
+
}, [serverVerticalAlign, hostVerticalAlign]);
|
|
6620
6707
|
const setLauncherBottomPx = useCallback18((px) => {
|
|
6621
6708
|
hasDraggedRef.current = true;
|
|
6622
6709
|
setLauncherBottomPxState(px);
|
|
@@ -6631,7 +6718,7 @@ function LiveAgent(props) {
|
|
|
6631
6718
|
setPositionWithPersist(side);
|
|
6632
6719
|
setLauncherBottomPx(bottomPx);
|
|
6633
6720
|
}, [setPositionWithPersist, setLauncherBottomPx]);
|
|
6634
|
-
|
|
6721
|
+
useEffect30(() => {
|
|
6635
6722
|
const syncToViewport = () => {
|
|
6636
6723
|
const next = hasDraggedRef.current ? clampLauncherBottom(launcherBottomPxRef.current) : verticalAlignToBottomPx(verticalAlignRef.current);
|
|
6637
6724
|
setLauncherBottomPxState(next);
|
|
@@ -6658,7 +6745,6 @@ function LiveAgent(props) {
|
|
|
6658
6745
|
await pauseSession();
|
|
6659
6746
|
minimizePanel();
|
|
6660
6747
|
}, [pauseSession, minimizePanel]);
|
|
6661
|
-
const isAuthenticated = bearerToken !== null || auth.isAuthenticated;
|
|
6662
6748
|
const defaultAgentId = hostAgentId ?? defaultSelection.agentId;
|
|
6663
6749
|
const startDefaultSession = useCallback18(() => {
|
|
6664
6750
|
const target = availableModules.find((m) => m.id === defaultAgentId);
|
|
@@ -6755,6 +6841,7 @@ function LiveAgent(props) {
|
|
|
6755
6841
|
refetchModules,
|
|
6756
6842
|
selectModule,
|
|
6757
6843
|
hasResolvedModules,
|
|
6844
|
+
appearance,
|
|
6758
6845
|
adoptionGoals,
|
|
6759
6846
|
startAdoptionSession
|
|
6760
6847
|
}), [
|
|
@@ -6820,6 +6907,7 @@ function LiveAgent(props) {
|
|
|
6820
6907
|
refetchModules,
|
|
6821
6908
|
selectModule,
|
|
6822
6909
|
hasResolvedModules,
|
|
6910
|
+
appearance,
|
|
6823
6911
|
adoptionGoals,
|
|
6824
6912
|
startAdoptionSession
|
|
6825
6913
|
]);
|
|
@@ -6843,6 +6931,7 @@ function LiveAgent(props) {
|
|
|
6843
6931
|
pushOrTapMicMode: isRequestResponseMicMode(agentControls?.micMode)
|
|
6844
6932
|
}),
|
|
6845
6933
|
/* @__PURE__ */ jsxs22(ShadowHost, {
|
|
6934
|
+
accentColor: appearance?.accentColor ?? null,
|
|
6846
6935
|
children: [
|
|
6847
6936
|
connection && captureMode === CAPTURE_MODE.Auto && agentControls?.highlight && /* @__PURE__ */ jsx28(HighlightOverlay, {}),
|
|
6848
6937
|
connection && captureMode === CAPTURE_MODE.Auto && agentControls?.actions && /* @__PURE__ */ jsx28(PageActionHandler, {}),
|
|
@@ -6855,7 +6944,7 @@ function LiveAgent(props) {
|
|
|
6855
6944
|
children: /* @__PURE__ */ jsxs22("div", {
|
|
6856
6945
|
id: WIDGET_ROOT_ID,
|
|
6857
6946
|
children: [
|
|
6858
|
-
isMinimized && !showControlBar && /* @__PURE__ */ jsx28(MinimizedBubble, {
|
|
6947
|
+
isMinimized && !showControlBar && isLauncherRevealed && /* @__PURE__ */ jsx28(MinimizedBubble, {
|
|
6859
6948
|
welcomeMessage,
|
|
6860
6949
|
welcomeDismissed,
|
|
6861
6950
|
onDismissWelcome: dismissWelcome
|