@spear-ai/spectral 1.15.4 → 1.15.6

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.
@@ -6,7 +6,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
6
6
 
7
7
  //#region src/components/ButtonGroup/ButtonGroupButton.d.ts
8
8
  declare const buttonVariants: (props?: ({
9
- variant?: "default" | "outline" | null | undefined;
9
+ variant?: "default" | "divided" | "outline" | null | undefined;
10
10
  size?: "icon-lg" | "icon-md" | "icon-sm" | "lg" | "md" | "sm" | null | undefined;
11
11
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
12
12
  declare function ButtonGroupButton({
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonGroupButton.d.ts","names":[],"sources":["../../src/components/ButtonGroup/ButtonGroupButton.tsx"],"mappings":";;;;;;;cAKa,cAAA,GAAc,KAAA;;;IAsB1B,iCAAA,CAAA,SAAA;AAAA;EAGC,OAAA;EACA,SAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA,aACD,YAAA,QAAoB,cAAA;EAClB,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}
1
+ {"version":3,"file":"ButtonGroupButton.d.ts","names":[],"sources":["../../src/components/ButtonGroup/ButtonGroupButton.tsx"],"mappings":";;;;;;;cAKa,cAAA,GAAc,KAAA;;;IAuB1B,iCAAA,CAAA,SAAA;AAAA;EAGC,OAAA;EACA,SAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA,aACD,YAAA,QAAoB,cAAA;EAClB,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}
@@ -10,7 +10,8 @@ const buttonVariants = cva(`gap-2 text-sm font-medium [&_svg:not([class*='size-'
10
10
  variants: {
11
11
  variant: {
12
12
  default: "",
13
- outline: "border border-level-three"
13
+ outline: "border border-level-three",
14
+ divided: "border border-level-three"
14
15
  },
15
16
  size: {
16
17
  md: "h-9 px-4 py-2 has-[>svg]:px-3",
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonGroupButton.js","names":[],"sources":["../../src/components/ButtonGroup/ButtonGroupButton.tsx"],"sourcesContent":["import { Slot } from '@primitives/slot'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps } from 'react'\n\nexport const buttonVariants = cva(\n `gap-2 text-sm font-medium [&_svg:not([class*='size-'])]:size-4 aria-invalid:ring-destructive/20 aria-invalid:border-destructive inline-flex shrink-0 cursor-pointer items-center justify-center rounded-[var(--radius,0.375rem)] bg-level-one whitespace-nowrap text-text-primary transition-colors outline-none hover:bg-level-two focus-visible:border-accent focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:bg-accent active:text-text-inverted disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n default: '',\n outline: 'border border-level-three',\n },\n size: {\n md: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 px-6 has-[>svg]:px-4',\n 'icon-md': 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n },\n },\n)\n\nexport const ButtonGroupButton = ({\n asChild = false,\n className,\n size,\n variant,\n ...props\n}: ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean\n }) => {\n const Comp = asChild ? Slot : 'button'\n\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n data-size={size}\n data-slot='button-group-item'\n data-variant={variant}\n {...props}\n />\n )\n}\nButtonGroupButton.displayName = 'ButtonGroupButton'\n"],"mappings":";;;;;;;;AAKA,MAAa,iBAAiB,IAC5B,gkBACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACV;EACD,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,WAAW;GACX,WAAW;GACX,WAAW;GACZ;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAED,MAAa,qBAAqB,EAChC,UAAU,OACV,WACA,MACA,SACA,GAAG,YAIG;AAGN,QACE,oBAHW,UAAU,OAAO,UAG5B;EACE,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC;EAC3D,aAAW;EACX,aAAU;EACV,gBAAc;EACd,GAAI;EACJ;;AAGN,kBAAkB,cAAc"}
1
+ {"version":3,"file":"ButtonGroupButton.js","names":[],"sources":["../../src/components/ButtonGroup/ButtonGroupButton.tsx"],"sourcesContent":["import { Slot } from '@primitives/slot'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps } from 'react'\n\nexport const buttonVariants = cva(\n `gap-2 text-sm font-medium [&_svg:not([class*='size-'])]:size-4 aria-invalid:ring-destructive/20 aria-invalid:border-destructive inline-flex shrink-0 cursor-pointer items-center justify-center rounded-[var(--radius,0.375rem)] bg-level-one whitespace-nowrap text-text-primary transition-colors outline-none hover:bg-level-two focus-visible:border-accent focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:bg-accent active:text-text-inverted disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n default: '',\n outline: 'border border-level-three',\n divided: 'border border-level-three',\n },\n size: {\n md: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 px-6 has-[>svg]:px-4',\n 'icon-md': 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n },\n },\n)\n\nexport const ButtonGroupButton = ({\n asChild = false,\n className,\n size,\n variant,\n ...props\n}: ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean\n }) => {\n const Comp = asChild ? Slot : 'button'\n\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n data-size={size}\n data-slot='button-group-item'\n data-variant={variant}\n {...props}\n />\n )\n}\nButtonGroupButton.displayName = 'ButtonGroupButton'\n"],"mappings":";;;;;;;;AAKA,MAAa,iBAAiB,IAC5B,gkBACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACD,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,WAAW;GACX,WAAW;GACX,WAAW;GACZ;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAED,MAAa,qBAAqB,EAChC,UAAU,OACV,WACA,MACA,SACA,GAAG,YAIG;AAGN,QACE,oBAHW,UAAU,OAAO,UAG5B;EACE,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC;EAC3D,aAAW;EACX,aAAU;EACV,gBAAc;EACd,GAAI;EACJ;;AAGN,kBAAkB,cAAc"}
@@ -19,7 +19,7 @@ declare function ButtonGroup({
19
19
  ...props
20
20
  }: ComponentProps<'div'> & VariantProps<typeof buttonGroupVariants> & {
21
21
  size?: 'md' | 'sm' | 'lg' | 'icon-md' | 'icon-sm' | 'icon-lg';
22
- variant?: 'default' | 'outline';
22
+ variant?: 'default' | 'outline' | 'divided';
23
23
  }): _$react_jsx_runtime0.JSX.Element;
24
24
  declare namespace ButtonGroup {
25
25
  var displayName: string;
@@ -34,7 +34,7 @@ declare function ButtonGroupItem({
34
34
  }: ComponentProps<'button'> & {
35
35
  asChild?: boolean;
36
36
  size?: 'sm' | 'md' | 'lg' | 'icon-sm' | 'icon-md' | 'icon-lg';
37
- variant?: 'default' | 'outline';
37
+ variant?: 'default' | 'outline' | 'divided';
38
38
  }): _$react_jsx_runtime0.JSX.Element;
39
39
  declare namespace ButtonGroupItem {
40
40
  var displayName: string;
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonGroup.d.ts","names":[],"sources":["../src/components/ButtonGroup/ButtonGroup.tsx"],"mappings":";;;;;;;;KAYY,gBAAA,GAAmB,cAAA,QAAsB,WAAA,IAAe,YAAA,QAAoB,mBAAA;AAAA,cAE3E,mBAAA,GAAmB,KAAA;;IAa/B,iCAAA,CAAA,SAAA;AAAA;EAGC,QAAA;EACA,SAAA;EACA,WAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA,UACD,YAAA,QAAoB,mBAAA;EAClB,IAAA;EACA,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;;;;EA0BD,OAAA;EACA,QAAA;EACA,SAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA;EACD,OAAA;EACA,IAAA;EACA,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;;;cAkBY,eAAA;EAAe,OAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAIzB,cAAA;EACD,OAAA;AAAA,MACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;EAaC,SAAA;EACA,WAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,SAAA;EACvB,WAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}
1
+ {"version":3,"file":"ButtonGroup.d.ts","names":[],"sources":["../src/components/ButtonGroup/ButtonGroup.tsx"],"mappings":";;;;;;;;KAYY,gBAAA,GAAmB,cAAA,QAAsB,WAAA,IAAe,YAAA,QAAoB,mBAAA;AAAA,cAE3E,mBAAA,GAAmB,KAAA;;IAa/B,iCAAA,CAAA,SAAA;AAAA;EAGC,QAAA;EACA,SAAA;EACA,WAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA,UACD,YAAA,QAAoB,mBAAA;EAClB,IAAA;EACA,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;;;;EA2BD,OAAA;EACA,QAAA;EACA,SAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,cAAA;EACD,OAAA;EACA,IAAA;EACA,OAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;;;cAkBY,eAAA;EAAe,OAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAIzB,cAAA;EACD,OAAA;AAAA,MACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA;EAaC,SAAA;EACA,WAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,SAAA;EACvB,WAAA;AAAA,IACD,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}
@@ -8,7 +8,7 @@ import { jsx } from "react/jsx-runtime";
8
8
  import { cva } from "class-variance-authority";
9
9
 
10
10
  //#region src/components/ButtonGroup/ButtonGroup.tsx
11
- const buttonGroupVariants = cva(`has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2 flex w-fit items-stretch [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1`, {
11
+ const buttonGroupVariants = cva(`has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2 flex w-fit items-stretch [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 data-[variant='divided']:[&>[data-slot=button-group-item]]:border-y-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]]:border-x-0 data-[variant='divided']:[&>[data-slot=button-group-item]:first-of-type]:border-l-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]:first-of-type]:border-t-0 data-[variant='divided']:[&>[data-slot=button-group-item]:last-of-type]:border-r-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]:last-of-type]:border-b-0 [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1`, {
12
12
  variants: { orientation: {
13
13
  horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
14
14
  vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
@@ -22,6 +22,7 @@ const ButtonGroup = ({ children, className, orientation = "horizontal", size = "
22
22
  "data-orientation": orientation,
23
23
  "data-slot": "button-group",
24
24
  "data-testid": "spectral-button-group",
25
+ "data-variant": variant,
25
26
  role: "group",
26
27
  ...props,
27
28
  children: Children.map(children, (child) => {
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonGroup.js","names":[],"sources":["../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import { Separator } from '@components/Separator/Separator'\nimport { Slot } from '@primitives/slot'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Children, cloneElement, isValidElement, type ComponentProps, type ReactElement } from 'react'\nimport { ButtonGroupButton } from './ButtonGroupButton'\n\ninterface ButtonGroupChildProps {\n size?: 'md' | 'sm' | 'lg' | 'icon-md' | 'icon-sm' | 'icon-lg'\n variant?: 'default' | 'outline'\n}\n\nexport type ButtonGroupProps = ComponentProps<typeof ButtonGroup> & VariantProps<typeof buttonGroupVariants>\n\nexport const buttonGroupVariants = cva(\n `has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2 flex w-fit items-stretch [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1`,\n {\n variants: {\n orientation: {\n horizontal: '[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none',\n vertical: 'flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none',\n },\n },\n defaultVariants: {\n orientation: 'horizontal',\n },\n },\n)\n\nexport const ButtonGroup = ({\n children,\n className,\n orientation = 'horizontal',\n size = 'md',\n variant = 'default',\n ...props\n}: ComponentProps<'div'> &\n VariantProps<typeof buttonGroupVariants> & {\n size?: 'md' | 'sm' | 'lg' | 'icon-md' | 'icon-sm' | 'icon-lg'\n variant?: 'default' | 'outline'\n }) => {\n return (\n <div\n aria-label={props['aria-label']}\n className={cn(buttonGroupVariants({ orientation }), className)}\n data-orientation={orientation}\n data-slot='button-group'\n data-testid='spectral-button-group'\n role='group'\n {...props}\n >\n {Children.map(children, (child) => {\n if (isValidElement<ButtonGroupChildProps>(child) && (child.type === ButtonGroupItem || child.type === ButtonGroupButton)) {\n return cloneElement(child as ReactElement<ButtonGroupChildProps>, {\n variant: child.props.variant ?? variant,\n size: child.props.size ?? size,\n })\n }\n return child\n })}\n </div>\n )\n}\nButtonGroup.displayName = 'ButtonGroup'\n\nexport const ButtonGroupItem = ({\n asChild,\n children,\n className,\n size,\n variant,\n ...props\n}: ComponentProps<'button'> & {\n asChild?: boolean\n size?: 'sm' | 'md' | 'lg' | 'icon-sm' | 'icon-md' | 'icon-lg'\n variant?: 'default' | 'outline'\n}) => {\n return (\n <ButtonGroupButton\n asChild={asChild}\n className={cn(className)}\n data-slot='button-group-item'\n data-testid='spectral-button-group-item'\n data-variant={variant}\n size={size}\n variant={variant}\n {...props}\n >\n {children}\n </ButtonGroupButton>\n )\n}\nButtonGroupItem.displayName = 'ButtonGroupItem'\n\nexport const ButtonGroupText = ({\n asChild = false,\n className,\n ...props\n}: ComponentProps<'div'> & {\n asChild?: boolean\n}) => {\n const Comp = asChild ? Slot : 'div'\n return (\n <Comp\n className={cn(`bg-muted gap-2 rounded-md px-4 text-sm font-medium shadow-xs [&_svg:not([class*='size-'])]:size-4 flex items-center border [&_svg]:pointer-events-none`, className)}\n data-slot='button-group-text'\n data-testid='spectral-button-group-text'\n {...props}\n />\n )\n}\n\nexport const ButtonGroupSeparator = ({\n className,\n orientation = 'vertical',\n ...props\n}: ComponentProps<typeof Separator> & {\n orientation?: 'vertical' | 'horizontal'\n}) => {\n return (\n <Separator\n className={cn('m-0! relative self-stretch bg-input-primitive-border data-[orientation=vertical]:h-auto', className)}\n data-slot='button-group-separator'\n data-testid='spectral-button-group-separator'\n orientation={orientation}\n {...props}\n />\n )\n}\nButtonGroupSeparator.displayName = 'ButtonGroupSeparator'\n"],"mappings":";;;;;;;;;;AAcA,MAAa,sBAAsB,IACjC,oSACA;CACE,UAAU,EACR,aAAa;EACX,YAAY;EACZ,UAAU;EACX,EACF;CACD,iBAAiB,EACf,aAAa,cACd;CACF,CACF;AAED,MAAa,eAAe,EAC1B,UACA,WACA,cAAc,cACd,OAAO,MACP,UAAU,WACV,GAAG,YAKG;AACN,QACE,oBAAC,OAAD;EACE,cAAY,MAAM;EAClB,WAAW,GAAG,oBAAoB,EAAE,aAAa,CAAC,EAAE,UAAU;EAC9D,oBAAkB;EAClB,aAAU;EACV,eAAY;EACZ,MAAK;EACL,GAAI;YAEH,SAAS,IAAI,WAAW,UAAU;AACjC,OAAI,eAAsC,MAAM,KAAK,MAAM,SAAS,mBAAmB,MAAM,SAAS,mBACpG,QAAO,aAAa,OAA8C;IAChE,SAAS,MAAM,MAAM,WAAW;IAChC,MAAM,MAAM,MAAM,QAAQ;IAC3B,CAAC;AAEJ,UAAO;IACP;EACE;;AAGV,YAAY,cAAc;AAE1B,MAAa,mBAAmB,EAC9B,SACA,UACA,WACA,MACA,SACA,GAAG,YAKC;AACJ,QACE,oBAAC,mBAAD;EACW;EACT,WAAW,GAAG,UAAU;EACxB,aAAU;EACV,eAAY;EACZ,gBAAc;EACR;EACG;EACT,GAAI;EAEH;EACiB;;AAGxB,gBAAgB,cAAc;AAE9B,MAAa,mBAAmB,EAC9B,UAAU,OACV,WACA,GAAG,YAGC;AAEJ,QACE,oBAFW,UAAU,OAAO,OAE5B;EACE,WAAW,GAAG,0JAA0J,UAAU;EAClL,aAAU;EACV,eAAY;EACZ,GAAI;EACJ;;AAIN,MAAa,wBAAwB,EACnC,WACA,cAAc,YACd,GAAG,YAGC;AACJ,QACE,oBAAC,WAAD;EACE,WAAW,GAAG,2FAA2F,UAAU;EACnH,aAAU;EACV,eAAY;EACC;EACb,GAAI;EACJ;;AAGN,qBAAqB,cAAc"}
1
+ {"version":3,"file":"ButtonGroup.js","names":[],"sources":["../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import { Separator } from '@components/Separator/Separator'\nimport { Slot } from '@primitives/slot'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Children, cloneElement, isValidElement, type ComponentProps, type ReactElement } from 'react'\nimport { ButtonGroupButton } from './ButtonGroupButton'\n\ninterface ButtonGroupChildProps {\n size?: 'md' | 'sm' | 'lg' | 'icon-md' | 'icon-sm' | 'icon-lg'\n variant?: 'default' | 'outline' | 'divided'\n}\n\nexport type ButtonGroupProps = ComponentProps<typeof ButtonGroup> & VariantProps<typeof buttonGroupVariants>\n\nexport const buttonGroupVariants = cva(\n `has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2 flex w-fit items-stretch [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 data-[variant='divided']:[&>[data-slot=button-group-item]]:border-y-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]]:border-x-0 data-[variant='divided']:[&>[data-slot=button-group-item]:first-of-type]:border-l-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]:first-of-type]:border-t-0 data-[variant='divided']:[&>[data-slot=button-group-item]:last-of-type]:border-r-0 data-[orientation='vertical']:data-[variant='divided']:[&>[data-slot=button-group-item]:last-of-type]:border-b-0 [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1`,\n {\n variants: {\n orientation: {\n horizontal: '[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none',\n vertical: 'flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none',\n },\n },\n defaultVariants: {\n orientation: 'horizontal',\n },\n },\n)\n\nexport const ButtonGroup = ({\n children,\n className,\n orientation = 'horizontal',\n size = 'md',\n variant = 'default',\n ...props\n}: ComponentProps<'div'> &\n VariantProps<typeof buttonGroupVariants> & {\n size?: 'md' | 'sm' | 'lg' | 'icon-md' | 'icon-sm' | 'icon-lg'\n variant?: 'default' | 'outline' | 'divided'\n }) => {\n return (\n <div\n aria-label={props['aria-label']}\n className={cn(buttonGroupVariants({ orientation }), className)}\n data-orientation={orientation}\n data-slot='button-group'\n data-testid='spectral-button-group'\n data-variant={variant}\n role='group'\n {...props}\n >\n {Children.map(children, (child) => {\n if (isValidElement<ButtonGroupChildProps>(child) && (child.type === ButtonGroupItem || child.type === ButtonGroupButton)) {\n return cloneElement(child as ReactElement<ButtonGroupChildProps>, {\n variant: child.props.variant ?? variant,\n size: child.props.size ?? size,\n })\n }\n return child\n })}\n </div>\n )\n}\nButtonGroup.displayName = 'ButtonGroup'\n\nexport const ButtonGroupItem = ({\n asChild,\n children,\n className,\n size,\n variant,\n ...props\n}: ComponentProps<'button'> & {\n asChild?: boolean\n size?: 'sm' | 'md' | 'lg' | 'icon-sm' | 'icon-md' | 'icon-lg'\n variant?: 'default' | 'outline' | 'divided'\n}) => {\n return (\n <ButtonGroupButton\n asChild={asChild}\n className={cn(className)}\n data-slot='button-group-item'\n data-testid='spectral-button-group-item'\n data-variant={variant}\n size={size}\n variant={variant}\n {...props}\n >\n {children}\n </ButtonGroupButton>\n )\n}\nButtonGroupItem.displayName = 'ButtonGroupItem'\n\nexport const ButtonGroupText = ({\n asChild = false,\n className,\n ...props\n}: ComponentProps<'div'> & {\n asChild?: boolean\n}) => {\n const Comp = asChild ? Slot : 'div'\n return (\n <Comp\n className={cn(`bg-muted gap-2 rounded-md px-4 text-sm font-medium shadow-xs [&_svg:not([class*='size-'])]:size-4 flex items-center border [&_svg]:pointer-events-none`, className)}\n data-slot='button-group-text'\n data-testid='spectral-button-group-text'\n {...props}\n />\n )\n}\n\nexport const ButtonGroupSeparator = ({\n className,\n orientation = 'vertical',\n ...props\n}: ComponentProps<typeof Separator> & {\n orientation?: 'vertical' | 'horizontal'\n}) => {\n return (\n <Separator\n className={cn('m-0! relative self-stretch bg-input-primitive-border data-[orientation=vertical]:h-auto', className)}\n data-slot='button-group-separator'\n data-testid='spectral-button-group-separator'\n orientation={orientation}\n {...props}\n />\n )\n}\nButtonGroupSeparator.displayName = 'ButtonGroupSeparator'\n"],"mappings":";;;;;;;;;;AAcA,MAAa,sBAAsB,IACjC,w1BACA;CACE,UAAU,EACR,aAAa;EACX,YAAY;EACZ,UAAU;EACX,EACF;CACD,iBAAiB,EACf,aAAa,cACd;CACF,CACF;AAED,MAAa,eAAe,EAC1B,UACA,WACA,cAAc,cACd,OAAO,MACP,UAAU,WACV,GAAG,YAKG;AACN,QACE,oBAAC,OAAD;EACE,cAAY,MAAM;EAClB,WAAW,GAAG,oBAAoB,EAAE,aAAa,CAAC,EAAE,UAAU;EAC9D,oBAAkB;EAClB,aAAU;EACV,eAAY;EACZ,gBAAc;EACd,MAAK;EACL,GAAI;YAEH,SAAS,IAAI,WAAW,UAAU;AACjC,OAAI,eAAsC,MAAM,KAAK,MAAM,SAAS,mBAAmB,MAAM,SAAS,mBACpG,QAAO,aAAa,OAA8C;IAChE,SAAS,MAAM,MAAM,WAAW;IAChC,MAAM,MAAM,MAAM,QAAQ;IAC3B,CAAC;AAEJ,UAAO;IACP;EACE;;AAGV,YAAY,cAAc;AAE1B,MAAa,mBAAmB,EAC9B,SACA,UACA,WACA,MACA,SACA,GAAG,YAKC;AACJ,QACE,oBAAC,mBAAD;EACW;EACT,WAAW,GAAG,UAAU;EACxB,aAAU;EACV,eAAY;EACZ,gBAAc;EACR;EACG;EACT,GAAI;EAEH;EACiB;;AAGxB,gBAAgB,cAAc;AAE9B,MAAa,mBAAmB,EAC9B,UAAU,OACV,WACA,GAAG,YAGC;AAEJ,QACE,oBAFW,UAAU,OAAO,OAE5B;EACE,WAAW,GAAG,0JAA0J,UAAU;EAClL,aAAU;EACV,eAAY;EACZ,GAAI;EACJ;;AAIN,MAAa,wBAAwB,EACnC,WACA,cAAc,YACd,GAAG,YAGC;AACJ,QACE,oBAAC,WAAD;EACE,WAAW,GAAG,2FAA2F,UAAU;EACnH,aAAU;EACV,eAAY;EACC;EACb,GAAI;EACJ;;AAGN,qBAAqB,cAAc"}
@@ -5,20 +5,20 @@ import { cloneElement, isValidElement } from "react";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
 
7
7
  //#region src/components/ButtonIcon/ButtonIcon.tsx
8
- const buttonStyles = `bg-level-one hover:bg-level-three text-text-primary hover:text-text-secondary inline-flex items-center justify-center whitespace-nowrap transition-[background-color,color,transform]
8
+ const buttonStyles = `bg-level-one hover:bg-level-three text-text-primary hover:text-text-secondary inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-[background-color,color,transform]
9
9
  active:scale-[0.97] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-level-three cursor-pointer [&_svg]:pointer-events-none [&_svg]:shrink-0 disabled:opacity-50
10
10
  disabled:pointer-events-none disabled:text-text-secondary disabled:hover:bg-level-one`;
11
11
  const sizeConfig = {
12
12
  sm: {
13
- button: "size-8",
13
+ button: "size-8 min-size-8",
14
14
  icon: 16
15
15
  },
16
16
  md: {
17
- button: "size-10",
17
+ button: "size-10 min-size-10",
18
18
  icon: 24
19
19
  },
20
20
  lg: {
21
- button: "size-12",
21
+ button: "size-12 min-size-12",
22
22
  icon: 32
23
23
  }
24
24
  };
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.js","names":[],"sources":["../src/components/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { LoaderIcon } from '@components/Icons'\nimport { cn } from '@utils/twUtils'\nimport { cloneElement, isValidElement, type ButtonHTMLAttributes, type MouseEvent, type ReactElement, type Ref, type SVGProps } from 'react'\n\ntype IconOrSVG = ReactElement | (() => ReactElement)\n\nexport interface ButtonIconProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {\n className?: string\n icon: IconOrSVG\n isLoading?: boolean\n label: string\n onClick?: (event: MouseEvent<HTMLButtonElement>) => void\n shape?: 'circle' | 'square'\n size?: 'sm' | 'md' | 'lg'\n}\n\nconst buttonStyles = `bg-level-one hover:bg-level-three text-text-primary hover:text-text-secondary inline-flex items-center justify-center whitespace-nowrap transition-[background-color,color,transform]\n active:scale-[0.97] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-level-three cursor-pointer [&_svg]:pointer-events-none [&_svg]:shrink-0 disabled:opacity-50\n disabled:pointer-events-none disabled:text-text-secondary disabled:hover:bg-level-one`\n\nconst sizeConfig = {\n sm: { button: 'size-8', icon: 16 },\n md: { button: 'size-10', icon: 24 },\n lg: { button: 'size-12', icon: 32 },\n} as const\n\nexport const ButtonIcon = ({\n className,\n disabled,\n icon,\n isLoading = false,\n label,\n onClick,\n ref,\n shape = 'square',\n size = 'md',\n ...props\n}: ButtonIconProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => onClick?.(event)\n\n const effectiveLabel = isLoading ? `${label} - Loading` : label\n\n const renderIcon = (): ReactElement => {\n if (isLoading) {\n return (\n <LoaderIcon\n size={sizeConfig[size as keyof typeof sizeConfig].icon}\n aria-hidden='true'\n />\n )\n }\n\n const iconElement = typeof icon === 'function' ? icon() : icon\n\n if (isValidElement(iconElement)) {\n const currentSize = sizeConfig[size as keyof typeof sizeConfig].icon\n\n if (iconElement.type === 'svg') {\n return cloneElement(iconElement as ReactElement<SVGProps<SVGSVGElement>>, {\n className: cn('shrink-0', (iconElement.props as { className?: string }).className),\n height: currentSize,\n width: currentSize,\n 'aria-hidden': 'true',\n })\n }\n\n // For icon components, pass size prop if the element accepts it\n const baseIconProps = {\n 'aria-hidden': 'true',\n className: cn('shrink-0', (iconElement.props as { className?: string }).className),\n }\n\n // Check if this is an icon component that accepts size prop\n // All our icon components accept refs and have displayName containing 'Icon'\n const componentType = iconElement.type as { displayName?: string }\n const isIconComponent = componentType.displayName?.endsWith('Icon') ?? false\n\n if (isIconComponent) {\n const iconPropsWithSize = {\n ...baseIconProps,\n size: currentSize,\n }\n return cloneElement(iconElement, iconPropsWithSize)\n }\n\n return cloneElement(iconElement, baseIconProps)\n }\n\n return iconElement\n }\n\n return (\n <button\n aria-label={effectiveLabel}\n className={cn(buttonStyles, shape === 'circle' ? 'rounded-full' : 'rounded-xl', sizeConfig[size as keyof typeof sizeConfig].button, isLoading && 'cursor-wait', disabled && 'cursor-not-allowed opacity-50', className)}\n data-testid='spectral-button-icon'\n disabled={disabled ?? isLoading}\n onClick={handleClick}\n ref={ref}\n type='button'\n {...props}\n >\n {renderIcon()}\n </button>\n )\n}\nButtonIcon.displayName = 'ButtonIcon'\n"],"mappings":";;;;;;;AAgBA,MAAM,eAAe;;;AAIrB,MAAM,aAAa;CACjB,IAAI;EAAE,QAAQ;EAAU,MAAM;EAAI;CAClC,IAAI;EAAE,QAAQ;EAAW,MAAM;EAAI;CACnC,IAAI;EAAE,QAAQ;EAAW,MAAM;EAAI;CACpC;AAED,MAAa,cAAc,EACzB,WACA,UACA,MACA,YAAY,OACZ,OACA,SACA,KACA,QAAQ,UACR,OAAO,MACP,GAAG,YAGC;CACJ,MAAM,eAAe,UAAyC,UAAU,MAAM;CAE9E,MAAM,iBAAiB,YAAY,GAAG,MAAM,cAAc;CAE1D,MAAM,mBAAiC;AACrC,MAAI,UACF,QACE,oBAAC,YAAD;GACE,MAAM,WAAW,MAAiC;GAClD,eAAY;GACZ;EAIN,MAAM,cAAc,OAAO,SAAS,aAAa,MAAM,GAAG;AAE1D,MAAI,eAAe,YAAY,EAAE;GAC/B,MAAM,cAAc,WAAW,MAAiC;AAEhE,OAAI,YAAY,SAAS,MACvB,QAAO,aAAa,aAAsD;IACxE,WAAW,GAAG,YAAa,YAAY,MAAiC,UAAU;IAClF,QAAQ;IACR,OAAO;IACP,eAAe;IAChB,CAAC;GAIJ,MAAM,gBAAgB;IACpB,eAAe;IACf,WAAW,GAAG,YAAa,YAAY,MAAiC,UAAU;IACnF;AAOD,OAHsB,YAAY,KACI,aAAa,SAAS,OAAO,IAAI,MAOrE,QAAO,aAAa,aAAa;IAH/B,GAAG;IACH,MAAM;IAE0C,CAAC;AAGrD,UAAO,aAAa,aAAa,cAAc;;AAGjD,SAAO;;AAGT,QACE,oBAAC,UAAD;EACE,cAAY;EACZ,WAAW,GAAG,cAAc,UAAU,WAAW,iBAAiB,cAAc,WAAW,MAAiC,QAAQ,aAAa,eAAe,YAAY,iCAAiC,UAAU;EACvN,eAAY;EACZ,UAAU,YAAY;EACtB,SAAS;EACJ;EACL,MAAK;EACL,GAAI;YAEH,YAAY;EACN;;AAGb,WAAW,cAAc"}
1
+ {"version":3,"file":"ButtonIcon.js","names":[],"sources":["../src/components/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { LoaderIcon } from '@components/Icons'\nimport { cn } from '@utils/twUtils'\nimport { cloneElement, isValidElement, type ButtonHTMLAttributes, type MouseEvent, type ReactElement, type Ref, type SVGProps } from 'react'\n\ntype IconOrSVG = ReactElement | (() => ReactElement)\n\nexport interface ButtonIconProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {\n className?: string\n icon: IconOrSVG\n isLoading?: boolean\n label: string\n onClick?: (event: MouseEvent<HTMLButtonElement>) => void\n shape?: 'circle' | 'square'\n size?: 'sm' | 'md' | 'lg'\n}\n\nconst buttonStyles = `bg-level-one hover:bg-level-three text-text-primary hover:text-text-secondary inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-[background-color,color,transform]\n active:scale-[0.97] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-level-three cursor-pointer [&_svg]:pointer-events-none [&_svg]:shrink-0 disabled:opacity-50\n disabled:pointer-events-none disabled:text-text-secondary disabled:hover:bg-level-one`\n\nconst sizeConfig = {\n sm: { button: 'size-8 min-size-8', icon: 16 },\n md: { button: 'size-10 min-size-10', icon: 24 },\n lg: { button: 'size-12 min-size-12', icon: 32 },\n} as const\n\nexport const ButtonIcon = ({\n className,\n disabled,\n icon,\n isLoading = false,\n label,\n onClick,\n ref,\n shape = 'square',\n size = 'md',\n ...props\n}: ButtonIconProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => onClick?.(event)\n\n const effectiveLabel = isLoading ? `${label} - Loading` : label\n\n const renderIcon = (): ReactElement => {\n if (isLoading) {\n return (\n <LoaderIcon\n size={sizeConfig[size as keyof typeof sizeConfig].icon}\n aria-hidden='true'\n />\n )\n }\n\n const iconElement = typeof icon === 'function' ? icon() : icon\n\n if (isValidElement(iconElement)) {\n const currentSize = sizeConfig[size as keyof typeof sizeConfig].icon\n\n if (iconElement.type === 'svg') {\n return cloneElement(iconElement as ReactElement<SVGProps<SVGSVGElement>>, {\n className: cn('shrink-0', (iconElement.props as { className?: string }).className),\n height: currentSize,\n width: currentSize,\n 'aria-hidden': 'true',\n })\n }\n\n // For icon components, pass size prop if the element accepts it\n const baseIconProps = {\n 'aria-hidden': 'true',\n className: cn('shrink-0', (iconElement.props as { className?: string }).className),\n }\n\n // Check if this is an icon component that accepts size prop\n // All our icon components accept refs and have displayName containing 'Icon'\n const componentType = iconElement.type as { displayName?: string }\n const isIconComponent = componentType.displayName?.endsWith('Icon') ?? false\n\n if (isIconComponent) {\n const iconPropsWithSize = {\n ...baseIconProps,\n size: currentSize,\n }\n return cloneElement(iconElement, iconPropsWithSize)\n }\n\n return cloneElement(iconElement, baseIconProps)\n }\n\n return iconElement\n }\n\n return (\n <button\n aria-label={effectiveLabel}\n className={cn(buttonStyles, shape === 'circle' ? 'rounded-full' : 'rounded-xl', sizeConfig[size as keyof typeof sizeConfig].button, isLoading && 'cursor-wait', disabled && 'cursor-not-allowed opacity-50', className)}\n data-testid='spectral-button-icon'\n disabled={disabled ?? isLoading}\n onClick={handleClick}\n ref={ref}\n type='button'\n {...props}\n >\n {renderIcon()}\n </button>\n )\n}\nButtonIcon.displayName = 'ButtonIcon'\n"],"mappings":";;;;;;;AAgBA,MAAM,eAAe;;;AAIrB,MAAM,aAAa;CACjB,IAAI;EAAE,QAAQ;EAAqB,MAAM;EAAI;CAC7C,IAAI;EAAE,QAAQ;EAAuB,MAAM;EAAI;CAC/C,IAAI;EAAE,QAAQ;EAAuB,MAAM;EAAI;CAChD;AAED,MAAa,cAAc,EACzB,WACA,UACA,MACA,YAAY,OACZ,OACA,SACA,KACA,QAAQ,UACR,OAAO,MACP,GAAG,YAGC;CACJ,MAAM,eAAe,UAAyC,UAAU,MAAM;CAE9E,MAAM,iBAAiB,YAAY,GAAG,MAAM,cAAc;CAE1D,MAAM,mBAAiC;AACrC,MAAI,UACF,QACE,oBAAC,YAAD;GACE,MAAM,WAAW,MAAiC;GAClD,eAAY;GACZ;EAIN,MAAM,cAAc,OAAO,SAAS,aAAa,MAAM,GAAG;AAE1D,MAAI,eAAe,YAAY,EAAE;GAC/B,MAAM,cAAc,WAAW,MAAiC;AAEhE,OAAI,YAAY,SAAS,MACvB,QAAO,aAAa,aAAsD;IACxE,WAAW,GAAG,YAAa,YAAY,MAAiC,UAAU;IAClF,QAAQ;IACR,OAAO;IACP,eAAe;IAChB,CAAC;GAIJ,MAAM,gBAAgB;IACpB,eAAe;IACf,WAAW,GAAG,YAAa,YAAY,MAAiC,UAAU;IACnF;AAOD,OAHsB,YAAY,KACI,aAAa,SAAS,OAAO,IAAI,MAOrE,QAAO,aAAa,aAAa;IAH/B,GAAG;IACH,MAAM;IAE0C,CAAC;AAGrD,UAAO,aAAa,aAAa,cAAc;;AAGjD,SAAO;;AAGT,QACE,oBAAC,UAAD;EACE,cAAY;EACZ,WAAW,GAAG,cAAc,UAAU,WAAW,iBAAiB,cAAc,WAAW,MAAiC,QAAQ,aAAa,eAAe,YAAY,iCAAiC,UAAU;EACvN,eAAY;EACZ,UAAU,YAAY;EACtB,SAAS;EACJ;EACL,MAAK;EACL,GAAI;YAEH,YAAY;EACN;;AAGb,WAAW,cAAc"}
@@ -17,7 +17,7 @@ interface RadioButtonGroupProps {
17
17
  onValueChange?: (value: string) => void;
18
18
  orientation?: 'horizontal' | 'vertical';
19
19
  value?: string;
20
- variant?: 'default' | 'outline';
20
+ variant?: 'default' | 'outline' | 'divided';
21
21
  'aria-label'?: string;
22
22
  'aria-labelledby'?: string;
23
23
  }
@@ -94,7 +94,7 @@ const RadioButtonGroupBase = ({ "aria-label": ariaLabel, "aria-labelledby": aria
94
94
  children: /* @__PURE__ */ jsx("div", {
95
95
  "aria-label": ariaLabel,
96
96
  "aria-labelledby": ariaLabelledby,
97
- className: cn("rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md flex h-fit w-fit items-center", "data-[expanded=true]:w-full", `data-[variant=outline]:gap-0 data-[variant=outline]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=outline]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)]`, className),
97
+ className: cn("rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md flex h-fit w-fit items-center", "data-[expanded=true]:w-full", `data-[variant=outline]:gap-0 data-[variant=divided]:gap-0 data-[variant=divided]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=outline]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=divided]:[&_button]:border-y-0 data-[variant=divided]:[&_button:first-of-type]:border-l-0 data-[variant=divided]:[&_button:last-of-type]:border-r-0 data-[variant=divided]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant=outline]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)]`, className),
98
98
  "data-expanded": expanded,
99
99
  "data-orientation": orientation,
100
100
  "data-testid": "spectral-radio-button-group",
@@ -1 +1 @@
1
- {"version":3,"file":"RadioButtonGroupBase.js","names":[],"sources":["../../src/components/RadioButtonGroup/RadioButtonGroupBase.tsx"],"sourcesContent":["import { Slot, type AsChildProp } from '@primitives/slot'\nimport { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { createContext, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, type ButtonHTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode, type Ref } from 'react'\n\ninterface RadioButtonGroupContextValue {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n focusItemByIndex: (index: number) => void\n getIndexByValue: (value: string) => number\n isDisabledAtIndex: (index: number) => boolean\n itemCount: () => number\n loop: boolean\n orientation: 'horizontal' | 'vertical'\n selectByIndex: (index: number) => void\n onValueChange?: (value: string) => void\n value?: string\n isKeptActive?: boolean\n expanded?: boolean\n variant?: 'default' | 'outline'\n register: (value: string, element: HTMLButtonElement | null, disabled: boolean) => () => void\n}\n\nconst RadioButtonGroupContext = createContext<RadioButtonGroupContextValue | null>(null)\n\nexport interface RadioButtonGroupProps {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n asChild?: boolean\n children: ReactNode\n className?: string\n expanded?: boolean\n isKeptActive?: boolean\n loop?: boolean\n onValueChange?: (value: string) => void\n orientation?: 'horizontal' | 'vertical'\n value?: string\n variant?: 'default' | 'outline'\n 'aria-label'?: string\n 'aria-labelledby'?: string\n}\n\nexport interface RadioButtonGroupItemProps extends AsChildProp, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onSelect' | 'type'> {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n children: ReactNode\n onSelect?: (value: string) => void\n value: string\n}\n\ninterface RadioButtonRegistryItem {\n value: string\n element: HTMLButtonElement | null\n disabled: boolean\n}\n\nexport const RadioButtonGroupBase = ({\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n activeColor = 'default',\n activeTextColor,\n children,\n className,\n expanded = false,\n isKeptActive = false,\n loop = true,\n onValueChange,\n orientation = 'horizontal',\n value,\n variant = 'default',\n}: RadioButtonGroupProps) => {\n const [registry, setRegistry] = useState<RadioButtonRegistryItem[]>([])\n\n const register = useCallback((nextValue: string, element: HTMLButtonElement | null, disabled: boolean) => {\n setRegistry((previousRegistry) => {\n const existingIndex = previousRegistry.findIndex((item) => item.value === nextValue)\n\n if (existingIndex !== -1) {\n const existingItem = previousRegistry[existingIndex]\n if (existingItem?.element === element && existingItem.disabled === disabled) return previousRegistry\n\n return previousRegistry.map((item, index) => (index === existingIndex ? { value: nextValue, element, disabled } : item))\n }\n\n return [...previousRegistry, { value: nextValue, element, disabled }]\n })\n\n return () => {\n setRegistry((previousRegistry) => previousRegistry.filter((item) => item.value !== nextValue))\n }\n }, [])\n\n const getIndexByValue = useCallback((itemValue: string) => registry.findIndex((item) => item.value === itemValue), [registry])\n const itemCount = useCallback(() => registry.length, [registry])\n const isDisabledAtIndex = useCallback((index: number) => registry[index]?.disabled ?? false, [registry])\n\n const getNextEnabledIndex = useCallback(\n (startIndex: number, direction: 1 | -1) => {\n const items = registry\n if (items.length === 0) return -1\n\n let currentIndex = startIndex\n for (let attempt = 0; attempt < items.length; attempt += 1) {\n if (!loop && (currentIndex < 0 || currentIndex >= items.length)) return -1\n const boundedIndex = loop ? (currentIndex + items.length) % items.length : currentIndex\n if (!items[boundedIndex]?.disabled) return boundedIndex\n currentIndex += direction\n }\n\n return -1\n },\n [loop, registry],\n )\n\n const focusItemByIndex = useCallback(\n (index: number) => {\n const targetIndex = getNextEnabledIndex(index, 1)\n if (targetIndex === -1) return\n registry[targetIndex]?.element?.focus()\n },\n [getNextEnabledIndex, registry],\n )\n\n const selectByIndex = useCallback(\n (index: number) => {\n const target = registry[index]\n if (!target || target.disabled) return\n onValueChange?.(target.value)\n },\n [onValueChange, registry],\n )\n\n const contextValue = useMemo(\n () => ({\n activeColor,\n activeTextColor,\n focusItemByIndex,\n getIndexByValue,\n isDisabledAtIndex,\n itemCount,\n loop,\n onValueChange,\n orientation,\n selectByIndex,\n value,\n isKeptActive,\n expanded,\n variant,\n register,\n }),\n [activeColor, activeTextColor, expanded, focusItemByIndex, getIndexByValue, isDisabledAtIndex, isKeptActive, itemCount, loop, onValueChange, orientation, register, selectByIndex, value, variant],\n )\n\n return (\n <RadioButtonGroupContext.Provider value={contextValue}>\n <div\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n className={cn(\n 'rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md flex h-fit w-fit items-center',\n 'data-[expanded=true]:w-full',\n `data-[variant=outline]:gap-0 data-[variant=outline]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=outline]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)]`,\n className,\n )}\n data-expanded={expanded}\n data-orientation={orientation}\n data-testid='spectral-radio-button-group'\n data-variant={variant}\n aria-orientation={orientation}\n role='radiogroup'\n >\n {children}\n </div>\n </RadioButtonGroupContext.Provider>\n )\n}\n\nexport const RadioButtonGroupItem = ({\n asChild = false,\n activeColor,\n activeTextColor,\n children,\n className,\n disabled = false,\n onClick,\n onSelect,\n ref,\n style,\n value,\n ...rest\n}: RadioButtonGroupItemProps & {\n ref?: Ref<HTMLButtonElement | null>\n}) => {\n const context = useContext(RadioButtonGroupContext)\n\n if (!context) {\n throw new Error('RadioButtonGroupItem must be used within a RadioButtonGroup')\n }\n\n const { activeColor: contextActiveColor, activeTextColor: contextActiveTextColor, value: selectedValue, onValueChange, isKeptActive, expanded, variant, orientation, register, getIndexByValue, isDisabledAtIndex, focusItemByIndex, itemCount, loop, selectByIndex } = context\n const isSelected = selectedValue === value\n const resolvedActiveColor = activeColor ?? contextActiveColor\n const resolvedActiveTextColor = activeTextColor ?? contextActiveTextColor\n const itemRef = useRef<HTMLButtonElement | null>(null)\n\n useImperativeHandle<HTMLButtonElement | null, HTMLButtonElement | null>(ref, () => itemRef.current)\n\n useEffect(() => register(value, itemRef.current, disabled), [disabled, register, value])\n\n const setItemRef = (node: HTMLButtonElement | null) => {\n itemRef.current = node\n if (!ref) return\n if (typeof ref === 'function') {\n ref(node)\n return\n }\n ref.current = node\n }\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n if (onClick) onClick(event)\n if (event.defaultPrevented) return\n if (!disabled) {\n if (onValueChange) {\n onValueChange(value)\n }\n if (onSelect) {\n onSelect(value)\n }\n }\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (rest.onKeyDown) rest.onKeyDown(event)\n if (event.defaultPrevented) return\n\n const currentIndex = getIndexByValue(value)\n if (currentIndex === -1) return\n\n const key = event.key\n const isHorizontal = orientation === 'horizontal'\n const moveNext = (isHorizontal && key === 'ArrowRight') || (!isHorizontal && key === 'ArrowDown')\n const movePrev = (isHorizontal && key === 'ArrowLeft') || (!isHorizontal && key === 'ArrowUp')\n\n if (key === 'Home') {\n event.preventDefault()\n for (let index = 0; index < itemCount(); index += 1) {\n if (!isDisabledAtIndex(index)) {\n selectByIndex(index)\n focusItemByIndex(index)\n return\n }\n }\n return\n }\n\n if (key === 'End') {\n event.preventDefault()\n for (let index = itemCount() - 1; index >= 0; index -= 1) {\n if (!isDisabledAtIndex(index)) {\n selectByIndex(index)\n focusItemByIndex(index)\n return\n }\n }\n return\n }\n\n if (!moveNext && !movePrev) return\n event.preventDefault()\n\n const direction = moveNext ? 1 : -1\n let nextIndex = currentIndex + direction\n for (let attempt = 0; attempt < itemCount(); attempt += 1) {\n if (!loop && (nextIndex < 0 || nextIndex >= itemCount())) return\n const boundedIndex = loop ? (nextIndex + itemCount()) % itemCount() : nextIndex\n if (!isDisabledAtIndex(boundedIndex)) {\n selectByIndex(boundedIndex)\n focusItemByIndex(boundedIndex)\n return\n }\n nextIndex += direction\n }\n }\n\n const selectedIndex = selectedValue ? getIndexByValue(selectedValue) : -1\n const firstEnabledIndex = (() => {\n for (let index = 0; index < itemCount(); index += 1) {\n if (!isDisabledAtIndex(index)) return index\n }\n return -1\n })()\n const currentIndex = getIndexByValue(value)\n const tabIndex = isSelected || (selectedIndex === -1 && firstEnabledIndex !== -1 && currentIndex === firstEnabledIndex) ? 0 : -1\n\n const baseProps = {\n ...rest,\n className: cn(\n `gap-2 text-sm font-medium h-9 px-3 min-w-9 [&_svg:not([class*='size-']):not([width]):not([height])]:size-4 inline-flex items-center justify-center rounded-none border border-toggle-border bg-toggle-bg text-toggle-text shadow-none transition-colors hover:cursor-pointer hover:border-toggle-border--hover hover:bg-toggle-bg--hover hover:text-toggle-text--hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:border-toggle-border--active active:bg-toggle-bg--active active:text-toggle-text--active disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&:not(:first-child)]:border-l-0`,\n expanded && 'w-full',\n isKeptActive && 'data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active data-[state=on]:text-toggle-text--active',\n className,\n ),\n style: { ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor), ...style },\n disabled,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n role: 'radio',\n 'aria-checked': isSelected,\n 'data-state': isSelected ? 'on' : 'off',\n 'data-testid': 'spectral-radio-button-group-item',\n 'data-variant': variant,\n tabIndex: disabled ? -1 : tabIndex,\n }\n\n if (asChild) {\n return (\n <Slot\n ref={setItemRef as Ref<HTMLElement>}\n {...baseProps}\n >\n {children}\n </Slot>\n )\n }\n\n return (\n <button\n ref={setItemRef}\n {...baseProps}\n type='button'\n >\n {children}\n </button>\n )\n}\n\nRadioButtonGroupItem.displayName = 'RadioButtonGroupItem'\n"],"mappings":";;;;;;;;AAuBA,MAAM,0BAA0B,cAAmD,KAAK;AAiCxF,MAAa,wBAAwB,EACnC,cAAc,WACd,mBAAmB,gBACnB,cAAc,WACd,iBACA,UACA,WACA,WAAW,OACX,eAAe,OACf,OAAO,MACP,eACA,cAAc,cACd,OACA,UAAU,gBACiB;CAC3B,MAAM,CAAC,UAAU,eAAe,SAAoC,EAAE,CAAC;CAEvE,MAAM,WAAW,aAAa,WAAmB,SAAmC,aAAsB;AACxG,eAAa,qBAAqB;GAChC,MAAM,gBAAgB,iBAAiB,WAAW,SAAS,KAAK,UAAU,UAAU;AAEpF,OAAI,kBAAkB,IAAI;IACxB,MAAM,eAAe,iBAAiB;AACtC,QAAI,cAAc,YAAY,WAAW,aAAa,aAAa,SAAU,QAAO;AAEpF,WAAO,iBAAiB,KAAK,MAAM,UAAW,UAAU,gBAAgB;KAAE,OAAO;KAAW;KAAS;KAAU,GAAG,KAAM;;AAG1H,UAAO,CAAC,GAAG,kBAAkB;IAAE,OAAO;IAAW;IAAS;IAAU,CAAC;IACrE;AAEF,eAAa;AACX,gBAAa,qBAAqB,iBAAiB,QAAQ,SAAS,KAAK,UAAU,UAAU,CAAC;;IAE/F,EAAE,CAAC;CAEN,MAAM,kBAAkB,aAAa,cAAsB,SAAS,WAAW,SAAS,KAAK,UAAU,UAAU,EAAE,CAAC,SAAS,CAAC;CAC9H,MAAM,YAAY,kBAAkB,SAAS,QAAQ,CAAC,SAAS,CAAC;CAChE,MAAM,oBAAoB,aAAa,UAAkB,SAAS,QAAQ,YAAY,OAAO,CAAC,SAAS,CAAC;CAExG,MAAM,sBAAsB,aACzB,YAAoB,cAAsB;EACzC,MAAM,QAAQ;AACd,MAAI,MAAM,WAAW,EAAG,QAAO;EAE/B,IAAI,eAAe;AACnB,OAAK,IAAI,UAAU,GAAG,UAAU,MAAM,QAAQ,WAAW,GAAG;AAC1D,OAAI,CAAC,SAAS,eAAe,KAAK,gBAAgB,MAAM,QAAS,QAAO;GACxE,MAAM,eAAe,QAAQ,eAAe,MAAM,UAAU,MAAM,SAAS;AAC3E,OAAI,CAAC,MAAM,eAAe,SAAU,QAAO;AAC3C,mBAAgB;;AAGlB,SAAO;IAET,CAAC,MAAM,SAAS,CACjB;CAED,MAAM,mBAAmB,aACtB,UAAkB;EACjB,MAAM,cAAc,oBAAoB,OAAO,EAAE;AACjD,MAAI,gBAAgB,GAAI;AACxB,WAAS,cAAc,SAAS,OAAO;IAEzC,CAAC,qBAAqB,SAAS,CAChC;CAED,MAAM,gBAAgB,aACnB,UAAkB;EACjB,MAAM,SAAS,SAAS;AACxB,MAAI,CAAC,UAAU,OAAO,SAAU;AAChC,kBAAgB,OAAO,MAAM;IAE/B,CAAC,eAAe,SAAS,CAC1B;CAED,MAAM,eAAe,eACZ;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,GACD;EAAC;EAAa;EAAiB;EAAU;EAAkB;EAAiB;EAAmB;EAAc;EAAW;EAAM;EAAe;EAAa;EAAU;EAAe;EAAO;EAAQ,CACnM;AAED,QACE,oBAAC,wBAAwB,UAAzB;EAAkC,OAAO;YACvC,oBAAC,OAAD;GACE,cAAY;GACZ,mBAAiB;GACjB,WAAW,GACT,uHACA,+BACA,gOACA,UACD;GACD,iBAAe;GACf,oBAAkB;GAClB,eAAY;GACZ,gBAAc;GACd,oBAAkB;GAClB,MAAK;GAEJ;GACG;EAC2B;;AAIvC,MAAa,wBAAwB,EACnC,UAAU,OACV,aACA,iBACA,UACA,WACA,WAAW,OACX,SACA,UACA,KACA,OACA,OACA,GAAG,WAGC;CACJ,MAAM,UAAU,WAAW,wBAAwB;AAEnD,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,8DAA8D;CAGhF,MAAM,EAAE,aAAa,oBAAoB,iBAAiB,wBAAwB,OAAO,eAAe,eAAe,cAAc,UAAU,SAAS,aAAa,UAAU,iBAAiB,mBAAmB,kBAAkB,WAAW,MAAM,kBAAkB;CACxQ,MAAM,aAAa,kBAAkB;CACrC,MAAM,sBAAsB,eAAe;CAC3C,MAAM,0BAA0B,mBAAmB;CACnD,MAAM,UAAU,OAAiC,KAAK;AAEtD,qBAAwE,WAAW,QAAQ,QAAQ;AAEnG,iBAAgB,SAAS,OAAO,QAAQ,SAAS,SAAS,EAAE;EAAC;EAAU;EAAU;EAAM,CAAC;CAExF,MAAM,cAAc,SAAmC;AACrD,UAAQ,UAAU;AAClB,MAAI,CAAC,IAAK;AACV,MAAI,OAAO,QAAQ,YAAY;AAC7B,OAAI,KAAK;AACT;;AAEF,MAAI,UAAU;;CAGhB,MAAM,eAAe,UAAyC;AAC5D,MAAI,QAAS,SAAQ,MAAM;AAC3B,MAAI,MAAM,iBAAkB;AAC5B,MAAI,CAAC,UAAU;AACb,OAAI,cACF,eAAc,MAAM;AAEtB,OAAI,SACF,UAAS,MAAM;;;CAKrB,MAAM,iBAAiB,UAA4C;AACjE,MAAI,KAAK,UAAW,MAAK,UAAU,MAAM;AACzC,MAAI,MAAM,iBAAkB;EAE5B,MAAM,eAAe,gBAAgB,MAAM;AAC3C,MAAI,iBAAiB,GAAI;EAEzB,MAAM,MAAM,MAAM;EAClB,MAAM,eAAe,gBAAgB;EACrC,MAAM,WAAY,gBAAgB,QAAQ,gBAAkB,CAAC,gBAAgB,QAAQ;EACrF,MAAM,WAAY,gBAAgB,QAAQ,eAAiB,CAAC,gBAAgB,QAAQ;AAEpF,MAAI,QAAQ,QAAQ;AAClB,SAAM,gBAAgB;AACtB,QAAK,IAAI,QAAQ,GAAG,QAAQ,WAAW,EAAE,SAAS,EAChD,KAAI,CAAC,kBAAkB,MAAM,EAAE;AAC7B,kBAAc,MAAM;AACpB,qBAAiB,MAAM;AACvB;;AAGJ;;AAGF,MAAI,QAAQ,OAAO;AACjB,SAAM,gBAAgB;AACtB,QAAK,IAAI,QAAQ,WAAW,GAAG,GAAG,SAAS,GAAG,SAAS,EACrD,KAAI,CAAC,kBAAkB,MAAM,EAAE;AAC7B,kBAAc,MAAM;AACpB,qBAAiB,MAAM;AACvB;;AAGJ;;AAGF,MAAI,CAAC,YAAY,CAAC,SAAU;AAC5B,QAAM,gBAAgB;EAEtB,MAAM,YAAY,WAAW,IAAI;EACjC,IAAI,YAAY,eAAe;AAC/B,OAAK,IAAI,UAAU,GAAG,UAAU,WAAW,EAAE,WAAW,GAAG;AACzD,OAAI,CAAC,SAAS,YAAY,KAAK,aAAa,WAAW,EAAG;GAC1D,MAAM,eAAe,QAAQ,YAAY,WAAW,IAAI,WAAW,GAAG;AACtE,OAAI,CAAC,kBAAkB,aAAa,EAAE;AACpC,kBAAc,aAAa;AAC3B,qBAAiB,aAAa;AAC9B;;AAEF,gBAAa;;;CAIjB,MAAM,gBAAgB,gBAAgB,gBAAgB,cAAc,GAAG;CACvE,MAAM,2BAA2B;AAC/B,OAAK,IAAI,QAAQ,GAAG,QAAQ,WAAW,EAAE,SAAS,EAChD,KAAI,CAAC,kBAAkB,MAAM,CAAE,QAAO;AAExC,SAAO;KACL;CACJ,MAAM,eAAe,gBAAgB,MAAM;CAC3C,MAAM,WAAW,cAAe,kBAAkB,MAAM,sBAAsB,MAAM,iBAAiB,oBAAqB,IAAI;CAE9H,MAAM,YAAY;EAChB,GAAG;EACH,WAAW,GACT,4sBACA,YAAY,UACZ,gBAAgB,8HAChB,UACD;EACD,OAAO;GAAE,GAAG,oBAAoB,qBAAqB,wBAAwB;GAAE,GAAG;GAAO;EACzF;EACA,SAAS;EACT,WAAW;EACX,MAAM;EACN,gBAAgB;EAChB,cAAc,aAAa,OAAO;EAClC,eAAe;EACf,gBAAgB;EAChB,UAAU,WAAW,KAAK;EAC3B;AAED,KAAI,QACF,QACE,oBAAC,MAAD;EACE,KAAK;EACL,GAAI;EAEH;EACI;AAIX,QACE,oBAAC,UAAD;EACE,KAAK;EACL,GAAI;EACJ,MAAK;EAEJ;EACM;;AAIb,qBAAqB,cAAc"}
1
+ {"version":3,"file":"RadioButtonGroupBase.js","names":[],"sources":["../../src/components/RadioButtonGroup/RadioButtonGroupBase.tsx"],"sourcesContent":["import { Slot, type AsChildProp } from '@primitives/slot'\nimport { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { createContext, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, type ButtonHTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode, type Ref } from 'react'\n\ninterface RadioButtonGroupContextValue {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n focusItemByIndex: (index: number) => void\n getIndexByValue: (value: string) => number\n isDisabledAtIndex: (index: number) => boolean\n itemCount: () => number\n loop: boolean\n orientation: 'horizontal' | 'vertical'\n selectByIndex: (index: number) => void\n onValueChange?: (value: string) => void\n value?: string\n isKeptActive?: boolean\n expanded?: boolean\n variant?: 'default' | 'outline' | 'divided'\n register: (value: string, element: HTMLButtonElement | null, disabled: boolean) => () => void\n}\n\nconst RadioButtonGroupContext = createContext<RadioButtonGroupContextValue | null>(null)\n\nexport interface RadioButtonGroupProps {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n asChild?: boolean\n children: ReactNode\n className?: string\n expanded?: boolean\n isKeptActive?: boolean\n loop?: boolean\n onValueChange?: (value: string) => void\n orientation?: 'horizontal' | 'vertical'\n value?: string\n variant?: 'default' | 'outline' | 'divided'\n 'aria-label'?: string\n 'aria-labelledby'?: string\n}\n\nexport interface RadioButtonGroupItemProps extends AsChildProp, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onSelect' | 'type'> {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n children: ReactNode\n onSelect?: (value: string) => void\n value: string\n}\n\ninterface RadioButtonRegistryItem {\n value: string\n element: HTMLButtonElement | null\n disabled: boolean\n}\n\nexport const RadioButtonGroupBase = ({\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n activeColor = 'default',\n activeTextColor,\n children,\n className,\n expanded = false,\n isKeptActive = false,\n loop = true,\n onValueChange,\n orientation = 'horizontal',\n value,\n variant = 'default',\n}: RadioButtonGroupProps) => {\n const [registry, setRegistry] = useState<RadioButtonRegistryItem[]>([])\n\n const register = useCallback((nextValue: string, element: HTMLButtonElement | null, disabled: boolean) => {\n setRegistry((previousRegistry) => {\n const existingIndex = previousRegistry.findIndex((item) => item.value === nextValue)\n\n if (existingIndex !== -1) {\n const existingItem = previousRegistry[existingIndex]\n if (existingItem?.element === element && existingItem.disabled === disabled) return previousRegistry\n\n return previousRegistry.map((item, index) => (index === existingIndex ? { value: nextValue, element, disabled } : item))\n }\n\n return [...previousRegistry, { value: nextValue, element, disabled }]\n })\n\n return () => {\n setRegistry((previousRegistry) => previousRegistry.filter((item) => item.value !== nextValue))\n }\n }, [])\n\n const getIndexByValue = useCallback((itemValue: string) => registry.findIndex((item) => item.value === itemValue), [registry])\n const itemCount = useCallback(() => registry.length, [registry])\n const isDisabledAtIndex = useCallback((index: number) => registry[index]?.disabled ?? false, [registry])\n\n const getNextEnabledIndex = useCallback(\n (startIndex: number, direction: 1 | -1) => {\n const items = registry\n if (items.length === 0) return -1\n\n let currentIndex = startIndex\n for (let attempt = 0; attempt < items.length; attempt += 1) {\n if (!loop && (currentIndex < 0 || currentIndex >= items.length)) return -1\n const boundedIndex = loop ? (currentIndex + items.length) % items.length : currentIndex\n if (!items[boundedIndex]?.disabled) return boundedIndex\n currentIndex += direction\n }\n\n return -1\n },\n [loop, registry],\n )\n\n const focusItemByIndex = useCallback(\n (index: number) => {\n const targetIndex = getNextEnabledIndex(index, 1)\n if (targetIndex === -1) return\n registry[targetIndex]?.element?.focus()\n },\n [getNextEnabledIndex, registry],\n )\n\n const selectByIndex = useCallback(\n (index: number) => {\n const target = registry[index]\n if (!target || target.disabled) return\n onValueChange?.(target.value)\n },\n [onValueChange, registry],\n )\n\n const contextValue = useMemo(\n () => ({\n activeColor,\n activeTextColor,\n focusItemByIndex,\n getIndexByValue,\n isDisabledAtIndex,\n itemCount,\n loop,\n onValueChange,\n orientation,\n selectByIndex,\n value,\n isKeptActive,\n expanded,\n variant,\n register,\n }),\n [activeColor, activeTextColor, expanded, focusItemByIndex, getIndexByValue, isDisabledAtIndex, isKeptActive, itemCount, loop, onValueChange, orientation, register, selectByIndex, value, variant],\n )\n\n return (\n <RadioButtonGroupContext.Provider value={contextValue}>\n <div\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n className={cn(\n 'rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md flex h-fit w-fit items-center',\n 'data-[expanded=true]:w-full',\n `data-[variant=outline]:gap-0 data-[variant=divided]:gap-0 data-[variant=divided]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=outline]:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant=divided]:[&_button]:border-y-0 data-[variant=divided]:[&_button:first-of-type]:border-l-0 data-[variant=divided]:[&_button:last-of-type]:border-r-0 data-[variant=divided]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant=outline]:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)]`,\n className,\n )}\n data-expanded={expanded}\n data-orientation={orientation}\n data-testid='spectral-radio-button-group'\n data-variant={variant}\n aria-orientation={orientation}\n role='radiogroup'\n >\n {children}\n </div>\n </RadioButtonGroupContext.Provider>\n )\n}\n\nexport const RadioButtonGroupItem = ({\n asChild = false,\n activeColor,\n activeTextColor,\n children,\n className,\n disabled = false,\n onClick,\n onSelect,\n ref,\n style,\n value,\n ...rest\n}: RadioButtonGroupItemProps & {\n ref?: Ref<HTMLButtonElement | null>\n}) => {\n const context = useContext(RadioButtonGroupContext)\n\n if (!context) {\n throw new Error('RadioButtonGroupItem must be used within a RadioButtonGroup')\n }\n\n const { activeColor: contextActiveColor, activeTextColor: contextActiveTextColor, value: selectedValue, onValueChange, isKeptActive, expanded, variant, orientation, register, getIndexByValue, isDisabledAtIndex, focusItemByIndex, itemCount, loop, selectByIndex } = context\n const isSelected = selectedValue === value\n const resolvedActiveColor = activeColor ?? contextActiveColor\n const resolvedActiveTextColor = activeTextColor ?? contextActiveTextColor\n const itemRef = useRef<HTMLButtonElement | null>(null)\n\n useImperativeHandle<HTMLButtonElement | null, HTMLButtonElement | null>(ref, () => itemRef.current)\n\n useEffect(() => register(value, itemRef.current, disabled), [disabled, register, value])\n\n const setItemRef = (node: HTMLButtonElement | null) => {\n itemRef.current = node\n if (!ref) return\n if (typeof ref === 'function') {\n ref(node)\n return\n }\n ref.current = node\n }\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n if (onClick) onClick(event)\n if (event.defaultPrevented) return\n if (!disabled) {\n if (onValueChange) {\n onValueChange(value)\n }\n if (onSelect) {\n onSelect(value)\n }\n }\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (rest.onKeyDown) rest.onKeyDown(event)\n if (event.defaultPrevented) return\n\n const currentIndex = getIndexByValue(value)\n if (currentIndex === -1) return\n\n const key = event.key\n const isHorizontal = orientation === 'horizontal'\n const moveNext = (isHorizontal && key === 'ArrowRight') || (!isHorizontal && key === 'ArrowDown')\n const movePrev = (isHorizontal && key === 'ArrowLeft') || (!isHorizontal && key === 'ArrowUp')\n\n if (key === 'Home') {\n event.preventDefault()\n for (let index = 0; index < itemCount(); index += 1) {\n if (!isDisabledAtIndex(index)) {\n selectByIndex(index)\n focusItemByIndex(index)\n return\n }\n }\n return\n }\n\n if (key === 'End') {\n event.preventDefault()\n for (let index = itemCount() - 1; index >= 0; index -= 1) {\n if (!isDisabledAtIndex(index)) {\n selectByIndex(index)\n focusItemByIndex(index)\n return\n }\n }\n return\n }\n\n if (!moveNext && !movePrev) return\n event.preventDefault()\n\n const direction = moveNext ? 1 : -1\n let nextIndex = currentIndex + direction\n for (let attempt = 0; attempt < itemCount(); attempt += 1) {\n if (!loop && (nextIndex < 0 || nextIndex >= itemCount())) return\n const boundedIndex = loop ? (nextIndex + itemCount()) % itemCount() : nextIndex\n if (!isDisabledAtIndex(boundedIndex)) {\n selectByIndex(boundedIndex)\n focusItemByIndex(boundedIndex)\n return\n }\n nextIndex += direction\n }\n }\n\n const selectedIndex = selectedValue ? getIndexByValue(selectedValue) : -1\n const firstEnabledIndex = (() => {\n for (let index = 0; index < itemCount(); index += 1) {\n if (!isDisabledAtIndex(index)) return index\n }\n return -1\n })()\n const currentIndex = getIndexByValue(value)\n const tabIndex = isSelected || (selectedIndex === -1 && firstEnabledIndex !== -1 && currentIndex === firstEnabledIndex) ? 0 : -1\n\n const baseProps = {\n ...rest,\n className: cn(\n `gap-2 text-sm font-medium h-9 px-3 min-w-9 [&_svg:not([class*='size-']):not([width]):not([height])]:size-4 inline-flex items-center justify-center rounded-none border border-toggle-border bg-toggle-bg text-toggle-text shadow-none transition-colors hover:cursor-pointer hover:border-toggle-border--hover hover:bg-toggle-bg--hover hover:text-toggle-text--hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:border-toggle-border--active active:bg-toggle-bg--active active:text-toggle-text--active disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&:not(:first-child)]:border-l-0`,\n expanded && 'w-full',\n isKeptActive && 'data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active data-[state=on]:text-toggle-text--active',\n className,\n ),\n style: { ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor), ...style },\n disabled,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n role: 'radio',\n 'aria-checked': isSelected,\n 'data-state': isSelected ? 'on' : 'off',\n 'data-testid': 'spectral-radio-button-group-item',\n 'data-variant': variant,\n tabIndex: disabled ? -1 : tabIndex,\n }\n\n if (asChild) {\n return (\n <Slot\n ref={setItemRef as Ref<HTMLElement>}\n {...baseProps}\n >\n {children}\n </Slot>\n )\n }\n\n return (\n <button\n ref={setItemRef}\n {...baseProps}\n type='button'\n >\n {children}\n </button>\n )\n}\n\nRadioButtonGroupItem.displayName = 'RadioButtonGroupItem'\n"],"mappings":"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"}
package/dist/Toggle.d.ts CHANGED
@@ -12,7 +12,7 @@ type ToggleProps = ComponentProps<typeof ToggleBase> & VariantProps<typeof toggl
12
12
  activeTextColor?: ActiveTextColor;
13
13
  };
14
14
  declare const toggleVariants: (props?: ({
15
- variant?: "default" | "outline" | "separated" | null | undefined;
15
+ variant?: "default" | "divided" | "outline" | "separated" | null | undefined;
16
16
  size?: "default" | "lg" | "sm" | null | undefined;
17
17
  layout?: "default" | "expanded" | null | undefined;
18
18
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
@@ -1 +1 @@
1
- {"version":3,"file":"Toggle.d.ts","names":[],"sources":["../src/components/Toggle/Toggle.tsx"],"mappings":";;;;;;;;;KASY,WAAA,GAAc,cAAA,QAAsB,UAAA,IAC9C,YAAA,QAAoB,cAAA;EAClB,WAAA,GAAc,WAAA;EACd,eAAA,GAAkB,eAAA;AAAA;AAAA,cAGT,cAAA,GAAc,KAAA;;;;IAyB1B,iCAAA,CAAA,SAAA;AAAA,cAEY,MAAA;EAAM,GAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,MAAA;EAAA,QAAA;EAAA,WAAA;EAAA,eAAA;EAAA,KAAA;EAAA,GAAA;AAAA,GAWhB,WAAA;EACD,GAAA,GAAM,GAAA,CAAI,iBAAA;AAAA,MACX,oBAAA,CAAA,GAAA,CAAA,OAAA"}
1
+ {"version":3,"file":"Toggle.d.ts","names":[],"sources":["../src/components/Toggle/Toggle.tsx"],"mappings":";;;;;;;;;KASY,WAAA,GAAc,cAAA,QAAsB,UAAA,IAC9C,YAAA,QAAoB,cAAA;EAClB,WAAA,GAAc,WAAA;EACd,eAAA,GAAkB,eAAA;AAAA;AAAA,cAGT,cAAA,GAAc,KAAA;;;;IA0B1B,iCAAA,CAAA,SAAA;AAAA,cAEY,MAAA;EAAM,GAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,MAAA;EAAA,QAAA;EAAA,WAAA;EAAA,eAAA;EAAA,KAAA;EAAA,GAAA;AAAA,GAWhB,WAAA;EACD,GAAA,GAAM,GAAA,CAAI,iBAAA;AAAA,MACX,oBAAA,CAAA,GAAA,CAAA,OAAA"}
package/dist/Toggle.js CHANGED
@@ -12,6 +12,7 @@ const toggleVariants = cva(`gap-2 rounded-md text-sm shadow-sm font-medium inlin
12
12
  variant: {
13
13
  default: "border-toggle-border hover:border-toggle-border--hover",
14
14
  outline: "border-toggle-outline-border hover:border-toggle-outline-border--hover hover:bg-toggle-bg--hover",
15
+ divided: "border-toggle-outline-border hover:border-toggle-outline-border--hover hover:bg-toggle-bg--hover",
15
16
  separated: "border-toggle-border hover:border-toggle-border--hover aria-pressed:border-toggle-border--active aria-pressed:bg-toggle-bg--active data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active"
16
17
  },
17
18
  size: {
@@ -1 +1 @@
1
- {"version":3,"file":"Toggle.js","names":[],"sources":["../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps, type Ref } from 'react'\nimport { ToggleBase } from './ToggleBase'\n\nexport { getActiveColorStyle }\nexport type { ActiveColor, ActiveTextColor }\n\nexport type ToggleProps = ComponentProps<typeof ToggleBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const toggleVariants = cva(\n `gap-2 rounded-md text-sm shadow-sm font-medium inline-flex w-fit items-center justify-center border bg-toggle-bg whitespace-nowrap text-toggle-text transition-colors hover:cursor-pointer hover:border-toggle-border--hover hover:bg-toggle-bg--hover hover:text-toggle-text--hover focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:bg-toggle-bg--active aria-invalid:border-danger-200 aria-invalid:outline-danger-200/20 aria-pressed:border-toggle-border--active aria-pressed:bg-toggle-bg--active aria-pressed:text-toggle-text--active data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active data-[state=on]:text-toggle-text--active [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n default: 'border-toggle-border hover:border-toggle-border--hover',\n outline: 'border-toggle-outline-border hover:border-toggle-outline-border--hover hover:bg-toggle-bg--hover',\n separated: 'border-toggle-border hover:border-toggle-border--hover aria-pressed:border-toggle-border--active aria-pressed:bg-toggle-bg--active data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active',\n },\n size: {\n default: `h-9 px-3 min-w-9 [&_svg:not([class*='size-']):not([width]):not([height])]:size-4`,\n sm: `h-8 px-1.5 min-w-8 [&_svg:not([class*='size-']):not([width]):not([height])]:size-3`,\n lg: `h-10 px-2.5 min-w-10 [&_svg:not([class*='size-']):not([width]):not([height])]:size-5`,\n },\n layout: {\n default: 'w-fit',\n expanded: 'w-full',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n layout: 'default',\n },\n },\n)\n\nexport const Toggle = ({\n ref,\n className,\n variant,\n size,\n layout,\n disabled,\n activeColor = 'default',\n activeTextColor,\n style,\n ...props\n}: ToggleProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n return (\n <ToggleBase\n ref={ref}\n disabled={disabled}\n data-slot='toggle'\n data-testid='spectral-toggle'\n className={cn(toggleVariants({ variant, size, layout }), className)}\n style={{ ...getActiveColorStyle(activeColor, activeTextColor), ...style }}\n {...props}\n />\n )\n}\n"],"mappings":";;;;;;;;;AAeA,MAAa,iBAAiB,IAC5B,s0BACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,WAAW;GACZ;EACD,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACL;EACD,QAAQ;GACN,SAAS;GACT,UAAU;GACX;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,QAAQ;EACT;CACF,CACF;AAED,MAAa,UAAU,EACrB,KACA,WACA,SACA,MACA,QACA,UACA,cAAc,WACd,iBACA,OACA,GAAG,YAGC;AACJ,QACE,oBAAC,YAAD;EACO;EACK;EACV,aAAU;EACV,eAAY;EACZ,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAQ,CAAC,EAAE,UAAU;EACnE,OAAO;GAAE,GAAG,oBAAoB,aAAa,gBAAgB;GAAE,GAAG;GAAO;EACzE,GAAI;EACJ"}
1
+ {"version":3,"file":"Toggle.js","names":[],"sources":["../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps, type Ref } from 'react'\nimport { ToggleBase } from './ToggleBase'\n\nexport { getActiveColorStyle }\nexport type { ActiveColor, ActiveTextColor }\n\nexport type ToggleProps = ComponentProps<typeof ToggleBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const toggleVariants = cva(\n `gap-2 rounded-md text-sm shadow-sm font-medium inline-flex w-fit items-center justify-center border bg-toggle-bg whitespace-nowrap text-toggle-text transition-colors hover:cursor-pointer hover:border-toggle-border--hover hover:bg-toggle-bg--hover hover:text-toggle-text--hover focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:bg-toggle-bg--active aria-invalid:border-danger-200 aria-invalid:outline-danger-200/20 aria-pressed:border-toggle-border--active aria-pressed:bg-toggle-bg--active aria-pressed:text-toggle-text--active data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active data-[state=on]:text-toggle-text--active [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n default: 'border-toggle-border hover:border-toggle-border--hover',\n outline: 'border-toggle-outline-border hover:border-toggle-outline-border--hover hover:bg-toggle-bg--hover',\n divided: 'border-toggle-outline-border hover:border-toggle-outline-border--hover hover:bg-toggle-bg--hover',\n separated: 'border-toggle-border hover:border-toggle-border--hover aria-pressed:border-toggle-border--active aria-pressed:bg-toggle-bg--active data-[state=on]:border-toggle-border--active data-[state=on]:bg-toggle-bg--active',\n },\n size: {\n default: `h-9 px-3 min-w-9 [&_svg:not([class*='size-']):not([width]):not([height])]:size-4`,\n sm: `h-8 px-1.5 min-w-8 [&_svg:not([class*='size-']):not([width]):not([height])]:size-3`,\n lg: `h-10 px-2.5 min-w-10 [&_svg:not([class*='size-']):not([width]):not([height])]:size-5`,\n },\n layout: {\n default: 'w-fit',\n expanded: 'w-full',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n layout: 'default',\n },\n },\n)\n\nexport const Toggle = ({\n ref,\n className,\n variant,\n size,\n layout,\n disabled,\n activeColor = 'default',\n activeTextColor,\n style,\n ...props\n}: ToggleProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n return (\n <ToggleBase\n ref={ref}\n disabled={disabled}\n data-slot='toggle'\n data-testid='spectral-toggle'\n className={cn(toggleVariants({ variant, size, layout }), className)}\n style={{ ...getActiveColorStyle(activeColor, activeTextColor), ...style }}\n {...props}\n />\n )\n}\n"],"mappings":";;;;;;;;;AAeA,MAAa,iBAAiB,IAC5B,s0BACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACT,WAAW;GACZ;EACD,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACL;EACD,QAAQ;GACN,SAAS;GACT,UAAU;GACX;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,QAAQ;EACT;CACF,CACF;AAED,MAAa,UAAU,EACrB,KACA,WACA,SACA,MACA,QACA,UACA,cAAc,WACd,iBACA,OACA,GAAG,YAGC;AACJ,QACE,oBAAC,YAAD;EACO;EACK;EACV,aAAU;EACV,eAAY;EACZ,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAQ,CAAC,EAAE,UAAU;EACnE,OAAO;GAAE,GAAG,oBAAoB,aAAa,gBAAgB;GAAE,GAAG;GAAO;EACzE,GAAI;EACJ"}
@@ -21,7 +21,7 @@ const ToggleGroupItem = ({ activeColor, activeTextColor, children, className, la
21
21
  variant: resolvedVariant,
22
22
  size: resolvedSize,
23
23
  layout: resolvedLayout
24
- }), "group data-[variant=separated]:rounded-md rounded-none shadow-none focus:z-10 focus-visible:z-10 data-[variant=outline]:border-toggle-border data-[variant=outline]:hover:border-toggle-border", "data-[variant=outline]:data-[state=on]:border-toggle-border--active data-[variant=outline]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:border-toggle-border", "data-[variant=separated]:hover:border-toggle-border--hover data-[variant=separated]:data-[state=on]:border-toggle-border--active data-[variant=separated]:data-[state=on]:bg-toggle-bg--active", "data-[variant=separated]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:data-[state=on]:hover:bg-toggle-bg--active", className),
24
+ }), "group data-[variant=separated]:rounded-md rounded-none shadow-none focus:z-10 focus-visible:z-10 data-[variant=outline]:border-toggle-border data-[variant=outline]:hover:border-toggle-border", "data-[variant=divided]:border-toggle-border data-[variant=divided]:hover:border-toggle-border data-[variant=outline]:data-[state=on]:border-toggle-border--active", "data-[variant=divided]:data-[state=on]:border-toggle-border--active data-[variant=divided]:data-[state=on]:hover:border-toggle-border--active data-[variant=outline]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:border-toggle-border", "data-[variant=separated]:hover:border-toggle-border--hover data-[variant=separated]:data-[state=on]:border-toggle-border--active data-[variant=separated]:data-[state=on]:bg-toggle-bg--active", "data-[variant=separated]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:data-[state=on]:hover:bg-toggle-bg--active", className),
25
25
  "data-layout": resolvedLayout,
26
26
  "data-size": resolvedSize,
27
27
  "data-slot": "toggle-group-item",
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleGroupItem.js","names":[],"sources":["../../src/components/ToggleGroup/ToggleGroupItem.tsx"],"sourcesContent":["import { toggleVariants } from '@components/Toggle/Toggle'\nimport { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { type VariantProps } from 'class-variance-authority'\nimport { useContext, type ComponentProps, type Ref } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupItemBase } from './ToggleGroupBase'\n\nexport type ToggleGroupItemProps = ComponentProps<typeof ToggleGroupItemBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const ToggleGroupItem = ({\n activeColor,\n activeTextColor,\n children,\n className,\n layout,\n ref,\n size,\n style,\n value,\n variant,\n ...props\n}: ToggleGroupItemProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n const context = useContext(ToggleGroupContext)\n const resolvedVariant = variant ?? context.variant\n const resolvedSize = size ?? context.size\n const resolvedLayout = layout ?? context.layout\n const resolvedActiveColor = activeColor ?? context.activeColor\n const resolvedActiveTextColor = activeTextColor ?? context.activeTextColor\n\n return (\n <ToggleGroupItemBase\n className={cn(\n toggleVariants({\n variant: resolvedVariant,\n size: resolvedSize,\n layout: resolvedLayout,\n }),\n 'group data-[variant=separated]:rounded-md rounded-none shadow-none focus:z-10 focus-visible:z-10 data-[variant=outline]:border-toggle-border data-[variant=outline]:hover:border-toggle-border',\n 'data-[variant=outline]:data-[state=on]:border-toggle-border--active data-[variant=outline]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:border-toggle-border',\n 'data-[variant=separated]:hover:border-toggle-border--hover data-[variant=separated]:data-[state=on]:border-toggle-border--active data-[variant=separated]:data-[state=on]:bg-toggle-bg--active',\n 'data-[variant=separated]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:data-[state=on]:hover:bg-toggle-bg--active',\n className,\n )}\n data-layout={resolvedLayout}\n data-size={resolvedSize}\n data-slot='toggle-group-item'\n data-testid='spectral-toggle-group-item'\n data-variant={resolvedVariant}\n ref={ref}\n style={{ ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor), ...style }}\n value={value}\n {...props}\n >\n {children}\n </ToggleGroupItemBase>\n )\n}\n\nToggleGroupItem.displayName = 'ToggleGroupItem'\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,mBAAmB,EAC9B,aACA,iBACA,UACA,WACA,QACA,KACA,MACA,OACA,OACA,SACA,GAAG,YAGC;CACJ,MAAM,UAAU,WAAW,mBAAmB;CAC9C,MAAM,kBAAkB,WAAW,QAAQ;CAC3C,MAAM,eAAe,QAAQ,QAAQ;CACrC,MAAM,iBAAiB,UAAU,QAAQ;CACzC,MAAM,sBAAsB,eAAe,QAAQ;CACnD,MAAM,0BAA0B,mBAAmB,QAAQ;AAE3D,QACE,oBAAC,qBAAD;EACE,WAAW,GACT,eAAe;GACb,SAAS;GACT,MAAM;GACN,QAAQ;GACT,CAAC,EACF,kMACA,+LACA,kMACA,mJACA,UACD;EACD,eAAa;EACb,aAAW;EACX,aAAU;EACV,eAAY;EACZ,gBAAc;EACT;EACL,OAAO;GAAE,GAAG,oBAAoB,qBAAqB,wBAAwB;GAAE,GAAG;GAAO;EAClF;EACP,GAAI;EAEH;EACmB;;AAI1B,gBAAgB,cAAc"}
1
+ {"version":3,"file":"ToggleGroupItem.js","names":[],"sources":["../../src/components/ToggleGroup/ToggleGroupItem.tsx"],"sourcesContent":["import { toggleVariants } from '@components/Toggle/Toggle'\nimport { getActiveColorStyle, type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { type VariantProps } from 'class-variance-authority'\nimport { useContext, type ComponentProps, type Ref } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupItemBase } from './ToggleGroupBase'\n\nexport type ToggleGroupItemProps = ComponentProps<typeof ToggleGroupItemBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const ToggleGroupItem = ({\n activeColor,\n activeTextColor,\n children,\n className,\n layout,\n ref,\n size,\n style,\n value,\n variant,\n ...props\n}: ToggleGroupItemProps & {\n ref?: Ref<HTMLButtonElement>\n}) => {\n const context = useContext(ToggleGroupContext)\n const resolvedVariant = variant ?? context.variant\n const resolvedSize = size ?? context.size\n const resolvedLayout = layout ?? context.layout\n const resolvedActiveColor = activeColor ?? context.activeColor\n const resolvedActiveTextColor = activeTextColor ?? context.activeTextColor\n\n return (\n <ToggleGroupItemBase\n className={cn(\n toggleVariants({\n variant: resolvedVariant,\n size: resolvedSize,\n layout: resolvedLayout,\n }),\n 'group data-[variant=separated]:rounded-md rounded-none shadow-none focus:z-10 focus-visible:z-10 data-[variant=outline]:border-toggle-border data-[variant=outline]:hover:border-toggle-border',\n 'data-[variant=divided]:border-toggle-border data-[variant=divided]:hover:border-toggle-border data-[variant=outline]:data-[state=on]:border-toggle-border--active',\n 'data-[variant=divided]:data-[state=on]:border-toggle-border--active data-[variant=divided]:data-[state=on]:hover:border-toggle-border--active data-[variant=outline]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:border-toggle-border',\n 'data-[variant=separated]:hover:border-toggle-border--hover data-[variant=separated]:data-[state=on]:border-toggle-border--active data-[variant=separated]:data-[state=on]:bg-toggle-bg--active',\n 'data-[variant=separated]:data-[state=on]:hover:border-toggle-border--active data-[variant=separated]:data-[state=on]:hover:bg-toggle-bg--active',\n className,\n )}\n data-layout={resolvedLayout}\n data-size={resolvedSize}\n data-slot='toggle-group-item'\n data-testid='spectral-toggle-group-item'\n data-variant={resolvedVariant}\n ref={ref}\n style={{ ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor), ...style }}\n value={value}\n {...props}\n >\n {children}\n </ToggleGroupItemBase>\n )\n}\n\nToggleGroupItem.displayName = 'ToggleGroupItem'\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,mBAAmB,EAC9B,aACA,iBACA,UACA,WACA,QACA,KACA,MACA,OACA,OACA,SACA,GAAG,YAGC;CACJ,MAAM,UAAU,WAAW,mBAAmB;CAC9C,MAAM,kBAAkB,WAAW,QAAQ;CAC3C,MAAM,eAAe,QAAQ,QAAQ;CACrC,MAAM,iBAAiB,UAAU,QAAQ;CACzC,MAAM,sBAAsB,eAAe,QAAQ;CACnD,MAAM,0BAA0B,mBAAmB,QAAQ;AAE3D,QACE,oBAAC,qBAAD;EACE,WAAW,GACT,eAAe;GACb,SAAS;GACT,MAAM;GACN,QAAQ;GACT,CAAC,EACF,kMACA,qKACA,yQACA,kMACA,mJACA,UACD;EACD,eAAa;EACb,aAAW;EACX,aAAU;EACV,eAAY;EACZ,gBAAc;EACT;EACL,OAAO;GAAE,GAAG,oBAAoB,qBAAqB,wBAAwB;GAAE,GAAG;GAAO;EAClF;EACP,GAAI;EAEH;EACmB;;AAI1B,gBAAgB,cAAc"}
@@ -120,7 +120,7 @@ const ToggleGroupSplitMenuItem = ({ activeColor, activeTextColor, children, clas
120
120
  layout: resolvedLayout,
121
121
  size: resolvedSize,
122
122
  variant: resolvedVariant
123
- }), "px-1 min-w-6 data-[size=sm]:min-w-5 data-[size=sm]:px-0.5 relative rounded-none border-l-0 shadow-none", "data-[size=lg]:min-w-7 data-[size=lg]:px-1.5 data-[variant=outline]:border-toggle-border", "hover:opacity-100! data-[variant=outline]:hover:border-toggle-border", "before:inset-y-2 before:left-0 before:pointer-events-none before:absolute before:w-px before:bg-border-secondary/6", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent", "peer-data-[state=on]/spectral-split-menu:border-toggle-border--active!", "peer-data-[state=on]/spectral-split-menu:bg-toggle-bg--active", "peer-data-[state=on]/spectral-split-menu:hover:border-toggle-border--active!", "peer-data-[state=on]/spectral-split-menu:hover:bg-toggle-bg--active!", "peer-data-[state=on]/spectral-split-menu:text-toggle-text--active", "peer-data-[state=on]/spectral-split-menu:hover:text-toggle-text--active!", dropdownButtonClassName),
123
+ }), "px-1 min-w-6 data-[size=sm]:min-w-5 data-[size=sm]:px-0.5 relative rounded-none border-l-0 shadow-none", "data-[size=lg]:min-w-7 data-[size=lg]:px-1.5 data-[variant=divided]:border-toggle-border data-[variant=outline]:border-toggle-border", "hover:opacity-100! data-[variant=divided]:hover:border-toggle-border data-[variant=outline]:hover:border-toggle-border", "before:inset-y-2 before:left-0 before:pointer-events-none before:absolute before:w-px before:bg-border-secondary/6", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent", "peer-data-[state=on]/spectral-split-menu:border-toggle-border--active!", "peer-data-[state=on]/spectral-split-menu:bg-toggle-bg--active", "peer-data-[state=on]/spectral-split-menu:hover:border-toggle-border--active!", "peer-data-[state=on]/spectral-split-menu:hover:bg-toggle-bg--active!", "peer-data-[state=on]/spectral-split-menu:text-toggle-text--active", "peer-data-[state=on]/spectral-split-menu:hover:text-toggle-text--active!", dropdownButtonClassName),
124
124
  "data-layout": resolvedLayout,
125
125
  "data-size": resolvedSize,
126
126
  "data-variant": resolvedVariant,
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleGroupSplitMenuItem.js","names":[],"sources":["../../src/components/ToggleGroup/ToggleGroupSplitMenuItem.tsx"],"sourcesContent":["import { DropdownMenu, type DropdownMenuOption, type DropdownMenuProps } from '@components/DropdownMenu/DropdownMenu'\nimport { ChevronDownIcon } from '@components/Icons'\nimport { toggleVariants } from '@components/Toggle/Toggle'\nimport { getActiveColorStyle } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { useContext, useRef, useState, type CSSProperties, type KeyboardEvent, type ReactNode } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupItem, type ToggleGroupItemProps } from './ToggleGroupItem'\n\nexport interface ToggleGroupSplitMenuItemProps extends Omit<ToggleGroupItemProps, 'children'> {\n children: ReactNode\n dropdownAlign?: DropdownMenuProps['align']\n dropdownAriaLabel: string\n dropdownButtonClassName?: string\n dropdownCollisionPadding?: DropdownMenuProps['collisionPadding']\n dropdownButtonStyle?: CSSProperties\n dropdownOptions: DropdownMenuOption[]\n dropdownSide?: DropdownMenuProps['side']\n dropdownValue?: string | string[]\n dropdownValueLabel?: string\n onDropdownValueChange?: (value: string | string[]) => void\n triggerIcon?: ReactNode\n}\n\nexport const ToggleGroupSplitMenuItem = ({\n activeColor,\n activeTextColor,\n children,\n className,\n dropdownAlign = 'end',\n dropdownAriaLabel,\n dropdownButtonClassName,\n dropdownButtonStyle,\n dropdownCollisionPadding = 12,\n dropdownOptions,\n dropdownSide = 'bottom',\n dropdownValue,\n dropdownValueLabel,\n layout,\n onDropdownValueChange,\n onKeyDown,\n size,\n style,\n triggerIcon = <ChevronDownIcon size={16} />,\n value,\n variant,\n ...props\n}: ToggleGroupSplitMenuItemProps) => {\n const [open, setOpen] = useState(false)\n const dropdownContentRef = useRef<HTMLDivElement | null>(null)\n const primaryButtonRef = useRef<HTMLButtonElement | null>(null)\n const chevronButtonRef = useRef<HTMLButtonElement | null>(null)\n const openerRef = useRef<'primary' | 'chevron' | null>(null)\n const isDisabled = props.disabled ?? false\n const context = useContext(ToggleGroupContext)\n const resolvedVariant = variant ?? context.variant\n const resolvedSize = size ?? context.size\n const resolvedLayout = layout ?? context.layout\n const resolvedOrientation = context.orientation ?? 'horizontal'\n const resolvedActiveColor = activeColor ?? context.activeColor\n const resolvedActiveTextColor = activeTextColor ?? context.activeTextColor\n const sharedActiveStyle = {\n ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor),\n ...style,\n }\n\n const focusFirstEnabledDropdownItem = (focusTarget: 'first' | 'last' = 'first'): void => {\n const content = dropdownContentRef.current\n if (!content) return\n\n const menuItemSelector = '[role=\"menuitem\"]:not([data-disabled]), [role=\"menuitemcheckbox\"]:not([data-disabled]), [role=\"menuitemradio\"]:not([data-disabled])'\n const enabledItems = Array.from(content.querySelectorAll<HTMLElement>(menuItemSelector))\n if (enabledItems.length === 0) return\n\n if (focusTarget === 'last') {\n enabledItems[enabledItems.length - 1]?.focus()\n return\n }\n\n enabledItems[0]?.focus()\n }\n\n const openMenu = (opener: 'primary' | 'chevron'): void => {\n openerRef.current = opener\n setOpen(true)\n setTimeout(() => {\n focusFirstEnabledDropdownItem('first')\n }, 0)\n }\n\n const restoreFocusToOpener = (): void => {\n const opener = openerRef.current\n const focusTarget = opener === 'primary' ? primaryButtonRef.current : chevronButtonRef.current\n openerRef.current = null\n focusTarget?.focus()\n }\n\n const handleDropdownOpenChange = (nextOpen: boolean): void => {\n if (nextOpen) {\n openerRef.current ??= 'chevron'\n setOpen(true)\n setTimeout(() => {\n focusFirstEnabledDropdownItem('first')\n }, 0)\n return\n }\n\n setOpen(false)\n restoreFocusToOpener()\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === 'ArrowDown' && resolvedOrientation !== 'vertical') {\n event.preventDefault()\n openMenu('primary')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n if (onKeyDown) onKeyDown(event)\n }\n\n const handleDropdownTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (open && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n event.preventDefault()\n focusFirstEnabledDropdownItem(event.key === 'ArrowUp' ? 'last' : 'first')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n const isOpenMenuKey = event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ' || event.key === 'Space' || event.key === 'Spacebar'\n\n if (isOpenMenuKey) {\n event.preventDefault()\n openMenu('chevron')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n if (onKeyDown) onKeyDown(event)\n }\n\n const toggleAriaLabel = props['aria-label'] ? `${props['aria-label']}${dropdownValueLabel ? `, ${dropdownValueLabel}` : ''}` : undefined\n\n return (\n <>\n <ToggleGroupItem\n activeColor={resolvedActiveColor}\n activeTextColor={resolvedActiveTextColor}\n aria-label={toggleAriaLabel}\n className={cn('peer/spectral-split-menu rounded-r-none! border-r-0', className)}\n layout={resolvedLayout}\n onKeyDown={handleKeyDown}\n ref={primaryButtonRef}\n size={resolvedSize}\n style={sharedActiveStyle}\n value={value}\n variant={resolvedVariant}\n {...(({ 'aria-label': _, ...rest }) => rest)(props)}\n >\n {children}\n </ToggleGroupItem>\n\n <DropdownMenu\n align={dropdownAlign}\n asChild\n collisionPadding={dropdownCollisionPadding}\n disabled={isDisabled}\n dropdownContentRef={dropdownContentRef}\n onOpenChange={handleDropdownOpenChange}\n onValueChange={onDropdownValueChange}\n open={open}\n options={dropdownOptions}\n side={dropdownSide}\n trigger={\n <button\n aria-expanded={open}\n aria-haspopup='menu'\n aria-label={dropdownAriaLabel}\n className={cn(\n toggleVariants({\n layout: resolvedLayout,\n size: resolvedSize,\n variant: resolvedVariant,\n }),\n 'px-1 min-w-6 data-[size=sm]:min-w-5 data-[size=sm]:px-0.5 relative rounded-none border-l-0 shadow-none',\n 'data-[size=lg]:min-w-7 data-[size=lg]:px-1.5 data-[variant=outline]:border-toggle-border',\n 'hover:opacity-100! data-[variant=outline]:hover:border-toggle-border',\n 'before:inset-y-2 before:left-0 before:pointer-events-none before:absolute before:w-px before:bg-border-secondary/6',\n 'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent',\n 'peer-data-[state=on]/spectral-split-menu:border-toggle-border--active!',\n 'peer-data-[state=on]/spectral-split-menu:bg-toggle-bg--active',\n 'peer-data-[state=on]/spectral-split-menu:hover:border-toggle-border--active!',\n 'peer-data-[state=on]/spectral-split-menu:hover:bg-toggle-bg--active!',\n 'peer-data-[state=on]/spectral-split-menu:text-toggle-text--active',\n 'peer-data-[state=on]/spectral-split-menu:hover:text-toggle-text--active!',\n dropdownButtonClassName,\n )}\n data-layout={resolvedLayout}\n data-size={resolvedSize}\n data-variant={resolvedVariant}\n disabled={isDisabled}\n onKeyDown={handleDropdownTriggerKeyDown}\n onPointerDown={() => {\n openerRef.current = 'chevron'\n }}\n ref={chevronButtonRef}\n style={{ ...sharedActiveStyle, ...dropdownButtonStyle }}\n type='button'\n >\n {triggerIcon}\n </button>\n }\n value={dropdownValue}\n />\n </>\n )\n}\n\nToggleGroupSplitMenuItem.displayName = 'ToggleGroupSplitMenuItem'\n"],"mappings":"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"}
1
+ {"version":3,"file":"ToggleGroupSplitMenuItem.js","names":[],"sources":["../../src/components/ToggleGroup/ToggleGroupSplitMenuItem.tsx"],"sourcesContent":["import { DropdownMenu, type DropdownMenuOption, type DropdownMenuProps } from '@components/DropdownMenu/DropdownMenu'\nimport { ChevronDownIcon } from '@components/Icons'\nimport { toggleVariants } from '@components/Toggle/Toggle'\nimport { getActiveColorStyle } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { useContext, useRef, useState, type CSSProperties, type KeyboardEvent, type ReactNode } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupItem, type ToggleGroupItemProps } from './ToggleGroupItem'\n\nexport interface ToggleGroupSplitMenuItemProps extends Omit<ToggleGroupItemProps, 'children'> {\n children: ReactNode\n dropdownAlign?: DropdownMenuProps['align']\n dropdownAriaLabel: string\n dropdownButtonClassName?: string\n dropdownCollisionPadding?: DropdownMenuProps['collisionPadding']\n dropdownButtonStyle?: CSSProperties\n dropdownOptions: DropdownMenuOption[]\n dropdownSide?: DropdownMenuProps['side']\n dropdownValue?: string | string[]\n dropdownValueLabel?: string\n onDropdownValueChange?: (value: string | string[]) => void\n triggerIcon?: ReactNode\n}\n\nexport const ToggleGroupSplitMenuItem = ({\n activeColor,\n activeTextColor,\n children,\n className,\n dropdownAlign = 'end',\n dropdownAriaLabel,\n dropdownButtonClassName,\n dropdownButtonStyle,\n dropdownCollisionPadding = 12,\n dropdownOptions,\n dropdownSide = 'bottom',\n dropdownValue,\n dropdownValueLabel,\n layout,\n onDropdownValueChange,\n onKeyDown,\n size,\n style,\n triggerIcon = <ChevronDownIcon size={16} />,\n value,\n variant,\n ...props\n}: ToggleGroupSplitMenuItemProps) => {\n const [open, setOpen] = useState(false)\n const dropdownContentRef = useRef<HTMLDivElement | null>(null)\n const primaryButtonRef = useRef<HTMLButtonElement | null>(null)\n const chevronButtonRef = useRef<HTMLButtonElement | null>(null)\n const openerRef = useRef<'primary' | 'chevron' | null>(null)\n const isDisabled = props.disabled ?? false\n const context = useContext(ToggleGroupContext)\n const resolvedVariant = variant ?? context.variant\n const resolvedSize = size ?? context.size\n const resolvedLayout = layout ?? context.layout\n const resolvedOrientation = context.orientation ?? 'horizontal'\n const resolvedActiveColor = activeColor ?? context.activeColor\n const resolvedActiveTextColor = activeTextColor ?? context.activeTextColor\n const sharedActiveStyle = {\n ...getActiveColorStyle(resolvedActiveColor, resolvedActiveTextColor),\n ...style,\n }\n\n const focusFirstEnabledDropdownItem = (focusTarget: 'first' | 'last' = 'first'): void => {\n const content = dropdownContentRef.current\n if (!content) return\n\n const menuItemSelector = '[role=\"menuitem\"]:not([data-disabled]), [role=\"menuitemcheckbox\"]:not([data-disabled]), [role=\"menuitemradio\"]:not([data-disabled])'\n const enabledItems = Array.from(content.querySelectorAll<HTMLElement>(menuItemSelector))\n if (enabledItems.length === 0) return\n\n if (focusTarget === 'last') {\n enabledItems[enabledItems.length - 1]?.focus()\n return\n }\n\n enabledItems[0]?.focus()\n }\n\n const openMenu = (opener: 'primary' | 'chevron'): void => {\n openerRef.current = opener\n setOpen(true)\n setTimeout(() => {\n focusFirstEnabledDropdownItem('first')\n }, 0)\n }\n\n const restoreFocusToOpener = (): void => {\n const opener = openerRef.current\n const focusTarget = opener === 'primary' ? primaryButtonRef.current : chevronButtonRef.current\n openerRef.current = null\n focusTarget?.focus()\n }\n\n const handleDropdownOpenChange = (nextOpen: boolean): void => {\n if (nextOpen) {\n openerRef.current ??= 'chevron'\n setOpen(true)\n setTimeout(() => {\n focusFirstEnabledDropdownItem('first')\n }, 0)\n return\n }\n\n setOpen(false)\n restoreFocusToOpener()\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === 'ArrowDown' && resolvedOrientation !== 'vertical') {\n event.preventDefault()\n openMenu('primary')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n if (onKeyDown) onKeyDown(event)\n }\n\n const handleDropdownTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (open && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n event.preventDefault()\n focusFirstEnabledDropdownItem(event.key === 'ArrowUp' ? 'last' : 'first')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n const isOpenMenuKey = event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ' || event.key === 'Space' || event.key === 'Spacebar'\n\n if (isOpenMenuKey) {\n event.preventDefault()\n openMenu('chevron')\n if (onKeyDown) onKeyDown(event)\n return\n }\n\n if (onKeyDown) onKeyDown(event)\n }\n\n const toggleAriaLabel = props['aria-label'] ? `${props['aria-label']}${dropdownValueLabel ? `, ${dropdownValueLabel}` : ''}` : undefined\n\n return (\n <>\n <ToggleGroupItem\n activeColor={resolvedActiveColor}\n activeTextColor={resolvedActiveTextColor}\n aria-label={toggleAriaLabel}\n className={cn('peer/spectral-split-menu rounded-r-none! border-r-0', className)}\n layout={resolvedLayout}\n onKeyDown={handleKeyDown}\n ref={primaryButtonRef}\n size={resolvedSize}\n style={sharedActiveStyle}\n value={value}\n variant={resolvedVariant}\n {...(({ 'aria-label': _, ...rest }) => rest)(props)}\n >\n {children}\n </ToggleGroupItem>\n\n <DropdownMenu\n align={dropdownAlign}\n asChild\n collisionPadding={dropdownCollisionPadding}\n disabled={isDisabled}\n dropdownContentRef={dropdownContentRef}\n onOpenChange={handleDropdownOpenChange}\n onValueChange={onDropdownValueChange}\n open={open}\n options={dropdownOptions}\n side={dropdownSide}\n trigger={\n <button\n aria-expanded={open}\n aria-haspopup='menu'\n aria-label={dropdownAriaLabel}\n className={cn(\n toggleVariants({\n layout: resolvedLayout,\n size: resolvedSize,\n variant: resolvedVariant,\n }),\n 'px-1 min-w-6 data-[size=sm]:min-w-5 data-[size=sm]:px-0.5 relative rounded-none border-l-0 shadow-none',\n 'data-[size=lg]:min-w-7 data-[size=lg]:px-1.5 data-[variant=divided]:border-toggle-border data-[variant=outline]:border-toggle-border',\n 'hover:opacity-100! data-[variant=divided]:hover:border-toggle-border data-[variant=outline]:hover:border-toggle-border',\n 'before:inset-y-2 before:left-0 before:pointer-events-none before:absolute before:w-px before:bg-border-secondary/6',\n 'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent',\n 'peer-data-[state=on]/spectral-split-menu:border-toggle-border--active!',\n 'peer-data-[state=on]/spectral-split-menu:bg-toggle-bg--active',\n 'peer-data-[state=on]/spectral-split-menu:hover:border-toggle-border--active!',\n 'peer-data-[state=on]/spectral-split-menu:hover:bg-toggle-bg--active!',\n 'peer-data-[state=on]/spectral-split-menu:text-toggle-text--active',\n 'peer-data-[state=on]/spectral-split-menu:hover:text-toggle-text--active!',\n dropdownButtonClassName,\n )}\n data-layout={resolvedLayout}\n data-size={resolvedSize}\n data-variant={resolvedVariant}\n disabled={isDisabled}\n onKeyDown={handleDropdownTriggerKeyDown}\n onPointerDown={() => {\n openerRef.current = 'chevron'\n }}\n ref={chevronButtonRef}\n style={{ ...sharedActiveStyle, ...dropdownButtonStyle }}\n type='button'\n >\n {triggerIcon}\n </button>\n }\n value={dropdownValue}\n />\n </>\n )\n}\n\nToggleGroupSplitMenuItem.displayName = 'ToggleGroupSplitMenuItem'\n"],"mappings":"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"}
@@ -11,7 +11,7 @@ import "class-variance-authority";
11
11
  //#region src/components/ToggleGroup/ToggleGroup.tsx
12
12
  const ToggleGroup = ({ className, variant, size, layout, activeColor, activeTextColor, orientation, children, ...props }) => {
13
13
  return /* @__PURE__ */ jsx(ToggleGroupBase, {
14
- className: cn(`group/toggle-group rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md data-[variant='outline']:gap-0 data-[variant='separated']:gap-1.5 data-[size='sm']:data-[variant='separated']:gap-1 data-[size='lg']:data-[variant='separated']:gap-2 flex h-fit w-fit items-center data-[layout='expanded']:w-full data-[variant='outline']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='outline']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='outline']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='outline']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)]`, className),
14
+ className: cn(`group/toggle-group rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md data-[variant='outline']:gap-0 data-[variant='divided']:gap-0 data-[variant='separated']:gap-1.5 data-[size='sm']:data-[variant='separated']:gap-1 data-[size='lg']:data-[variant='separated']:gap-2 flex h-fit w-fit items-center data-[layout='expanded']:w-full data-[variant='divided']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='outline']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='divided']:[&_button]:border-y-0 data-[variant='divided']:[&_button:first-of-type]:border-l-0 data-[variant='divided']:[&_button:last-of-type]:border-r-0 data-[variant='divided']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='outline']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='divided']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='outline']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='divided']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)] data-[variant='outline']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)]`, className),
15
15
  "data-layout": layout,
16
16
  "data-size": size,
17
17
  "data-slot": "toggle-group",
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleGroup.js","names":[],"sources":["../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { type toggleVariants } from '@components/Toggle/Toggle'\nimport { type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupBase } from './ToggleGroupBase'\nexport { ToggleGroupItem, type ToggleGroupItemProps } from './ToggleGroupItem'\nexport { ToggleGroupSplitMenuItem, type ToggleGroupSplitMenuItemProps } from './ToggleGroupSplitMenuItem'\n\nexport type ToggleGroupProps = ComponentProps<typeof ToggleGroupBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const ToggleGroup = ({ className, variant, size, layout, activeColor, activeTextColor, orientation, children, ...props }: ToggleGroupProps) => {\n return (\n <ToggleGroupBase\n className={cn(\n `group/toggle-group rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md data-[variant='outline']:gap-0 data-[variant='separated']:gap-1.5 data-[size='sm']:data-[variant='separated']:gap-1 data-[size='lg']:data-[variant='separated']:gap-2 flex h-fit w-fit items-center data-[layout='expanded']:w-full data-[variant='outline']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='outline']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='outline']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='outline']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)]`,\n className,\n )}\n data-layout={layout}\n data-size={size}\n data-slot='toggle-group'\n data-testid='spectral-toggle-group'\n data-variant={variant}\n orientation={orientation}\n {...props}\n >\n <ToggleGroupContext.Provider value={{ variant, size, layout, activeColor, activeTextColor, orientation }}>{children}</ToggleGroupContext.Provider>\n </ToggleGroupBase>\n )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,eAAe,EAAE,WAAW,SAAS,MAAM,QAAQ,aAAa,iBAAiB,aAAa,UAAU,GAAG,YAA8B;AACpJ,QACE,oBAAC,iBAAD;EACE,WAAW,GACT,utBACA,UACD;EACD,eAAa;EACb,aAAW;EACX,aAAU;EACV,eAAY;EACZ,gBAAc;EACD;EACb,GAAI;YAEJ,oBAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;IAAa;IAAiB;IAAa;GAAG;GAAuC;EAClI"}
1
+ {"version":3,"file":"ToggleGroup.js","names":[],"sources":["../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { type toggleVariants } from '@components/Toggle/Toggle'\nimport { type ActiveColor, type ActiveTextColor } from '@utils/activeColorStyle'\nimport { cn } from '@utils/twUtils'\nimport { type VariantProps } from 'class-variance-authority'\nimport { type ComponentProps } from 'react'\nimport { ToggleGroupContext } from './ToggleGroup.context'\nimport { ToggleGroupBase } from './ToggleGroupBase'\nexport { ToggleGroupItem, type ToggleGroupItemProps } from './ToggleGroupItem'\nexport { ToggleGroupSplitMenuItem, type ToggleGroupSplitMenuItemProps } from './ToggleGroupSplitMenuItem'\n\nexport type ToggleGroupProps = ComponentProps<typeof ToggleGroupBase> &\n VariantProps<typeof toggleVariants> & {\n activeColor?: ActiveColor\n activeTextColor?: ActiveTextColor\n }\n\nexport const ToggleGroup = ({ className, variant, size, layout, activeColor, activeTextColor, orientation, children, ...props }: ToggleGroupProps) => {\n return (\n <ToggleGroupBase\n className={cn(\n `group/toggle-group rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md data-[variant='outline']:gap-0 data-[variant='divided']:gap-0 data-[variant='separated']:gap-1.5 data-[size='sm']:data-[variant='separated']:gap-1 data-[size='lg']:data-[variant='separated']:gap-2 flex h-fit w-fit items-center data-[layout='expanded']:w-full data-[variant='divided']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='outline']:[--color-toggle-border:var(--color-toggle-outline-border)] data-[variant='divided']:[&_button]:border-y-0 data-[variant='divided']:[&_button:first-of-type]:border-l-0 data-[variant='divided']:[&_button:last-of-type]:border-r-0 data-[variant='divided']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='outline']:[&_button:not(:first-of-type)]:border-l-0 data-[variant='divided']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='outline']:[&_button:not(:last-of-type)]:[border-right-color:var(--color-toggle-outline-divider)] data-[variant='divided']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)] data-[variant='outline']:[&_button[data-state='on']:not(:last-of-type)]:[border-right-color:var(--color-toggle-border--active)]`,\n className,\n )}\n data-layout={layout}\n data-size={size}\n data-slot='toggle-group'\n data-testid='spectral-toggle-group'\n data-variant={variant}\n orientation={orientation}\n {...props}\n >\n <ToggleGroupContext.Provider value={{ variant, size, layout, activeColor, activeTextColor, orientation }}>{children}</ToggleGroupContext.Provider>\n </ToggleGroupBase>\n )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,eAAe,EAAE,WAAW,SAAS,MAAM,QAAQ,aAAa,iBAAiB,aAAa,UAAU,GAAG,YAA8B;AACpJ,QACE,oBAAC,iBAAD;EACE,WAAW,GACT,qyCACA,UACD;EACD,eAAa;EACb,aAAW;EACX,aAAU;EACV,eAAY;EACZ,gBAAc;EACD;EACb,GAAI;YAEJ,oBAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;IAAa;IAAiB;IAAa;GAAG;GAAuC;EAClI"}
@@ -82,16 +82,16 @@
82
82
  box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.10) inset, 0 20px 40px 0 rgba(0, 0, 0, 0.25), 0 15px 30px 0 rgba(0, 0, 0, 0.15), 0 5px 10px 0 rgba(0, 0, 0, 0.05);
83
83
  }
84
84
 
85
- .tooltip-effects {
86
- box-shadow: 3px 3px 6px 3px rgba(0,0,0,0.3);
87
- }
88
-
89
- .map-card-effects {
90
- background: var(--color-background);
85
+ .card-effects-dark {
86
+ background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.00) 52%), rgba(38, 38, 38, 0.57);
91
87
  backdrop-filter: blur(12px);
92
- border: 0.5px solid rgba(255, 255, 255, 0.05);
88
+ border: 0.5px solid rgba(255, 255, 255, 0.06);
93
89
  border-radius: 1rem;
94
- box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.10) inset, 0 20px 40px 0 rgba(0, 0, 0, 0.25), 0 15px 30px 0 rgba(0, 0, 0, 0.15), 0 5px 10px 0 rgba(0, 0, 0, 0.05);
90
+ box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.03) inset, 0 -1px 0 0 rgba(0, 0, 0, 0.22) inset, 0 22px 44px -8px rgba(0, 0, 0, 0.34), 0 10px 20px -8px rgba(0, 0, 0, 0.24);
91
+ }
92
+
93
+ .tooltip-effects {
94
+ box-shadow: 3px 3px 6px 3px rgba(0,0,0,0.3);
95
95
  }
96
96
 
97
97
  @supports not (backdrop-filter: blur(0)) {
@@ -100,6 +100,11 @@
100
100
  /* Fallback: slightly opaque fill to hint depth without blur */
101
101
  background-color: hsla(240, 4%, 14%, 0.6);
102
102
  }
103
+
104
+ .card-effects-dark {
105
+ /* Fallback tuned for level-zero dark surfaces */
106
+ background-color: hsla(240, 4%, 16%, 0.72);
107
+ }
103
108
  }
104
109
 
105
110
  /* DatePicker styles */
@@ -1,4 +1,4 @@
1
1
  @layer spectral {
2
2
  /*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
3
- @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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-outline-style:solid;--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;--tw-content:""}}}:root,:host{--font-sans:"Work Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji";--font-mono:"Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace;--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-500:oklch(55.1% .027 264.364);--color-neutral-100:oklch(97% 0 0);--color-neutral-200:oklch(92.2% 0 0);--color-neutral-400:oklch(70.8% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-2xs:18rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tighter:-.05em;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-relaxed:1.625;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-background:var(--horizon-color-neutral-950);--color-text-primary:var(--horizon-color-neutral-50);--color-text-inverted:var(--horizon-color-neutral-950);--color-text-secondary:var(--horizon-color-neutral-300);--color-text-disabled:var(--horizon-color-neutral-600);--color-border-secondary:var(--horizon-color-neutral-700);--color-accent:var(--horizon-color-accent);--color-overlay:var(--horizon-color-neutral-950)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-overlay:color-mix(in oklab, var(--horizon-color-neutral-950) 40%, transparent)}}:root,:host{--color-level-one:var(--horizon-color-level-one);--color-level-two:var(--horizon-color-level-two);--color-level-three:var(--horizon-color-level-three);--color-level-four:var(--horizon-color-level-four);--color-success-400:var(--horizon-color-success-400);--color-warning-400:var(--horizon-color-warning-400);--color-danger-200:var(--horizon-color-danger-200);--color-danger-400:var(--horizon-color-danger-400);--color-danger-500:var(--horizon-color-danger-500);--color-alert-bg:var(--horizon-color-level-two);--color-alert-border:var(--horizon-color-level-three);--color-alert-text:var(--horizon-color-neutral-50);--color-alert-success-bg:var(--horizon-color-success-50);--color-alert-success-border:var(--horizon-color-success-500);--color-alert-success-text:var(--horizon-color-success-500);--color-alert-warning-bg:var(--horizon-color-warning-50);--color-alert-warning-border:var(--horizon-color-warning-500);--color-alert-warning-text:var(--horizon-color-warning-500);--color-alert-danger-bg:var(--horizon-color-danger-50);--color-alert-danger-border:var(--horizon-color-danger-500);--color-alert-danger-text:var(--horizon-color-danger-500);--color-alert-info-bg:var(--horizon-color-primary-50);--color-alert-info-border:var(--horizon-color-primary-700);--color-alert-info-text:var(--horizon-color-primary-700);--color-badge-primary-bg:var(--horizon-color-level-five);--color-badge-primary-bg--hover:var(--horizon-color-level-four);--color-badge-secondary-bg:var(--horizon-color-accent);--color-badge-secondary-text:var(--horizon-color-neutral-950);--color-badge-outline-border:var(--horizon-color-level-five);--color-badge-destructive-bg:var(--horizon-color-danger-400);--color-badge-destructive-border:var(--horizon-color-danger-400);--color-button-primary-bg:var(--horizon-color-accent);--color-button-primary-bg--hover:var(--horizon-color-level-two);--color-button-primary-bg--disabled:var(--horizon-color-neutral-500);--color-button-primary-border:var(--horizon-color-accent);--color-button-primary-border--hover:var(--horizon-color-level-two);--color-button-primary-border--disabled:var(--horizon-color-neutral-500);--color-button-primary-text:var(--horizon-color-neutral-900);--color-button-primary-text--hover:var(--horizon-color-accent);--color-button-primary-text--disabled:var(--horizon-color-neutral-200);--color-button-secondary-bg:var(--horizon-color-level-two);--color-button-secondary-bg--hover:var(--horizon-color-accent);--color-button-secondary-bg--disabled:var(--horizon-color-neutral-500);--color-button-secondary-text:var(--horizon-color-neutral-50);--color-button-secondary-text--hover:var(--horizon-color-level-two);--color-button-secondary-text--disabled:var(--horizon-color-neutral-200);--color-button-secondary-border:var(--horizon-color-neutral-900);--color-button-secondary-border--disabled:var(--horizon-color-neutral-500);--color-button-outline-bg:var(--horizon-color-transparent);--color-button-outline-bg--hover:var(--horizon-color-level-two);--color-button-outline-text:var(--horizon-color-neutral-50);--color-button-outline-text--hover:var(--horizon-color-accent);--color-button-outline-text--disabled:var(--horizon-color-neutral-400);--color-button-outline-border:var(--horizon-color-accent);--color-button-outline-border--disabled:var(--horizon-color-neutral-400);--color-button-ghost-bg:var(--horizon-color-transparent);--color-button-ghost-bg--hover:var(--horizon-color-level-two);--color-button-ghost-text:var(--horizon-color-neutral-50);--color-button-ghost-text--hover:var(--horizon-color-accent);--color-button-ghost-text--disabled:var(--horizon-color-neutral-400);--color-button-danger:var(--horizon-color-danger-400);--color-button-danger--hover:var(--horizon-color-danger-500)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-button-danger--hover:color-mix(in oklab, var(--horizon-color-danger-500) 80%, transparent)}}:root,:host{--color-checkbox-border:var(--horizon-color-neutral-100);--color-checkbox-border--focus:var(--horizon-color-accent);--color-checkbox-border--checked:var(--horizon-color-accent);--color-checkbox-indicator--checked:var(--horizon-color-accent);--color-data-card-description:var(--horizon-color-neutral-300);--color-dialog-bg:var(--horizon-color-level-one);--color-drawer-bg:var(--horizon-color-level-one);--color-input-border:var(--horizon-color-white)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-input-border:color-mix(in oklab, var(--horizon-color-white) 10%, transparent)}}:root,:host{--color-input-border--hover:var(--horizon-color-neutral-300);--color-input-border--focus:var(--horizon-color-accent);--color-input-border--disabled:var(--horizon-color-neutral-500);--color-input-bg:var(--horizon-color-level-zero);--color-input-bg--hover:var(--horizon-color-level-four);--color-input-bg--disabled:var(--horizon-color-neutral-700);--color-input-bg--selected:var(--horizon-color-level-four);--color-input-text:var(--horizon-color-neutral-50);--color-input-text-prefix:var(--horizon-color-neutral-200);--color-input-text--disabled:var(--horizon-color-neutral-200);--color-input-text-placeholder:var(--horizon-color-neutral-500);--color-input-primitive-border:var(--horizon-color-neutral-800);--color-input-otp-filled-separator:var(--horizon-color-level-five);--color-input-otp-border:var(--horizon-color-neutral-300);--color-input-otp-border--focus:var(--horizon-color-accent);--color-input-otp-caret:var(--horizon-color-neutral-200);--color-kbd-bg:var(--horizon-color-level-two);--color-kbd-text:var(--color-text-secondary);--color-popover-bg:var(--horizon-color-level-one);--color-popover-text:var(--horizon-color-neutral-50);--color-radio-bg:var(--horizon-color-neutral-900);--color-radio-bg--selected:var(--horizon-color-accent);--color-radio-border--hover:var(--horizon-color-accent);--color-radio-border--selected:var(--horizon-color-accent);--color-slider-track:var(--horizon-color-neutral-700);--color-slider-range:var(--horizon-color-neutral-50);--color-slider-thumb-border:var(--horizon-color-neutral-50);--color-slider-thumb-bg:var(--horizon-color-neutral-50);--color-slider-thumb-ring:var(--horizon-color-neutral-50);--color-switch-bg:var(--horizon-color-neutral-700);--color-switch-bg--checked:var(--horizon-color-white);--color-switch-thumb:var(--horizon-color-neutral-950);--color-switch-thumb--checked:var(--horizon-color-white);--color-tabs-group-bg:var(--horizon-color-level-one);--color-tabs-indicator:var(--horizon-color-accent);--color-tabs-enclosed-indicator:var(--horizon-color-level-two);--color-tabs-border:var(--horizon-color-level-four);--color-toast-bg:var(--horizon-color-level-one);--color-toast-border:var(--horizon-color-level-four);--color-toast-text:var(--horizon-color-neutral-50);--color-toast-success-bg:var(--horizon-color-success-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-success-bg:color-mix(in oklab, var(--horizon-color-success-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-success-border:var(--horizon-color-success-400);--color-toast-success-text:var(--horizon-color-success-400);--color-toast-success-icon:var(--horizon-color-success-400);--color-toast-warning-bg:var(--horizon-color-warning-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-warning-bg:color-mix(in oklab, var(--horizon-color-warning-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-warning-border:var(--horizon-color-warning-400);--color-toast-warning-text:var(--horizon-color-warning-400);--color-toast-warning-icon:var(--horizon-color-warning-400);--color-toast-danger-bg:var(--horizon-color-danger-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-danger-bg:color-mix(in oklab, var(--horizon-color-danger-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-danger-border:var(--horizon-color-danger-400);--color-toast-danger-text:var(--horizon-color-danger-400);--color-toast-danger-icon:var(--horizon-color-danger-400);--color-toast-info-bg:var(--horizon-color-primary-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-info-bg:color-mix(in oklab, var(--horizon-color-primary-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-info-border:var(--horizon-color-primary-400);--color-toast-info-text:var(--horizon-color-primary-400);--color-toast-info-icon:var(--horizon-color-primary-400);--color-toggle-bg:var(--horizon-color-level-two);--color-toggle-bg--active-default:var(--horizon-color-primary-700);--color-toggle-bg--active:var(--color-toggle-bg--active-default);--color-toggle-bg--hover:var(--horizon-color-level-four);--color-toggle-border:var(--horizon-color-transparent);--color-toggle-border--hover:var(--horizon-color-level-four);--color-toggle-border--active-default:var(--horizon-color-primary-600);--color-toggle-border--active:var(--color-toggle-border--active-default);--color-toggle-text:var(--horizon-color-neutral-50);--color-toggle-text--hover:var(--horizon-color-neutral-200);--color-toggle-text--active-default:var(--color-text-primary);--color-toggle-text--active:var(--color-toggle-text--active-default);--color-toggle-outline-border:var(--horizon-color-neutral-700);--color-toggle-outline-divider:var(--horizon-color-neutral-600);--color-toggle-outline-border--hover:var(--horizon-color-neutral-400);--color-tooltip-bg:var(--horizon-color-level-one);--color-tooltip-arrow:var(--horizon-color-level-one);--color-tooltip-outline-border:var(--horizon-color-level-four);--color-tooltip-outline-arrow:var(--horizon-color-level-four);--color-black-40:oklch(0% 0 0/.4);--animate-caret-blink:caret-blink 1.2s ease-out infinite;--animate-accordion-down:accordion-down .2s ease-out;--animate-accordion-up:accordion-up .2s ease-out}:root{--horizon-color-black:oklch(0% 0 0);--horizon-color-white:oklch(100% 0 0);--horizon-color-transparent:oklch(0% 0 0/0);--horizon-color-accent:oklch(92.53% .1976 123.38);--horizon-color-neutral-50:oklch(98.5% 0 0);--horizon-color-neutral-100:oklch(92.19% 0 0);--horizon-color-neutral-200:oklch(86.99% 0 0);--horizon-color-neutral-300:oklch(79.03% 0 0);--horizon-color-neutral-400:oklch(71.55% 0 0);--horizon-color-neutral-500:oklch(55.55% 0 0);--horizon-color-neutral-600:oklch(43.86% 0 0);--horizon-color-neutral-700:oklch(37.15% 0 0);--horizon-color-neutral-800:oklch(32.11% 0 0);--horizon-color-neutral-900:oklch(26.86% 0 0);--horizon-color-neutral-950:oklch(21.78% 0 0);--horizon-color-primary-50:oklch(97.37% .01 238);--horizon-color-primary-100:oklch(93.88% .03 242.35);--horizon-color-primary-200:oklch(89.3% .06 242.83);--horizon-color-primary-300:oklch(83.05% .09 240.33);--horizon-color-primary-400:oklch(74.57% .14 245.84);--horizon-color-primary-500:oklch(66.23% .18 254.28);--horizon-color-primary-600:oklch(58.57% .21 259.12);--horizon-color-primary-700:oklch(52.25% .21 261.44);--horizon-color-primary-800:oklch(42.44% .17 262.29);--horizon-color-primary-900:oklch(39.88% .14 261.51);--horizon-color-primary-950:oklch(29.27% .09 263.49);--horizon-color-level-zero:oklch(23.78% 0 0);--horizon-color-level-one:oklch(26.94% 0 0);--horizon-color-level-two:oklch(29.93% 0 0);--horizon-color-level-three:oklch(32.89% 0 0);--horizon-color-level-four:oklch(35.71% 0 0);--horizon-color-level-five:oklch(38.62% 0 0);--horizon-color-success-50:oklch(96.2% .044 156.743);--horizon-color-success-100:oklch(92.5% .084 155.995);--horizon-color-success-200:oklch(87.1% .15 154.449);--horizon-color-success-300:oklch(79.2% .209 151.711);--horizon-color-success-400:oklch(72.3% .219 149.579);--horizon-color-success-500:oklch(62.7% .194 149.214);--horizon-color-warning-50:oklch(95.4% .038 75.164);--horizon-color-warning-100:oklch(90.1% .076 70.697);--horizon-color-warning-200:oklch(83.7% .128 66.29);--horizon-color-warning-300:oklch(75% .183 55.934);--horizon-color-warning-400:oklch(70.5% .213 47.604);--horizon-color-warning-500:oklch(64.6% .222 41.116);--horizon-color-danger-50:oklch(93.6% .032 17.717);--horizon-color-danger-100:oklch(88.5% .062 18.334);--horizon-color-danger-200:oklch(80.8% .114 19.571);--horizon-color-danger-300:oklch(70.4% .191 22.216);--horizon-color-danger-400:oklch(57.7% .245 27.325);--horizon-color-danger-500:oklch(50.5% .213 27.518)}:root[data-theme=light]{--horizon-color-level-one:oklch(98.51% 0 0);--color-background:var(--horizon-color-neutral-50)}@keyframes animate-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes animate-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes caret-blink{0%,70%,to{opacity:1}20%,50%{opacity:0}}@keyframes fade-in-0{0%{opacity:0}to{opacity:1}}@keyframes fade-out-0{0%{opacity:1}to{opacity:0}}@keyframes fade-in-tabs-indicator{0%{opacity:0;transform:translateY(-2rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down-from-top{0%{opacity:0;transform:translateY(-100%)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slide-up-to-top{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-100%)scale(.95)}}@keyframes spin-around{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}@keyframes zoom-in-95{0%{opacity:0;transform:translate(-50%)translateY(-50%)scale(.95)}to{opacity:1;transform:translate(-50%)translateY(-50%)scale(1)}}@keyframes zoom-out-95{0%{opacity:1;transform:translate(-50%)translateY(-50%)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-50%)scale(.95)}}@keyframes accordion-down{0%{opacity:0;height:0}to{height:var(--radix-accordion-content-height);opacity:1}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height);opacity:1}to{opacity:0;height:0}}@layer utilities{a.underline-on-hover{color:var(--color-accent);cursor:pointer;width:max-content;text-decoration:none;position:relative}a.underline-on-hover:before{background-color:var(--color-accent);content:"";border-radius:.1rem;width:100%;height:.1rem;transition:transform .3s ease-in-out;position:absolute;bottom:-.2rem;left:0;transform:scaleX(0)}a.underline-on-hover:hover:before{transform:scaleX(1)}.spectral-root{isolation:isolate}[data-vaul-drawer] *,[data-vaul-drawer] :before,[data-vaul-drawer] :after{box-sizing:border-box!important}[vaul-drawer]{transition:transform .2s cubic-bezier(.165,.84,.44,1)!important}[vaul-overlay]{transition:opacity .2s cubic-bezier(.165,.84,.44,1)!important}.shadow-neumorphic-large{box-shadow:12px 12px 24px var(--color-shadow-neumorphic-large), -12px -12px 24px var(--color-white)}.shadow-neumorphic-small{box-shadow:4px 4px 8px var(--color-shadow-neumorphic), -4px -4px 8px var(--color-white)}.dialog-no-animations,.dialog-no-animations[data-state=open],.dialog-no-animations[data-state=closed]{animation:none!important;transform:translate(-50%)translateY(-50%)!important}svg:focus-visible,svg:focus{outline:none}.card-effects{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#ffffff03 0%,#fff0 100%),#26262680;border:.5px solid #ffffff0d;border-radius:1rem;box-shadow:inset 0 -1px #0000001a,0 20px 40px #00000040,0 15px 30px #00000026,0 5px 10px #0000000d}.tooltip-effects{box-shadow:3px 3px 6px 3px #0000004d}.map-card-effects{background:var(--color-background);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:.5px solid #ffffff0d;border-radius:1rem;box-shadow:inset 0 -1px #0000001a,0 20px 40px #00000040,0 15px 30px #00000026,0 5px 10px #0000000d}@supports not ((-webkit-backdrop-filter:blur(0)) or (backdrop-filter:blur(0))){.card-effects{background-color:#22222599}}.rdp{margin:0}.rdp-root{padding-right:24px}.rdp-root .rdp-nav{z-index:9999;position:absolute}.rdp-root .rdp-nav .nav-prev,.rdp-root .rdp-nav .nav-next{justify-content:center;align-items:center;display:flex;position:absolute}:is(.rdp-root .rdp-nav .nav-prev,.rdp-root .rdp-nav .nav-next):hover{color:var(--color-text-secondary);cursor:pointer;background-color:#0000}.rdp-root .rdp-month_caption{justify-content:center;align-items:center;padding-block-end:8px;display:flex;position:relative}.rdp-root .rdp-month_caption .month-title{font-size:18px;font-weight:600}.rdp-root .rdp-day_button{border-color:#0000;border-radius:100%;width:40px;height:40px}.rdp-root .day.rdp-today{color:var(--color-accent);font-weight:600}.rdp-root .day.rdp-selected .rdp-day_button{background-color:var(--color-accent);color:var(--color-text-inverted);border-radius:50%;font-weight:600}.rdp-root .day.rdp-outside .rdp-day_button{opacity:.25}.rdp-root .day:not(.rdp-disabled):hover{background-color:var(--color-neutral-200);color:var(--color-text-inverted);border-radius:50%;cursor:pointer!important}.rdp-root .day.rdp-disabled .rdp-day_button{color:var(--color-text-disabled)}.rdp-root .day.rdp-hidden .rdp-day_button{visibility:hidden}.rdp-root .rdp-weekdays .rdp-weekday{color:var(--color-neutral-400);font-weight:500}:is(.rdp-root .hours,.rdp-root .minutes) input{width:max-content;max-width:22px}:is(.rdp-root .hours,.rdp-root .minutes) input.hours-input{text-align:right}:is(.rdp-root .hours,.rdp-root .minutes) input.minutes-input{text-align:left}:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input{border:0;font-size:16px}:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:hover,:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:focus,:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:focus-visible{border:0;outline:0}.rdp-root .hours{flex-direction:row;align-items:center;display:flex}.rdp-root .hours input{text-align:right}.rdp-root .hours span{margin-inline:1px 2px}.rdp-root .am-pm{width:auto;margin-inline-start:8px}.rdp-root .am-pm button{background-color:#0000;border:0;padding-inline:0;font-size:14px}.rdp-root .am-pm button:hover{cursor:pointer}.rdp-root .am-pm button:focus,.rdp-root .am-pm button:focus-visible{outline:0}.rdp-root .am-pm button svg:not(.chevron-icon){display:none}.rdp-root .am-pm span:focus,.rdp-root .am-pm span:focus-visible{outline:0}.rdp-root .am-pm-dropdown{z-index:999;border-bottom-right-radius:4px;border-bottom-left-radius:4px;width:58px;margin-top:-5px;font-size:14px;position:relative}.rdp-root .am-pm-dropdown:hover{cursor:pointer}.rdp-root .am-pm-dropdown .am-pm-option{text-align:center;z-index:999;justify-content:center;align-items:center;height:24px;padding-inline:8px;display:flex}.rdp-root .am-pm-dropdown .am-pm-option:focus-visible,.rdp-root .am-pm-dropdown .am-pm-option:focus{outline:0}}.\@container\/card-header{container:card-header/inline-size}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing) * 0)}.inset-y-0{inset-block:calc(var(--spacing) * 0)}.top-0{top:calc(var(--spacing) * 0)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-4{top:calc(var(--spacing) * 4)}.top-\[50\%\]{top:50%}.right-0{right:calc(var(--spacing) * 0)}.right-1{right:calc(var(--spacing) * 1)}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.right-10{right:calc(var(--spacing) * 10)}.right-\[-14px\]{right:-14px}.right-px{right:1px}.bottom-0{bottom:calc(var(--spacing) * 0)}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-4{bottom:calc(var(--spacing) * 4)}.bottom-px{bottom:1px}.left-0{left:calc(var(--spacing) * 0)}.left-1{left:calc(var(--spacing) * 1)}.left-1\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.left-4{left:calc(var(--spacing) * 4)}.left-\[50\%\]{left:50%}.left-\[calc\(100\%-0\.75rem\)\]{left:calc(100% - .75rem)}.left-\[calc\(100\%-1\.5rem\)\]{left:calc(100% - 1.5rem)}.left-\[calc\(100\%-1\.25rem\)\]{left:calc(100% - 1.25rem)}.left-\[calc\(100\%-1rem\)\]{left:calc(100% - 1rem)}.isolate{isolation:isolate}.z-0{z-index:0}.z-1{z-index:1}.z-10{z-index:10}.z-50{z-index:50}.z-\[-1\]{z-index:-1}.z-\[1\]{z-index:1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing) * 0)}.m-0\!{margin:calc(var(--spacing) * 0)!important}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.-mx-6{margin-inline:calc(var(--spacing) * -6)}.mx-3{margin-inline:calc(var(--spacing) * 3)}.my-0\.5{margin-block:calc(var(--spacing) * .5)}.my-1{margin-block:calc(var(--spacing) * 1)}.-me-0\.5{margin-inline-end:calc(var(--spacing) * -.5)}.me-0{margin-inline-end:calc(var(--spacing) * 0)}.-mbe-0\.5{margin-block-end:calc(var(--spacing) * -.5)}.mbe-0{margin-block-end:calc(var(--spacing) * 0)}.\!mt-4{margin-top:calc(var(--spacing) * 4)!important}.mt-0\!{margin-top:calc(var(--spacing) * 0)!important}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-0\.5\!{margin-top:calc(var(--spacing) * .5)!important}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-4\!{margin-top:calc(var(--spacing) * 4)!important}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-6\!{margin-top:calc(var(--spacing) * 6)!important}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-\[1\.6rem\]{margin-top:1.6rem}.mt-\[21px\]{margin-top:21px}.mr-2{margin-right:calc(var(--spacing) * 2)}.mr-\[-4px\]{margin-right:-4px}.mb-0\!{margin-bottom:calc(var(--spacing) * 0)!important}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-\[1\.2rem\]{margin-bottom:1.2rem}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:calc(var(--spacing) * 1)}.ml-2{margin-left:calc(var(--spacing) * 2)}.ml-8{margin-left:calc(var(--spacing) * 8)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.table{display:table}.aspect-square{aspect-ratio:1}.size-2\.5{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-6\.5{width:calc(var(--spacing) * 6.5);height:calc(var(--spacing) * 6.5)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-full{width:100%;height:100%}.h-\(--radix-select-trigger-height\){height:var(--radix-select-trigger-height)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-4{height:calc(var(--spacing) * 4)}.h-4\.5{height:calc(var(--spacing) * 4.5)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-12\!{height:calc(var(--spacing) * 12)!important}.h-64{height:calc(var(--spacing) * 64)}.h-80{height:calc(var(--spacing) * 80)}.h-\[72px\]{height:72px}.h-\[inherit\]{height:inherit}.h-auto{height:auto}.h-fit{height:fit-content}.h-full{height:100%}.h-px{height:1px}.max-h-\(--radix-popover-content-available-height\){max-height:var(--radix-popover-content-available-height)}.max-h-22{max-height:calc(var(--spacing) * 22)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-80{max-height:calc(var(--spacing) * 80)}.max-h-\[90vh\]{max-height:90vh}.max-h-\[min\(var\(--available-height\)\,18rem\)\]{max-height:min(var(--available-height), 18rem)}.max-h-\[min\(var\(--radix-dropdown-menu-content-available-height\)\,300px\)\]{max-height:min(var(--radix-dropdown-menu-content-available-height), 300px)}.max-h-\[min\(var\(--radix-select-content-available-height\)\,300px\)\]{max-height:min(var(--radix-select-content-available-height), 300px)}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-8{min-height:calc(var(--spacing) * 8)}.min-h-12\!{min-height:calc(var(--spacing) * 12)!important}.w-\(--popover-width\){width:var(--popover-width)}.w-\(--spectral-select-content-width\){width:var(--spectral-select-content-width)}.w-1\/3{width:33.3333%}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-2xs{width:var(--container-2xs)}.w-4{width:calc(var(--spacing) * 4)}.w-4\.5{width:calc(var(--spacing) * 4.5)}.w-5{width:calc(var(--spacing) * 5)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-14{width:calc(var(--spacing) * 14)}.w-44{width:calc(var(--spacing) * 44)}.w-72{width:calc(var(--spacing) * 72)}.w-\[60\%\]{width:60%}.w-\[240px\]{width:240px}.w-\[300px\]{width:300px}.w-\[320px\]{width:320px}.w-\[330px\]{width:330px}.w-\[340px\]{width:340px}.w-\[360px\]{width:360px}.w-\[380px\]{width:380px}.w-\[400px\]{width:400px}.w-\[420px\]{width:420px}.w-\[486px\]{width:486px}.w-\[520px\]{width:520px}.w-\[560px\]{width:560px}.w-auto{width:auto}.w-auto\!{width:auto!important}.w-fit{width:fit-content}.w-full{width:100%}.w-lg{width:var(--container-lg)}.w-max{width:max-content}.w-px{width:1px}.max-w-44{max-width:calc(var(--spacing) * 44)}.max-w-48{max-width:calc(var(--spacing) * 48)}.max-w-\[360px\]{max-width:360px}.max-w-\[400px\]{max-width:400px}.max-w-\[420px\]{max-width:420px}.max-w-\[520px\]{max-width:520px}.max-w-\[600px\]{max-width:600px}.max-w-\[800px\]{max-width:800px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-xl{max-width:var(--container-xl)}.min-w-\(--spectral-select-content-width\){min-width:var(--spectral-select-content-width)}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-5{min-width:calc(var(--spacing) * 5)}.min-w-6{min-width:calc(var(--spacing) * 6)}.min-w-8{min-width:calc(var(--spacing) * 8)}.min-w-9{min-width:calc(var(--spacing) * 9)}.min-w-10{min-width:calc(var(--spacing) * 10)}.min-w-32{min-width:calc(var(--spacing) * 32)}.min-w-\[300px\]{min-width:300px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.basis-\[30\%\]{flex-basis:30%}.basis-\[70\%\]{flex-basis:70%}.border-collapse{border-collapse:collapse}.origin-\(--radix-dropdown-menu-content-transform-origin\){transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.origin-\(--radix-popover-content-transform-origin\){transform-origin:var(--radix-popover-content-transform-origin)}.origin-\(--radix-select-content-transform-origin\){transform-origin:var(--radix-select-content-transform-origin)}.origin-\(--transform-origin\){transform-origin:var(--transform-origin)}.origin-\[--radix-hover-card-content-transform-origin\]{transform-origin:--radix-hover-card-content-transform-origin}.origin-\[--radix-popover-content-transform-origin\]{transform-origin:--radix-popover-content-transform-origin}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-x-2{--tw-translate-x:calc(var(--spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-0\.5{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-\[calc\(50\%\+1px\)\]{--tw-translate-y:calc(calc(50% + 1px) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-\[calc\(50\%-1\.5px\)\]{--tw-translate-y:calc(calc(50% - 1.5px) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0{--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.-rotate-90{rotate:-90deg}.rotate-45{rotate:45deg}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-wait{cursor:wait}.touch-none{touch-action:none}.scroll-my-1{scroll-margin-block:calc(var(--spacing) * 1)}.list-inside{list-style-position:inside}.list-inside\!{list-style-position:inside!important}.list-disc{list-style-type:disc}.\[appearance\:textfield\]{appearance:textfield}.grid-cols-\[1fr_1fr\]{grid-template-columns:1fr 1fr}.grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.justify-items-start{justify-items:start}.gap-0{gap:calc(var(--spacing) * 0)}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-\[0\.4rem\]{gap:.4rem}.gap-\[15px\]{gap:15px}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-y-1{row-gap:calc(var(--spacing) * 1)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}.self-stretch{align-self:stretch}.justify-self-end{justify-self:flex-end}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-contain{overscroll-behavior:contain}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[2px\]{border-radius:2px}.rounded-\[8px\]{border-radius:8px}.rounded-\[16px\]{border-radius:16px}.rounded-\[var\(--radius\,0\.375rem\)\]{border-radius:var(--radius,.375rem)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-none{border-radius:0}.rounded-none\!{border-radius:0!important}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-xs{border-radius:var(--radius-xs)}.rounded-s-md{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md)}.rounded-s-none{border-start-start-radius:0;border-end-start-radius:0}.rounded-ss-md{border-start-start-radius:var(--radius-md)}.rounded-ss-none{border-start-start-radius:0}.rounded-e-md{border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md)}.rounded-e-none{border-start-end-radius:0;border-end-end-radius:0}.rounded-se-md{border-start-end-radius:var(--radius-md)}.rounded-se-none{border-start-end-radius:0}.rounded-ee-md{border-end-end-radius:var(--radius-md)}.rounded-ee-none{border-end-end-radius:0}.rounded-es-md{border-end-start-radius:var(--radius-md)}.rounded-es-none{border-end-start-radius:0}.rounded-r-none\!{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-r-xl{border-top-right-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-2\!{border-style:var(--tw-border-style)!important;border-width:2px!important}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-r-0{border-right-style:var(--tw-border-style);border-right-width:0}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-l-0{border-left-style:var(--tw-border-style);border-left-width:0}.border-none{--tw-border-style:none;border-style:none}.border-none\!{--tw-border-style:none!important;border-style:none!important}.border-\[\#F5F5F5\]{border-color:#f5f5f5}.border-\[\#F7F7F7\]{border-color:#f7f7f7}.border-alert-border{border-color:var(--color-alert-border)}.border-alert-danger-border{border-color:var(--color-alert-danger-border)}.border-alert-info-border{border-color:var(--color-alert-info-border)}.border-alert-success-border{border-color:var(--color-alert-success-border)}.border-alert-warning-border{border-color:var(--color-alert-warning-border)}.border-badge-outline-border{border-color:var(--color-badge-outline-border)}.border-border-secondary{border-color:var(--color-border-secondary)}.border-button-danger{border-color:var(--color-button-danger)}.border-button-outline-border{border-color:var(--color-button-outline-border)}.border-button-outline-border--disabled{border-color:var(--color-button-outline-border--disabled)}.border-button-primary-border{border-color:var(--color-button-primary-border)}.border-button-primary-border--disabled{border-color:var(--color-button-primary-border--disabled)}.border-button-secondary-border{border-color:var(--color-button-secondary-border)}.border-button-secondary-border--disabled{border-color:var(--color-button-secondary-border--disabled)}.border-checkbox-border{border-color:var(--color-checkbox-border)}.border-danger-400{border-color:var(--color-danger-400)}.border-gray-200{border-color:var(--color-gray-200)}.border-input-border{border-color:var(--color-input-border)}.border-input-otp-border{border-color:var(--color-input-otp-border)}.border-input-otp-border--focus{border-color:var(--color-input-otp-border--focus)}.border-level-four{border-color:var(--color-level-four)}.border-level-one{border-color:var(--color-level-one)}.border-level-three{border-color:var(--color-level-three)}.border-slider-thumb-border{border-color:var(--color-slider-thumb-border)}.border-tabs-border{border-color:var(--color-tabs-border)}.border-toast-border{border-color:var(--color-toast-border)}.border-toast-danger-border{border-color:var(--color-toast-danger-border)}.border-toast-info-border{border-color:var(--color-toast-info-border)}.border-toast-success-border{border-color:var(--color-toast-success-border)}.border-toast-warning-border{border-color:var(--color-toast-warning-border)}.border-toggle-border{border-color:var(--color-toggle-border)}.border-toggle-outline-border{border-color:var(--color-toggle-outline-border)}.border-tooltip-outline-arrow{border-color:var(--color-tooltip-outline-arrow)}.border-tooltip-outline-border{border-color:var(--color-tooltip-outline-border)}.border-transparent{border-color:#0000}.border-warning-400{border-color:var(--color-warning-400)}.bg-\[\#4DAFFF\]{background-color:#4dafff}.bg-\[\#F0F2F4\]{background-color:#f0f2f4}.bg-\[\#F7F8F9\]{background-color:#f7f8f9}.bg-\[\#FF3F40\]{background-color:#ff3f40}.bg-\[\#FFF0F0\]{background-color:#fff0f0}.bg-alert-bg{background-color:var(--color-alert-bg)}.bg-alert-danger-bg{background-color:var(--color-alert-danger-bg)}.bg-alert-info-bg{background-color:var(--color-alert-info-bg)}.bg-alert-success-bg{background-color:var(--color-alert-success-bg)}.bg-alert-warning-bg{background-color:var(--color-alert-warning-bg)}.bg-background{background-color:var(--color-background)}.bg-badge-destructive-bg{background-color:var(--color-badge-destructive-bg)}.bg-badge-primary-bg{background-color:var(--color-badge-primary-bg)}.bg-badge-secondary-bg{background-color:var(--color-badge-secondary-bg)}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.bg-border-secondary{background-color:var(--color-border-secondary)}.bg-button-danger{background-color:var(--color-button-danger)}.bg-button-ghost-bg{background-color:var(--color-button-ghost-bg)}.bg-button-outline-bg{background-color:var(--color-button-outline-bg)}.bg-button-primary-bg{background-color:var(--color-button-primary-bg)}.bg-button-primary-bg--disabled{background-color:var(--color-button-primary-bg--disabled)}.bg-button-secondary-bg{background-color:var(--color-button-secondary-bg)}.bg-button-secondary-bg--disabled{background-color:var(--color-button-secondary-bg--disabled)}.bg-dialog-bg,.bg-dialog-bg\/85{background-color:var(--color-dialog-bg)}@supports (color:color-mix(in lab, red, red)){.bg-dialog-bg\/85{background-color:color-mix(in oklab, var(--color-dialog-bg) 85%, transparent)}}.bg-drawer-bg{background-color:var(--color-drawer-bg)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-input-bg{background-color:var(--color-input-bg)}.bg-input-bg--hover{background-color:var(--color-input-bg--hover)}.bg-input-bg--selected{background-color:var(--color-input-bg--selected)}.bg-input-border{background-color:var(--color-input-border)}.bg-input-otp-caret{background-color:var(--color-input-otp-caret)}.bg-input-primitive-border{background-color:var(--color-input-primitive-border)}.bg-kbd-bg{background-color:var(--color-kbd-bg)}.bg-level-one{background-color:var(--color-level-one)}.bg-level-three{background-color:var(--color-level-three)}.bg-level-two{background-color:var(--color-level-two)}.bg-overlay{background-color:var(--color-overlay)}.bg-popover-bg{background-color:var(--color-popover-bg)}.bg-radio-bg{background-color:var(--color-radio-bg)}.bg-radio-bg--selected{background-color:var(--color-radio-bg--selected)}.bg-slider-range{background-color:var(--color-slider-range)}.bg-slider-thumb-bg{background-color:var(--color-slider-thumb-bg)}.bg-slider-track{background-color:var(--color-slider-track)}.bg-switch-thumb--checked{background-color:var(--color-switch-thumb--checked)}.bg-tabs-enclosed-indicator{background-color:var(--color-tabs-enclosed-indicator)}.bg-tabs-group-bg{background-color:var(--color-tabs-group-bg)}.bg-toast-bg{background-color:var(--color-toast-bg)}.bg-toast-danger-bg{background-color:var(--color-toast-danger-bg)}.bg-toast-info-bg{background-color:var(--color-toast-info-bg)}.bg-toast-success-bg{background-color:var(--color-toast-success-bg)}.bg-toast-warning-bg{background-color:var(--color-toast-warning-bg)}.bg-toggle-bg{background-color:var(--color-toggle-bg)}.bg-tooltip-arrow{background-color:var(--color-tooltip-arrow)}.bg-tooltip-bg{background-color:var(--color-tooltip-bg)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.fill-tooltip-arrow{fill:var(--color-tooltip-arrow)}.object-cover{object-fit:cover}.p-0{padding:calc(var(--spacing) * 0)}.p-0\!{padding:calc(var(--spacing) * 0)!important}.p-1{padding:calc(var(--spacing) * 1)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pt-0{padding-top:calc(var(--spacing) * 0)}.pt-1{padding-top:calc(var(--spacing) * 1)}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-3\!{padding-top:calc(var(--spacing) * 3)!important}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-1{padding-right:calc(var(--spacing) * 1)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pr-10{padding-right:calc(var(--spacing) * 10)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-0{padding-bottom:calc(var(--spacing) * 0)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-5{padding-left:calc(var(--spacing) * 5)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-7{padding-left:calc(var(--spacing) * 7)}.pl-9{padding-left:calc(var(--spacing) * 9)}.text-center{text-align:center}.text-left{text-align:left}.text-start{text-align:start}.\[text-indent\:var\(--prefix-width\)\]{text-indent:var(--prefix-width)}.font-mono\!{font-family:var(--font-mono)!important}.font-sans\!{font-family:var(--font-sans)!important}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-base\!{font-size:var(--text-base)!important;line-height:var(--tw-leading,var(--text-base--line-height))!important}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\!{font-size:var(--text-sm)!important;line-height:var(--tw-leading,var(--text-sm--line-height))!important}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-xs\!{font-size:var(--text-xs)!important;line-height:var(--tw-leading,var(--text-xs--line-height))!important}.text-\[11px\]{font-size:11px}.text-\[15px\]{font-size:15px}.text-\[17px\]{font-size:17px}.text-\[19px\]{font-size:19px}.text-\[22px\]{font-size:22px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-\[24px\]{--tw-leading:24px;line-height:24px}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-tighter{--tw-tracking:var(--tracking-tighter);letter-spacing:var(--tracking-tighter)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.whitespace-nowrap{white-space:nowrap}.text-\[\#222222\]{color:#222}.text-\[\#999999\]{color:#999}.text-\[\#FF3F40\]{color:#ff3f40}.text-\[\#FFFFFF\]{color:#fff}.text-alert-danger-text{color:var(--color-alert-danger-text)}.text-alert-info-text{color:var(--color-alert-info-text)}.text-alert-success-text{color:var(--color-alert-success-text)}.text-alert-text{color:var(--color-alert-text)}.text-alert-warning-text{color:var(--color-alert-warning-text)}.text-badge-secondary-text{color:var(--color-badge-secondary-text)}.text-button-danger{color:var(--color-button-danger)}.text-button-ghost-text{color:var(--color-button-ghost-text)}.text-button-ghost-text--disabled{color:var(--color-button-ghost-text--disabled)}.text-button-outline-text{color:var(--color-button-outline-text)}.text-button-outline-text--disabled{color:var(--color-button-outline-text--disabled)}.text-button-primary-text{color:var(--color-button-primary-text)}.text-button-primary-text--disabled{color:var(--color-button-primary-text--disabled)}.text-button-secondary-text{color:var(--color-button-secondary-text)}.text-button-secondary-text--disabled{color:var(--color-button-secondary-text--disabled)}.text-checkbox-indicator--checked{color:var(--color-checkbox-indicator--checked)}.text-current{color:currentColor}.text-danger-400{color:var(--color-danger-400)}.text-danger-400\!{color:var(--color-danger-400)!important}.text-data-card-description{color:var(--color-data-card-description)}.text-gray-500{color:var(--color-gray-500)}.text-inherit{color:inherit}.text-input-text{color:var(--color-input-text)}.text-input-text\!{color:var(--color-input-text)!important}.text-input-text--disabled{color:var(--color-input-text--disabled)}.text-input-text-placeholder{color:var(--color-input-text-placeholder)}.text-input-text-prefix{color:var(--color-input-text-prefix)}.text-kbd-text{color:var(--color-kbd-text)}.text-neutral-200\!{color:var(--color-neutral-200)!important}.text-neutral-400{color:var(--color-neutral-400)}.text-neutral-400\!{color:var(--color-neutral-400)!important}.text-popover-text{color:var(--color-popover-text)}.text-success-400{color:var(--color-success-400)}.text-text-primary{color:var(--color-text-primary)}.text-text-primary\!{color:var(--color-text-primary)!important}.text-text-secondary{color:var(--color-text-secondary)}.text-text-secondary\!{color:var(--color-text-secondary)!important}.text-toast-danger-icon{color:var(--color-toast-danger-icon)}.text-toast-danger-text{color:var(--color-toast-danger-text)}.text-toast-info-icon{color:var(--color-toast-info-icon)}.text-toast-info-text{color:var(--color-toast-info-text)}.text-toast-success-icon{color:var(--color-toast-success-icon)}.text-toast-success-text{color:var(--color-toast-success-text)}.text-toast-text{color:var(--color-toast-text)}.text-toast-warning-icon{color:var(--color-toast-warning-icon)}.text-toast-warning-text{color:var(--color-toast-warning-text)}.text-toggle-text{color:var(--color-toggle-text)}.text-warning-400{color:var(--color-warning-400)}.text-warning-400\!{color:var(--color-warning-400)!important}.uppercase{text-transform:uppercase}.font-stretch-condensed{font-stretch:75%}.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,)}.no-underline\!{text-decoration-line:none!important}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.opacity-100{opacity:1}.shadow-2xs{--tw-shadow:0 1px 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)}.shadow-\[-20px_0_20px_var\(--color-black-40\)\]{--tw-shadow:-20px 0 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_-20px_20px_var\(--color-black-40\)\]{--tw-shadow:0 -20px 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_20px_20px_var\(--color-black-40\)\]{--tw-shadow:0 20px 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[4px_0_10px_rgb\(0_0_0_\/_0\.18\)\]{--tw-shadow:4px 0 10px 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)}.shadow-\[20px_0_20px_var\(--color-black-40\)\]{--tw-shadow:20px 0 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.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)}.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)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none\!{--tw-shadow:0 0 #0000!important;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)!important}.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)}.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)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + 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)}.ring-0\!{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor)!important;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)!important}.ring-black{--tw-ring-color:var(--color-black)}.ring-slider-thumb-ring\/50{--tw-ring-color:var(--color-slider-thumb-ring)}@supports (color:color-mix(in lab, red, red)){.ring-slider-thumb-ring\/50{--tw-ring-color:color-mix(in oklab, var(--color-slider-thumb-ring) 50%, transparent)}}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-0{outline-style:var(--tw-outline-style);outline-width:0}.outline-transparent{outline-color:#0000}.blur{--tw-blur:blur(8px);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,)}.blur-\[2px\]{--tw-blur:blur(2px);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,)}.grayscale{--tw-grayscale:grayscale(100%);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,)}.filter{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,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--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,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,box-shadow\]{transition-property:background-color,color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,transform\]{transition-property:background-color,color,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\,opacity\,transform\]{transition-property:filter,opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,transform\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[transform\,opacity\,clip-path\]{transition-property:transform,opacity,clip-path;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.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(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}.select-none{-webkit-user-select:none;user-select:none}.\[clip-path\:inset\(0_0_0_0\)\]{clip-path:inset(0)}.\[clip-path\:inset\(0_100\%_0_0\)\]{clip-path:inset(0 100% 0 0)}.duration-150{animation-duration:.15s}.duration-200{animation-duration:.2s}.ease-in{animation-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{animation-timing-function:cubic-bezier(0,0,.2,1)}:is(.\*\:box-border>*),:is(.\*\*\:box-border *){box-sizing:border-box}.not-last\:border-b:not(:last-child){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.group-active\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group):active *),.group-aria-pressed\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group)[aria-pressed=true] *),.group-data-\[state\=on\]\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group)[data-state=on] *){background-color:var(--color-toggle-border--active)}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:text-neutral-400:is(:where(.peer):disabled~*){color:var(--color-neutral-400)}.peer-disabled\:opacity-50:is(:where(.peer):disabled~*){opacity:.5}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.peer-data-\[state\=checked\]\:invisible:is(:where(.peer)[data-state=checked]~*){visibility:hidden}.peer-data-\[state\=checked\]\:-translate-x-full:is(:where(.peer)[data-state=checked]~*){--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.peer-data-\[state\=checked\]\:text-background:is(:where(.peer)[data-state=checked]~*){color:var(--color-background)}.peer-data-\[state\=on\]\/spectral-split-menu\:border-toggle-border--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){border-color:var(--color-toggle-border--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:bg-toggle-bg--active:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){background-color:var(--color-toggle-bg--active)}.peer-data-\[state\=on\]\/spectral-split-menu\:text-toggle-text--active:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){color:var(--color-toggle-text--active)}.peer-data-\[state\=unchecked\]\:invisible:is(:where(.peer)[data-state=unchecked]~*){visibility:hidden}.peer-data-\[state\=unchecked\]\:translate-x-6:is(:where(.peer)[data-state=unchecked]~*){--tw-translate-x:calc(var(--spacing) * 6);translate:var(--tw-translate-x) var(--tw-translate-y)}.placeholder\:text-input-text\!::placeholder{color:var(--color-input-text)!important}.placeholder\:text-input-text-placeholder::placeholder{color:var(--color-input-text-placeholder)}.placeholder\:text-input-text-placeholder\!::placeholder{color:var(--color-input-text-placeholder)!important}.placeholder\:opacity-100::placeholder{opacity:1}.before\:pointer-events-none:before{content:var(--tw-content);pointer-events:none}.before\:absolute:before{content:var(--tw-content);position:absolute}.before\:inset-y-2:before{content:var(--tw-content);inset-block:calc(var(--spacing) * 2)}.before\:left-0:before{content:var(--tw-content);left:calc(var(--spacing) * 0)}.before\:w-px:before{content:var(--tw-content);width:1px}.before\:bg-border-secondary\/6:before{content:var(--tw-content);background-color:var(--color-border-secondary)}@supports (color:color-mix(in lab, red, red)){.before\:bg-border-secondary\/6:before{background-color:color-mix(in oklab, var(--color-border-secondary) 6%, transparent)}}.before\:content-none:before{content:var(--tw-content);--tw-content:none;content:none}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:inset-0:after{content:var(--tw-content);inset:calc(var(--spacing) * 0)}.after\:top-0:after{content:var(--tw-content);top:calc(var(--spacing) * 0)}.after\:right-0:after{content:var(--tw-content);right:calc(var(--spacing) * 0)}.after\:bottom-0:after{content:var(--tw-content);bottom:calc(var(--spacing) * 0)}.after\:left-0:after{content:var(--tw-content);left:calc(var(--spacing) * 0)}.after\:m-auto:after{content:var(--tw-content);margin:auto}.after\:h-2\.5:after{content:var(--tw-content);height:calc(var(--spacing) * 2.5)}.after\:h-full:after{content:var(--tw-content);height:100%}.after\:w-1:after{content:var(--tw-content);width:calc(var(--spacing) * 1)}.after\:w-2\.5:after{content:var(--tw-content);width:calc(var(--spacing) * 2.5)}.after\:w-full:after{content:var(--tw-content);width:100%}.after\:rounded-full:after{content:var(--tw-content);border-radius:3.40282e38px}.after\:rounded-t-\[0\.3rem\]:after{content:var(--tw-content);border-top-left-radius:.3rem;border-top-right-radius:.3rem}.after\:rounded-l-\[0\.3rem\]:after{content:var(--tw-content);border-top-left-radius:.3rem;border-bottom-left-radius:.3rem}.after\:border-r-\[0\.3rem\]:after{content:var(--tw-content);border-right-style:var(--tw-border-style);border-right-width:.3rem}.after\:border-b-\[0\.3rem\]:after{content:var(--tw-content);border-bottom-style:var(--tw-border-style);border-bottom-width:.3rem}.after\:border-tabs-indicator:after{content:var(--tw-content);border-color:var(--color-tabs-indicator)}.after\:bg-radio-bg--selected:after{content:var(--tw-content);background-color:var(--color-radio-bg--selected)}.after\:content-\[\'\'\]:after{--tw-content:"";content:var(--tw-content)}.after\:content-none:after{content:var(--tw-content);--tw-content:none;content:none}.first\:mt-0:first-child{margin-top:calc(var(--spacing) * 0)}.first\:rounded-s-md:first-child{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md)}.first\:rounded-ss-md:first-child{border-start-start-radius:var(--radius-md)}.first\:rounded-se-md:first-child{border-start-end-radius:var(--radius-md)}.last\:me-0:last-child{margin-inline-end:calc(var(--spacing) * 0)}.last\:mbe-0:last-child{margin-block-end:calc(var(--spacing) * 0)}.last\:mb-0:last-child{margin-bottom:calc(var(--spacing) * 0)}.last\:rounded-e-md:last-child{border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md)}.last\:rounded-ee-md:last-child{border-end-end-radius:var(--radius-md)}.last\:rounded-es-md:last-child{border-end-start-radius:var(--radius-md)}.focus-within\:z-10:focus-within{z-index:10}.focus-within\:outline-none:focus-within{--tw-outline-style:none;outline-style:none}@media (hover:hover){.hover\:z-10:hover{z-index:10}.hover\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:cursor-pointer:hover{cursor:pointer}.hover\:border-button-danger--hover:hover{border-color:var(--color-button-danger--hover)}.hover\:border-button-primary-border--hover:hover{border-color:var(--color-button-primary-border--hover)}.hover\:border-danger-500:hover{border-color:var(--color-danger-500)}.hover\:border-input-border--hover:hover{border-color:var(--color-input-border--hover)}.hover\:border-radio-border--hover:hover{border-color:var(--color-radio-border--hover)}.hover\:border-toggle-border--hover:hover{border-color:var(--color-toggle-border--hover)}.hover\:border-toggle-outline-border--hover:hover{border-color:var(--color-toggle-outline-border--hover)}.hover\:border-warning-400:hover{border-color:var(--color-warning-400)}.hover\:bg-button-danger--hover:hover{background-color:var(--color-button-danger--hover)}.hover\:bg-button-ghost-bg--hover:hover{background-color:var(--color-button-ghost-bg--hover)}.hover\:bg-button-outline-bg--hover:hover{background-color:var(--color-button-outline-bg--hover)}.hover\:bg-button-primary-bg--hover:hover{background-color:var(--color-button-primary-bg--hover)}.hover\:bg-button-secondary-bg--hover:hover{background-color:var(--color-button-secondary-bg--hover)}.hover\:bg-input-bg--hover:hover{background-color:var(--color-input-bg--hover)}.hover\:bg-level-four:hover{background-color:var(--color-level-four)}.hover\:bg-level-three:hover{background-color:var(--color-level-three)}.hover\:bg-level-two:hover{background-color:var(--color-level-two)}.hover\:bg-toggle-bg--hover:hover{background-color:var(--color-toggle-bg--hover)}.hover\:bg-transparent:hover{background-color:#0000}.hover\:text-accent:hover{color:var(--color-accent)}.hover\:text-button-danger\/80:hover{color:var(--color-button-danger)}@supports (color:color-mix(in lab, red, red)){.hover\:text-button-danger\/80:hover{color:color-mix(in oklab, var(--color-button-danger) 80%, transparent)}}.hover\:text-button-ghost-text--hover:hover{color:var(--color-button-ghost-text--hover)}.hover\:text-button-outline-text--hover:hover{color:var(--color-button-outline-text--hover)}.hover\:text-button-primary-text--hover:hover{color:var(--color-button-primary-text--hover)}.hover\:text-button-secondary-text--hover:hover{color:var(--color-button-secondary-text--hover)}.hover\:text-neutral-100:hover{color:var(--color-neutral-100)}.hover\:text-text-primary:hover{color:var(--color-text-primary)}.hover\:text-text-secondary:hover{color:var(--color-text-secondary)}.hover\:text-toggle-text--hover:hover{color:var(--color-toggle-text--hover)}.hover\:no-underline:hover{text-decoration-line:none}.hover\:opacity-80:hover{opacity:.8}.hover\:opacity-100:hover{opacity:1}.hover\:opacity-100\!:hover{opacity:1!important}.hover\:ring-4:hover{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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)}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:border-toggle-border--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{border-color:var(--color-toggle-border--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:bg-toggle-bg--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{background-color:var(--color-toggle-bg--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:text-toggle-text--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{color:var(--color-toggle-text--active)!important}}.focus\:z-10:focus{z-index:10}.focus\:scale-95:focus{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.focus\:border-danger-400:focus{border-color:var(--color-danger-400)}.focus\:border-input-border--focus:focus{border-color:var(--color-input-border--focus)}.focus\:border-warning-400:focus{border-color:var(--color-warning-400)}.focus\:text-text-primary:focus{color:var(--color-text-primary)}.focus\:ring-1:focus{--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)}.focus\:ring-accent:focus{--tw-ring-color:var(--color-accent)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:z-10:focus-visible{z-index:10}.focus-visible\:border-accent:focus-visible{border-color:var(--color-accent)}.focus-visible\:border-input-border--focus:focus-visible{border-color:var(--color-input-border--focus)}.focus-visible\:bg-input-bg--hover:focus-visible{background-color:var(--color-input-bg--hover)}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:ring-0:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + 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)}.focus-visible\:ring-1:focus-visible{--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)}.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)}.focus-visible\:ring-4:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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)}.focus-visible\:ring-accent:focus-visible{--tw-ring-color:var(--color-accent)}.focus-visible\:ring-black:focus-visible{--tw-ring-color:var(--color-black)}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.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)}.focus-visible\:ring-offset-background:focus-visible{--tw-ring-offset-color:var(--color-background)}.focus-visible\:outline:focus-visible,.focus-visible\:outline-1:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-offset-1:focus-visible{outline-offset:1px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-accent:focus-visible{outline-color:var(--color-accent)}.focus-visible\:outline-badge-destructive-border:focus-visible{outline-color:var(--color-badge-destructive-border)}.focus-visible\:outline-button-danger:focus-visible{outline-color:var(--color-button-danger)}.focus-visible\:outline-button-outline-border:focus-visible{outline-color:var(--color-button-outline-border)}.focus-visible\:outline-button-primary-border:focus-visible{outline-color:var(--color-button-primary-border)}.focus-visible\:outline-button-secondary-border:focus-visible{outline-color:var(--color-button-secondary-border)}.focus-visible\:outline-checkbox-border--focus:focus-visible{outline-color:var(--color-checkbox-border--focus)}.focus-visible\:outline-danger-400:focus-visible{outline-color:var(--color-danger-400)}.focus-visible\:outline-input-border--focus:focus-visible{outline-color:var(--color-input-border--focus)}.focus-visible\:outline-level-three:focus-visible{outline-color:var(--color-level-three)}.focus-visible\:outline-text-secondary:focus-visible{outline-color:var(--color-text-secondary)}.focus-visible\:outline-warning-400:focus-visible{outline-color:var(--color-warning-400)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-100:active{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-\[0\.97\]:active{scale:.97}.active\:border-toggle-border--active:active{border-color:var(--color-toggle-border--active)}.active\:bg-accent:active{background-color:var(--color-accent)}.active\:bg-toggle-bg--active:active{background-color:var(--color-toggle-bg--active)}.active\:text-text-inverted:active{color:var(--color-text-inverted)}.active\:text-toggle-text--active:active{color:var(--color-toggle-text--active)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:border-button-outline-border--disabled:disabled{border-color:var(--color-button-outline-border--disabled)}.disabled\:border-button-primary-border--disabled:disabled{border-color:var(--color-button-primary-border--disabled)}.disabled\:border-button-secondary-border--disabled:disabled{border-color:var(--color-button-secondary-border--disabled)}.disabled\:border-input-border--disabled:disabled{border-color:var(--color-input-border--disabled)}.disabled\:bg-button-primary-bg--disabled:disabled{background-color:var(--color-button-primary-bg--disabled)}.disabled\:bg-button-secondary-bg--disabled:disabled{background-color:var(--color-button-secondary-bg--disabled)}.disabled\:bg-input-bg--disabled:disabled{background-color:var(--color-input-bg--disabled)}.disabled\:text-button-ghost-text--disabled:disabled{color:var(--color-button-ghost-text--disabled)}.disabled\:text-button-outline-text--disabled:disabled{color:var(--color-button-outline-text--disabled)}.disabled\:text-button-primary-text--disabled:disabled{color:var(--color-button-primary-text--disabled)}.disabled\:text-button-secondary-text--disabled:disabled{color:var(--color-button-secondary-text--disabled)}.disabled\:text-input-text--disabled:disabled{color:var(--color-input-text--disabled)}.disabled\:text-text-secondary:disabled{color:var(--color-text-secondary)}.disabled\:opacity-50:disabled{opacity:.5}@media (hover:hover){.disabled\:hover\:bg-level-one:disabled:hover{background-color:var(--color-level-one)}.disabled\:hover\:bg-transparent:disabled:hover{background-color:#0000}.disabled\:hover\:text-text-primary:disabled:hover{color:var(--color-text-primary)}}.disabled\:active\:scale-100:disabled:active{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}:where([data-orientation=horizontal]) .in-data-\[orientation\=horizontal\]\:p-4{padding:calc(var(--spacing) * 4)}:where([data-slot=tooltip-content]) .in-data-\[slot\=tooltip-content\]\:bg-level-three{background-color:var(--color-level-three)}.has-\[\[data-slot\=dialog-footer\]\]\:pb-0:has([data-slot=dialog-footer]){padding-bottom:calc(var(--spacing) * 0)}.has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:outline-0:has([data-slot=input-group-control]:focus-visible){outline-style:var(--tw-outline-style);outline-width:0}.has-\[disabled\]\:opacity-50:has(:is(disabled)){opacity:.5}.has-\[\>\[data-slot\=button-group\]\]\:gap-2:has(>[data-slot=button-group]){gap:calc(var(--spacing) * 2)}.has-\[\>svg\]\:px-2\.5:has(>svg){padding-inline:calc(var(--spacing) * 2.5)}.has-\[\>svg\]\:px-3:has(>svg){padding-inline:calc(var(--spacing) * 3)}.has-\[\>svg\]\:px-4:has(>svg){padding-inline:calc(var(--spacing) * 4)}.aria-invalid\:border-danger-200[aria-invalid=true]{border-color:var(--color-danger-200)}.aria-invalid\:outline-danger-200\/20[aria-invalid=true]{outline-color:var(--color-danger-200)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:outline-danger-200\/20[aria-invalid=true]{outline-color:color-mix(in oklab, var(--color-danger-200) 20%, transparent)}}.aria-pressed\:border-toggle-border--active[aria-pressed=true]{border-color:var(--color-toggle-border--active)}.aria-pressed\:bg-toggle-bg--active[aria-pressed=true]{background-color:var(--color-toggle-bg--active)}.aria-pressed\:text-toggle-text--active[aria-pressed=true]{color:var(--color-toggle-text--active)}.data-disabled\:opacity-50[data-disabled]{opacity:.5}.data-highlighted\:bg-input-bg--hover[data-highlighted]{background-color:var(--color-input-bg--hover)}.data-placeholder\:text-input-text-placeholder\![data-placeholder]{color:var(--color-input-text-placeholder)!important}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:cursor-not-allowed[data-disabled]{cursor:not-allowed}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[expanded\=true\]\:w-full[data-expanded=true],.data-\[layout\=\'expanded\'\]\:w-full[data-layout=expanded]{width:100%}.data-\[orientation\=horizontal\]\:h-1\.5[data-orientation=horizontal]{height:calc(var(--spacing) * 1.5)}.data-\[orientation\=horizontal\]\:h-full[data-orientation=horizontal]{height:100%}.data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.data-\[orientation\=vertical\]\:flex[data-orientation=vertical]{display:flex}.data-\[orientation\=vertical\]\:h-auto[data-orientation=vertical]{height:auto}.data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.data-\[orientation\=vertical\]\:min-h-44[data-orientation=vertical]{min-height:calc(var(--spacing) * 44)}.data-\[orientation\=vertical\]\:w-1\.5[data-orientation=vertical]{width:calc(var(--spacing) * 1.5)}.data-\[orientation\=vertical\]\:w-auto[data-orientation=vertical]{width:auto}.data-\[orientation\=vertical\]\:w-full[data-orientation=vertical]{width:100%}.data-\[orientation\=vertical\]\:flex-col[data-orientation=vertical]{flex-direction:column}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:calc(var(--spacing) * 1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[size\=lg\]\:min-w-7[data-size=lg]{min-width:calc(var(--spacing) * 7)}.data-\[size\=lg\]\:px-1\.5[data-size=lg]{padding-inline:calc(var(--spacing) * 1.5)}.data-\[size\=sm\]\:min-w-5[data-size=sm]{min-width:calc(var(--spacing) * 5)}.data-\[size\=sm\]\:px-0\.5[data-size=sm]{padding-inline:calc(var(--spacing) * .5)}.data-\[state\=active\]\:text-accent[data-state=active]{color:var(--color-accent)}.data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:translate-x-\[26px\][data-state=checked]{--tw-translate-x:26px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-checkbox-border--checked[data-state=checked]{border-color:var(--color-checkbox-border--checked)}.data-\[state\=checked\]\:border-radio-border--selected[data-state=checked]{border-color:var(--color-radio-border--selected)}.data-\[state\=checked\]\:bg-radio-bg[data-state=checked]{background-color:var(--color-radio-bg)}.data-\[state\=checked\]\:bg-switch-bg--checked[data-state=checked]{background-color:var(--color-switch-bg--checked)}.data-\[state\=checked\]\:bg-switch-thumb[data-state=checked]{background-color:var(--color-switch-thumb)}.data-\[state\=on\]\:border-toggle-border--active[data-state=on]{border-color:var(--color-toggle-border--active)}.data-\[state\=on\]\:bg-toggle-bg--active[data-state=on]{background-color:var(--color-toggle-bg--active)}.data-\[state\=on\]\:text-toggle-text--active[data-state=on]{color:var(--color-toggle-text--active)}.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:var(--color-accent)}.data-\[state\=open\]\:text-text-primary[data-state=open]{color:var(--color-text-primary)}.data-\[state\=unchecked\]\:bg-switch-bg[data-state=unchecked],.data-\[state\=unchecked\]\:bg-switch-bg\/50[data-state=unchecked]{background-color:var(--color-switch-bg)}@supports (color:color-mix(in lab, red, red)){.data-\[state\=unchecked\]\:bg-switch-bg\/50[data-state=unchecked]{background-color:color-mix(in oklab, var(--color-switch-bg) 50%, transparent)}}.data-\[variant\=\'outline\'\]\:gap-0[data-variant=outline]{gap:calc(var(--spacing) * 0)}.data-\[variant\=\'outline\'\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=outline]{--color-toggle-border:var(--color-toggle-outline-border)}.data-\[variant\=\'separated\'\]\:gap-1\.5[data-variant=separated]{gap:calc(var(--spacing) * 1.5)}.data-\[size\=\'lg\'\]\:data-\[variant\=\'separated\'\]\:gap-2[data-size=lg][data-variant=separated]{gap:calc(var(--spacing) * 2)}.data-\[size\=\'sm\'\]\:data-\[variant\=\'separated\'\]\:gap-1[data-size=sm][data-variant=separated]{gap:calc(var(--spacing) * 1)}.data-\[variant\=outline\]\:gap-0[data-variant=outline]{gap:calc(var(--spacing) * 0)}.data-\[variant\=outline\]\:border-toggle-border[data-variant=outline]{border-color:var(--color-toggle-border)}.data-\[variant\=outline\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=outline]{--color-toggle-border:var(--color-toggle-outline-border)}@media (hover:hover){.data-\[variant\=outline\]\:hover\:border-toggle-border[data-variant=outline]:hover{border-color:var(--color-toggle-border)}}.data-\[variant\=outline\]\:data-\[state\=on\]\:border-toggle-border--active[data-variant=outline][data-state=on]{border-color:var(--color-toggle-border--active)}@media (hover:hover){.data-\[variant\=outline\]\:data-\[state\=on\]\:hover\:border-toggle-border--active[data-variant=outline][data-state=on]:hover{border-color:var(--color-toggle-border--active)}}.data-\[variant\=separated\]\:rounded-md[data-variant=separated]{border-radius:var(--radius-md)}.data-\[variant\=separated\]\:border-toggle-border[data-variant=separated]{border-color:var(--color-toggle-border)}@media (hover:hover){.data-\[variant\=separated\]\:hover\:border-toggle-border--hover[data-variant=separated]:hover{border-color:var(--color-toggle-border--hover)}}.data-\[variant\=separated\]\:data-\[state\=on\]\:border-toggle-border--active[data-variant=separated][data-state=on]{border-color:var(--color-toggle-border--active)}.data-\[variant\=separated\]\:data-\[state\=on\]\:bg-toggle-bg--active[data-variant=separated][data-state=on]{background-color:var(--color-toggle-bg--active)}@media (hover:hover){.data-\[variant\=separated\]\:data-\[state\=on\]\:hover\:border-toggle-border--active[data-variant=separated][data-state=on]:hover{border-color:var(--color-toggle-border--active)}.data-\[variant\=separated\]\:data-\[state\=on\]\:hover\:bg-toggle-bg--active[data-variant=separated][data-state=on]:hover{background-color:var(--color-toggle-bg--active)}}@media (prefers-reduced-motion:no-preference){.motion-safe\:animate-caret-blink{animation:var(--animate-caret-blink)}.motion-safe\:animate-pulse{animation:var(--animate-pulse)}.motion-safe\:animate-spin{animation:var(--animate-spin)}.motion-safe\:duration-200{--tw-duration:.2s;transition-duration:.2s}.motion-safe\:animate-in{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:duration-200{animation-duration:.2s}.motion-safe\:fade-in{--tw-enter-opacity:0}.motion-safe\:slide-in-from-top-full{--tw-enter-translate-y:-100%}.motion-safe\:data-closed\:animate-out[data-closed]{--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial;animation-name:exit;animation-duration:.15s}.motion-safe\:data-closed\:fade-out-0[data-closed]{--tw-exit-opacity:0}.motion-safe\:data-closed\:zoom-out-95[data-closed]{--tw-exit-scale:.95}.motion-safe\:data-open\:animate-in[data-open]{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:data-open\:fade-in-0[data-open]{--tw-enter-opacity:0}.motion-safe\:data-open\:zoom-in-95[data-open]{--tw-enter-scale:.95}.motion-safe\:data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-.5rem}.motion-safe\:data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:.5rem}.motion-safe\:data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:-.5rem}.motion-safe\:data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:.5rem}.motion-safe\:data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:var(--animate-accordion-up)}.motion-safe\:data-\[state\=closed\]\:animate-out[data-state=closed]{--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial;animation-name:exit;animation-duration:.15s}.motion-safe\:data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.motion-safe\:data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.motion-safe\:data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:var(--animate-accordion-down)}.motion-safe\:data-\[state\=open\]\:duration-200[data-state=open]{--tw-duration:.2s;transition-duration:.2s}.motion-safe\:data-\[state\=open\]\:animate-in[data-state=open]{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:data-\[state\=open\]\:duration-200[data-state=open]{animation-duration:.2s}.motion-safe\:data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.motion-safe\:data-\[state\=open\]\:slide-in-from-bottom-20[data-state=open]{--tw-enter-translate-y:5rem}.motion-safe\:data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.motion-safe\:data-\[state\=open\]\:zoom-in-100\![data-state=open]{--tw-enter-scale:1!important}}@media (prefers-reduced-motion:reduce){.motion-reduce\:translate-x-0{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.motion-reduce\:transition-none{transition-property:none}.motion-reduce\:duration-0{--tw-duration:0s;transition-duration:0s;animation-duration:0s}}@media (min-width:40rem){.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:text-left{text-align:left}@media not all and (min-width:48rem){.sm\:max-md\:max-w-full{max-width:100%}}}@media (min-width:48rem){.md\:font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.md\:font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}}.peer-data-\[state\=checked\]\:rtl\:translate-x-full:is(:where(.peer)[data-state=checked]~*):where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.peer-data-\[state\=unchecked\]\:rtl\:-translate-x-6:is(:where(.peer)[data-state=unchecked]~*):where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:calc(var(--spacing) * -6);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:rtl\:-translate-x-4[data-state=checked]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:calc(var(--spacing) * -4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:rtl\:translate-x-\[-26px\][data-state=checked]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:-26px;translate:var(--tw-translate-x) var(--tw-translate-y)}.\[\&_\*\]\:min-w-0 *{min-width:calc(var(--spacing) * 0)}.\[\&_button\:first-of-type\]\:rounded-l-md button:first-of-type{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.\[\&_button\:last-of-type\]\:rounded-r-md button:last-of-type{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.data-\[variant\=\'outline\'\]\:\[\&_button\:not\(\:first-of-type\)\]\:border-l-0[data-variant=outline] button:not(:first-of-type){border-left-style:var(--tw-border-style);border-left-width:0}.data-\[variant\=\'outline\'\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=outline] button:not(:last-of-type),.data-\[variant\=outline\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=outline] button:not(:last-of-type){border-right-color:var(--color-toggle-outline-divider)}.data-\[variant\=\'outline\'\]\:\[\&_button\[data-state\=\'on\'\]\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-border--active\)\][data-variant=outline] button[data-state=on]:not(:last-of-type){border-right-color:var(--color-toggle-border--active)}.\[\&_p\]\:leading-relaxed p{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.\[\&_p\]\:text-alert-danger-text p{color:var(--color-alert-danger-text)}.\[\&_p\]\:text-alert-info-text p{color:var(--color-alert-info-text)}.\[\&_p\]\:text-alert-success-text p{color:var(--color-alert-success-text)}.\[\&_p\]\:text-alert-text p{color:var(--color-alert-text)}.\[\&_p\]\:text-alert-warning-text p{color:var(--color-alert-warning-text)}.\[\&_span\]\:rounded-\[4px\] span{border-radius:4px}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3 svg:not([class*=size-]){width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-3 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-4 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-5 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&\:\:-webkit-inner-spin-button\]\:appearance-none::-webkit-inner-spin-button{appearance:none}.\[\&\:\:-webkit-outer-spin-button\]\:appearance-none::-webkit-outer-spin-button{appearance:none}.\[\&\:not\(\:first-child\)\]\:border-l-0:not(:first-child){border-left-style:var(--tw-border-style);border-left-width:0}.\[\&\>\*\]\:min-w-0>*{min-width:calc(var(--spacing) * 0)}.\[\&\>\*\]\:focus-visible\:relative>:focus-visible{position:relative}.\[\&\>\*\]\:focus-visible\:z-10>:focus-visible{z-index:10}.\[\&\>\*\:last-child\]\:-ms-0\.5>:last-child{margin-inline-start:calc(var(--spacing) * -.5)}.\[\&\>\*\:last-child\]\:-mt-0\.5>:last-child{margin-top:calc(var(--spacing) * -.5)}.\[\&\>\*\:not\(\:first-child\)\]\:rounded-t-none>:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.\[\&\>\*\:not\(\:first-child\)\]\:rounded-l-none>:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.\[\&\>\*\:not\(\:first-child\)\]\:border-t-0>:not(:first-child){border-top-style:var(--tw-border-style);border-top-width:0}.\[\&\>\*\:not\(\:first-child\)\]\:border-l-0>:not(:first-child){border-left-style:var(--tw-border-style);border-left-width:0}.\[\&\>\*\:not\(\:last-child\)\]\:rounded-r-none>:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.\[\&\>\*\:not\(\:last-child\)\]\:rounded-b-none>:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0}.has-\[select\[aria-hidden\=true\]\:last-child\]\:\[\&\>\[data-slot\=select-trigger\]\:last-of-type\]\:rounded-r-md:has(:is(select[aria-hidden=true]:last-child))>[data-slot=select-trigger]:last-of-type{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.\[\&\>\[data-slot\=select-trigger\]\:not\(\[class\*\=\'w-\'\]\)\]\:w-fit>[data-slot=select-trigger]:not([class*=w-]){width:fit-content}.\[\&\>input\]\:flex-1>input{flex:1}.\[\&\>span\]\:block>span{display:block}.\[\&\>span\]\:min-w-0>span{min-width:calc(var(--spacing) * 0)}.\[\&\>span\]\:overflow-hidden>span{overflow:hidden}.\[\&\>span\]\:text-ellipsis>span{text-overflow:ellipsis}.\[\&\>span\]\:whitespace-nowrap>span{white-space:nowrap}.\[\&\>span\[data-placeholder\]\]\:text-input-text-placeholder\!>span[data-placeholder]{color:var(--color-input-text-placeholder)!important}.\[\&\>svg\]\:pointer-events-none>svg{pointer-events:none}.\[\&\>svg\]\:size-3>svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&\>svg\]\:size-6>svg{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.\[\&\>svg\]\:shrink-0>svg{flex-shrink:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}@media (hover:hover){a.\[a\&\]\:hover\:bg-accent:hover{background-color:var(--color-accent)}a.\[a\&\]\:hover\:bg-badge-primary-bg--hover:hover{background-color:var(--color-badge-primary-bg--hover)}a.\[a\&\]\:hover\:bg-danger-400:hover{background-color:var(--color-danger-400)}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0) scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0) scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}@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-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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-tracking{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-outline-style{syntax:"*";inherits:false;initial-value:solid}@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}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}
3
+ @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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-outline-style:solid;--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;--tw-content:""}}}:root,:host{--font-sans:"Work Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji";--font-mono:"Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace;--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-500:oklch(55.1% .027 264.364);--color-neutral-100:oklch(97% 0 0);--color-neutral-200:oklch(92.2% 0 0);--color-neutral-400:oklch(70.8% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-2xs:18rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tighter:-.05em;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-relaxed:1.625;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-background:var(--horizon-color-neutral-950);--color-text-primary:var(--horizon-color-neutral-50);--color-text-inverted:var(--horizon-color-neutral-950);--color-text-secondary:var(--horizon-color-neutral-300);--color-text-disabled:var(--horizon-color-neutral-600);--color-border-secondary:var(--horizon-color-neutral-700);--color-accent:var(--horizon-color-accent);--color-overlay:var(--horizon-color-neutral-950)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-overlay:color-mix(in oklab, var(--horizon-color-neutral-950) 40%, transparent)}}:root,:host{--color-level-one:var(--horizon-color-level-one);--color-level-two:var(--horizon-color-level-two);--color-level-three:var(--horizon-color-level-three);--color-level-four:var(--horizon-color-level-four);--color-success-400:var(--horizon-color-success-400);--color-warning-400:var(--horizon-color-warning-400);--color-danger-200:var(--horizon-color-danger-200);--color-danger-400:var(--horizon-color-danger-400);--color-danger-500:var(--horizon-color-danger-500);--color-alert-bg:var(--horizon-color-level-two);--color-alert-border:var(--horizon-color-level-three);--color-alert-text:var(--horizon-color-neutral-50);--color-alert-success-bg:var(--horizon-color-success-50);--color-alert-success-border:var(--horizon-color-success-500);--color-alert-success-text:var(--horizon-color-success-500);--color-alert-warning-bg:var(--horizon-color-warning-50);--color-alert-warning-border:var(--horizon-color-warning-500);--color-alert-warning-text:var(--horizon-color-warning-500);--color-alert-danger-bg:var(--horizon-color-danger-50);--color-alert-danger-border:var(--horizon-color-danger-500);--color-alert-danger-text:var(--horizon-color-danger-500);--color-alert-info-bg:var(--horizon-color-primary-50);--color-alert-info-border:var(--horizon-color-primary-700);--color-alert-info-text:var(--horizon-color-primary-700);--color-badge-primary-bg:var(--horizon-color-level-five);--color-badge-primary-bg--hover:var(--horizon-color-level-four);--color-badge-secondary-bg:var(--horizon-color-accent);--color-badge-secondary-text:var(--horizon-color-neutral-950);--color-badge-outline-border:var(--horizon-color-level-five);--color-badge-destructive-bg:var(--horizon-color-danger-400);--color-badge-destructive-border:var(--horizon-color-danger-400);--color-button-primary-bg:var(--horizon-color-accent);--color-button-primary-bg--hover:var(--horizon-color-level-two);--color-button-primary-bg--disabled:var(--horizon-color-neutral-500);--color-button-primary-border:var(--horizon-color-accent);--color-button-primary-border--hover:var(--horizon-color-level-two);--color-button-primary-border--disabled:var(--horizon-color-neutral-500);--color-button-primary-text:var(--horizon-color-neutral-900);--color-button-primary-text--hover:var(--horizon-color-accent);--color-button-primary-text--disabled:var(--horizon-color-neutral-200);--color-button-secondary-bg:var(--horizon-color-level-two);--color-button-secondary-bg--hover:var(--horizon-color-accent);--color-button-secondary-bg--disabled:var(--horizon-color-neutral-500);--color-button-secondary-text:var(--horizon-color-neutral-50);--color-button-secondary-text--hover:var(--horizon-color-level-two);--color-button-secondary-text--disabled:var(--horizon-color-neutral-200);--color-button-secondary-border:var(--horizon-color-neutral-900);--color-button-secondary-border--disabled:var(--horizon-color-neutral-500);--color-button-outline-bg:var(--horizon-color-transparent);--color-button-outline-bg--hover:var(--horizon-color-level-two);--color-button-outline-text:var(--horizon-color-neutral-50);--color-button-outline-text--hover:var(--horizon-color-accent);--color-button-outline-text--disabled:var(--horizon-color-neutral-400);--color-button-outline-border:var(--horizon-color-accent);--color-button-outline-border--disabled:var(--horizon-color-neutral-400);--color-button-ghost-bg:var(--horizon-color-transparent);--color-button-ghost-bg--hover:var(--horizon-color-level-two);--color-button-ghost-text:var(--horizon-color-neutral-50);--color-button-ghost-text--hover:var(--horizon-color-accent);--color-button-ghost-text--disabled:var(--horizon-color-neutral-400);--color-button-danger:var(--horizon-color-danger-400);--color-button-danger--hover:var(--horizon-color-danger-500)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-button-danger--hover:color-mix(in oklab, var(--horizon-color-danger-500) 80%, transparent)}}:root,:host{--color-checkbox-border:var(--horizon-color-neutral-100);--color-checkbox-border--focus:var(--horizon-color-accent);--color-checkbox-border--checked:var(--horizon-color-accent);--color-checkbox-indicator--checked:var(--horizon-color-accent);--color-data-card-description:var(--horizon-color-neutral-300);--color-dialog-bg:var(--horizon-color-level-one);--color-drawer-bg:var(--horizon-color-level-one);--color-input-border:var(--horizon-color-white)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-input-border:color-mix(in oklab, var(--horizon-color-white) 10%, transparent)}}:root,:host{--color-input-border--hover:var(--horizon-color-neutral-300);--color-input-border--focus:var(--horizon-color-accent);--color-input-border--disabled:var(--horizon-color-neutral-500);--color-input-bg:var(--horizon-color-level-zero);--color-input-bg--hover:var(--horizon-color-level-four);--color-input-bg--disabled:var(--horizon-color-neutral-700);--color-input-bg--selected:var(--horizon-color-level-four);--color-input-text:var(--horizon-color-neutral-50);--color-input-text-prefix:var(--horizon-color-neutral-200);--color-input-text--disabled:var(--horizon-color-neutral-200);--color-input-text-placeholder:var(--horizon-color-neutral-500);--color-input-primitive-border:var(--horizon-color-neutral-800);--color-input-otp-filled-separator:var(--horizon-color-level-five);--color-input-otp-border:var(--horizon-color-neutral-300);--color-input-otp-border--focus:var(--horizon-color-accent);--color-input-otp-caret:var(--horizon-color-neutral-200);--color-kbd-bg:var(--horizon-color-level-two);--color-kbd-text:var(--color-text-secondary);--color-popover-bg:var(--horizon-color-level-one);--color-popover-text:var(--horizon-color-neutral-50);--color-radio-bg:var(--horizon-color-neutral-900);--color-radio-bg--selected:var(--horizon-color-accent);--color-radio-border--hover:var(--horizon-color-accent);--color-radio-border--selected:var(--horizon-color-accent);--color-slider-track:var(--horizon-color-neutral-700);--color-slider-range:var(--horizon-color-neutral-50);--color-slider-thumb-border:var(--horizon-color-neutral-50);--color-slider-thumb-bg:var(--horizon-color-neutral-50);--color-slider-thumb-ring:var(--horizon-color-neutral-50);--color-switch-bg:var(--horizon-color-neutral-700);--color-switch-bg--checked:var(--horizon-color-white);--color-switch-thumb:var(--horizon-color-neutral-950);--color-switch-thumb--checked:var(--horizon-color-white);--color-tabs-group-bg:var(--horizon-color-level-one);--color-tabs-indicator:var(--horizon-color-accent);--color-tabs-enclosed-indicator:var(--horizon-color-level-two);--color-tabs-border:var(--horizon-color-level-four);--color-toast-bg:var(--horizon-color-level-one);--color-toast-border:var(--horizon-color-level-four);--color-toast-text:var(--horizon-color-neutral-50);--color-toast-success-bg:var(--horizon-color-success-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-success-bg:color-mix(in oklab, var(--horizon-color-success-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-success-border:var(--horizon-color-success-400);--color-toast-success-text:var(--horizon-color-success-400);--color-toast-success-icon:var(--horizon-color-success-400);--color-toast-warning-bg:var(--horizon-color-warning-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-warning-bg:color-mix(in oklab, var(--horizon-color-warning-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-warning-border:var(--horizon-color-warning-400);--color-toast-warning-text:var(--horizon-color-warning-400);--color-toast-warning-icon:var(--horizon-color-warning-400);--color-toast-danger-bg:var(--horizon-color-danger-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-danger-bg:color-mix(in oklab, var(--horizon-color-danger-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-danger-border:var(--horizon-color-danger-400);--color-toast-danger-text:var(--horizon-color-danger-400);--color-toast-danger-icon:var(--horizon-color-danger-400);--color-toast-info-bg:var(--horizon-color-primary-400)}@supports (color:color-mix(in lab, red, red)){:root,:host{--color-toast-info-bg:color-mix(in oklab, var(--horizon-color-primary-400) 10%, var(--horizon-color-neutral-950))}}:root,:host{--color-toast-info-border:var(--horizon-color-primary-400);--color-toast-info-text:var(--horizon-color-primary-400);--color-toast-info-icon:var(--horizon-color-primary-400);--color-toggle-bg:var(--horizon-color-level-two);--color-toggle-bg--active-default:var(--horizon-color-primary-700);--color-toggle-bg--active:var(--color-toggle-bg--active-default);--color-toggle-bg--hover:var(--horizon-color-level-four);--color-toggle-border:var(--horizon-color-transparent);--color-toggle-border--hover:var(--horizon-color-level-four);--color-toggle-border--active-default:var(--horizon-color-primary-600);--color-toggle-border--active:var(--color-toggle-border--active-default);--color-toggle-text:var(--horizon-color-neutral-50);--color-toggle-text--hover:var(--horizon-color-neutral-200);--color-toggle-text--active-default:var(--color-text-primary);--color-toggle-text--active:var(--color-toggle-text--active-default);--color-toggle-outline-border:var(--horizon-color-neutral-700);--color-toggle-outline-divider:var(--horizon-color-neutral-600);--color-toggle-outline-border--hover:var(--horizon-color-neutral-400);--color-tooltip-bg:var(--horizon-color-level-one);--color-tooltip-arrow:var(--horizon-color-level-one);--color-tooltip-outline-border:var(--horizon-color-level-four);--color-tooltip-outline-arrow:var(--horizon-color-level-four);--color-black-40:oklch(0% 0 0/.4);--animate-caret-blink:caret-blink 1.2s ease-out infinite;--animate-accordion-down:accordion-down .2s ease-out;--animate-accordion-up:accordion-up .2s ease-out}:root{--horizon-color-black:oklch(0% 0 0);--horizon-color-white:oklch(100% 0 0);--horizon-color-transparent:oklch(0% 0 0/0);--horizon-color-accent:oklch(92.53% .1976 123.38);--horizon-color-neutral-50:oklch(98.5% 0 0);--horizon-color-neutral-100:oklch(92.19% 0 0);--horizon-color-neutral-200:oklch(86.99% 0 0);--horizon-color-neutral-300:oklch(79.03% 0 0);--horizon-color-neutral-400:oklch(71.55% 0 0);--horizon-color-neutral-500:oklch(55.55% 0 0);--horizon-color-neutral-600:oklch(43.86% 0 0);--horizon-color-neutral-700:oklch(37.15% 0 0);--horizon-color-neutral-800:oklch(32.11% 0 0);--horizon-color-neutral-900:oklch(26.86% 0 0);--horizon-color-neutral-950:oklch(21.78% 0 0);--horizon-color-primary-50:oklch(97.37% .01 238);--horizon-color-primary-100:oklch(93.88% .03 242.35);--horizon-color-primary-200:oklch(89.3% .06 242.83);--horizon-color-primary-300:oklch(83.05% .09 240.33);--horizon-color-primary-400:oklch(74.57% .14 245.84);--horizon-color-primary-500:oklch(66.23% .18 254.28);--horizon-color-primary-600:oklch(58.57% .21 259.12);--horizon-color-primary-700:oklch(52.25% .21 261.44);--horizon-color-primary-800:oklch(42.44% .17 262.29);--horizon-color-primary-900:oklch(39.88% .14 261.51);--horizon-color-primary-950:oklch(29.27% .09 263.49);--horizon-color-level-zero:oklch(23.78% 0 0);--horizon-color-level-one:oklch(26.94% 0 0);--horizon-color-level-two:oklch(29.93% 0 0);--horizon-color-level-three:oklch(32.89% 0 0);--horizon-color-level-four:oklch(35.71% 0 0);--horizon-color-level-five:oklch(38.62% 0 0);--horizon-color-success-50:oklch(96.2% .044 156.743);--horizon-color-success-100:oklch(92.5% .084 155.995);--horizon-color-success-200:oklch(87.1% .15 154.449);--horizon-color-success-300:oklch(79.2% .209 151.711);--horizon-color-success-400:oklch(72.3% .219 149.579);--horizon-color-success-500:oklch(62.7% .194 149.214);--horizon-color-warning-50:oklch(95.4% .038 75.164);--horizon-color-warning-100:oklch(90.1% .076 70.697);--horizon-color-warning-200:oklch(83.7% .128 66.29);--horizon-color-warning-300:oklch(75% .183 55.934);--horizon-color-warning-400:oklch(70.5% .213 47.604);--horizon-color-warning-500:oklch(64.6% .222 41.116);--horizon-color-danger-50:oklch(93.6% .032 17.717);--horizon-color-danger-100:oklch(88.5% .062 18.334);--horizon-color-danger-200:oklch(80.8% .114 19.571);--horizon-color-danger-300:oklch(70.4% .191 22.216);--horizon-color-danger-400:oklch(57.7% .245 27.325);--horizon-color-danger-500:oklch(50.5% .213 27.518)}:root[data-theme=light]{--horizon-color-level-one:oklch(98.51% 0 0);--color-background:var(--horizon-color-neutral-50)}@keyframes animate-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes animate-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes caret-blink{0%,70%,to{opacity:1}20%,50%{opacity:0}}@keyframes fade-in-0{0%{opacity:0}to{opacity:1}}@keyframes fade-out-0{0%{opacity:1}to{opacity:0}}@keyframes fade-in-tabs-indicator{0%{opacity:0;transform:translateY(-2rem)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down-from-top{0%{opacity:0;transform:translateY(-100%)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slide-up-to-top{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-100%)scale(.95)}}@keyframes spin-around{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}@keyframes zoom-in-95{0%{opacity:0;transform:translate(-50%)translateY(-50%)scale(.95)}to{opacity:1;transform:translate(-50%)translateY(-50%)scale(1)}}@keyframes zoom-out-95{0%{opacity:1;transform:translate(-50%)translateY(-50%)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-50%)scale(.95)}}@keyframes accordion-down{0%{opacity:0;height:0}to{height:var(--radix-accordion-content-height);opacity:1}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height);opacity:1}to{opacity:0;height:0}}@layer utilities{a.underline-on-hover{color:var(--color-accent);cursor:pointer;width:max-content;text-decoration:none;position:relative}a.underline-on-hover:before{background-color:var(--color-accent);content:"";border-radius:.1rem;width:100%;height:.1rem;transition:transform .3s ease-in-out;position:absolute;bottom:-.2rem;left:0;transform:scaleX(0)}a.underline-on-hover:hover:before{transform:scaleX(1)}.spectral-root{isolation:isolate}[data-vaul-drawer] *,[data-vaul-drawer] :before,[data-vaul-drawer] :after{box-sizing:border-box!important}[vaul-drawer]{transition:transform .2s cubic-bezier(.165,.84,.44,1)!important}[vaul-overlay]{transition:opacity .2s cubic-bezier(.165,.84,.44,1)!important}.shadow-neumorphic-large{box-shadow:12px 12px 24px var(--color-shadow-neumorphic-large), -12px -12px 24px var(--color-white)}.shadow-neumorphic-small{box-shadow:4px 4px 8px var(--color-shadow-neumorphic), -4px -4px 8px var(--color-white)}.dialog-no-animations,.dialog-no-animations[data-state=open],.dialog-no-animations[data-state=closed]{animation:none!important;transform:translate(-50%)translateY(-50%)!important}svg:focus-visible,svg:focus{outline:none}.card-effects{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#ffffff03 0%,#fff0 100%),#26262680;border:.5px solid #ffffff0d;border-radius:1rem;box-shadow:inset 0 -1px #0000001a,0 20px 40px #00000040,0 15px 30px #00000026,0 5px 10px #0000000d}.card-effects-dark{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#ffffff0a 0%,#fff0 52%),#26262691;border:.5px solid #ffffff0f;border-radius:1rem;box-shadow:inset 0 1px #ffffff08,inset 0 -1px #00000038,0 22px 44px -8px #00000057,0 10px 20px -8px #0000003d}.tooltip-effects{box-shadow:3px 3px 6px 3px #0000004d}@supports not ((-webkit-backdrop-filter:blur(0)) or (backdrop-filter:blur(0))){.card-effects{background-color:#22222599}.card-effects-dark{background-color:#27272ab8}}.rdp{margin:0}.rdp-root{padding-right:24px}.rdp-root .rdp-nav{z-index:9999;position:absolute}.rdp-root .rdp-nav .nav-prev,.rdp-root .rdp-nav .nav-next{justify-content:center;align-items:center;display:flex;position:absolute}:is(.rdp-root .rdp-nav .nav-prev,.rdp-root .rdp-nav .nav-next):hover{color:var(--color-text-secondary);cursor:pointer;background-color:#0000}.rdp-root .rdp-month_caption{justify-content:center;align-items:center;padding-block-end:8px;display:flex;position:relative}.rdp-root .rdp-month_caption .month-title{font-size:18px;font-weight:600}.rdp-root .rdp-day_button{border-color:#0000;border-radius:100%;width:40px;height:40px}.rdp-root .day.rdp-today{color:var(--color-accent);font-weight:600}.rdp-root .day.rdp-selected .rdp-day_button{background-color:var(--color-accent);color:var(--color-text-inverted);border-radius:50%;font-weight:600}.rdp-root .day.rdp-outside .rdp-day_button{opacity:.25}.rdp-root .day:not(.rdp-disabled):hover{background-color:var(--color-neutral-200);color:var(--color-text-inverted);border-radius:50%;cursor:pointer!important}.rdp-root .day.rdp-disabled .rdp-day_button{color:var(--color-text-disabled)}.rdp-root .day.rdp-hidden .rdp-day_button{visibility:hidden}.rdp-root .rdp-weekdays .rdp-weekday{color:var(--color-neutral-400);font-weight:500}:is(.rdp-root .hours,.rdp-root .minutes) input{width:max-content;max-width:22px}:is(.rdp-root .hours,.rdp-root .minutes) input.hours-input{text-align:right}:is(.rdp-root .hours,.rdp-root .minutes) input.minutes-input{text-align:left}:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input{border:0;font-size:16px}:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:hover,:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:focus,:is(.rdp-root .hours,.rdp-root .minutes,.rdp-root .am-pm) input:focus-visible{border:0;outline:0}.rdp-root .hours{flex-direction:row;align-items:center;display:flex}.rdp-root .hours input{text-align:right}.rdp-root .hours span{margin-inline:1px 2px}.rdp-root .am-pm{width:auto;margin-inline-start:8px}.rdp-root .am-pm button{background-color:#0000;border:0;padding-inline:0;font-size:14px}.rdp-root .am-pm button:hover{cursor:pointer}.rdp-root .am-pm button:focus,.rdp-root .am-pm button:focus-visible{outline:0}.rdp-root .am-pm button svg:not(.chevron-icon){display:none}.rdp-root .am-pm span:focus,.rdp-root .am-pm span:focus-visible{outline:0}.rdp-root .am-pm-dropdown{z-index:999;border-bottom-right-radius:4px;border-bottom-left-radius:4px;width:58px;margin-top:-5px;font-size:14px;position:relative}.rdp-root .am-pm-dropdown:hover{cursor:pointer}.rdp-root .am-pm-dropdown .am-pm-option{text-align:center;z-index:999;justify-content:center;align-items:center;height:24px;padding-inline:8px;display:flex}.rdp-root .am-pm-dropdown .am-pm-option:focus-visible,.rdp-root .am-pm-dropdown .am-pm-option:focus{outline:0}}.\@container\/card-header{container:card-header/inline-size}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing) * 0)}.inset-y-0{inset-block:calc(var(--spacing) * 0)}.top-0{top:calc(var(--spacing) * 0)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-4{top:calc(var(--spacing) * 4)}.top-\[50\%\]{top:50%}.right-0{right:calc(var(--spacing) * 0)}.right-1{right:calc(var(--spacing) * 1)}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.right-10{right:calc(var(--spacing) * 10)}.right-\[-14px\]{right:-14px}.right-px{right:1px}.bottom-0{bottom:calc(var(--spacing) * 0)}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-4{bottom:calc(var(--spacing) * 4)}.bottom-px{bottom:1px}.left-0{left:calc(var(--spacing) * 0)}.left-1{left:calc(var(--spacing) * 1)}.left-1\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.left-4{left:calc(var(--spacing) * 4)}.left-\[50\%\]{left:50%}.left-\[calc\(100\%-0\.75rem\)\]{left:calc(100% - .75rem)}.left-\[calc\(100\%-1\.5rem\)\]{left:calc(100% - 1.5rem)}.left-\[calc\(100\%-1\.25rem\)\]{left:calc(100% - 1.25rem)}.left-\[calc\(100\%-1rem\)\]{left:calc(100% - 1rem)}.isolate{isolation:isolate}.z-0{z-index:0}.z-1{z-index:1}.z-10{z-index:10}.z-50{z-index:50}.z-\[-1\]{z-index:-1}.z-\[1\]{z-index:1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing) * 0)}.m-0\!{margin:calc(var(--spacing) * 0)!important}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.-mx-6{margin-inline:calc(var(--spacing) * -6)}.mx-3{margin-inline:calc(var(--spacing) * 3)}.my-0\.5{margin-block:calc(var(--spacing) * .5)}.my-1{margin-block:calc(var(--spacing) * 1)}.-me-0\.5{margin-inline-end:calc(var(--spacing) * -.5)}.me-0{margin-inline-end:calc(var(--spacing) * 0)}.-mbe-0\.5{margin-block-end:calc(var(--spacing) * -.5)}.mbe-0{margin-block-end:calc(var(--spacing) * 0)}.\!mt-4{margin-top:calc(var(--spacing) * 4)!important}.mt-0\!{margin-top:calc(var(--spacing) * 0)!important}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-0\.5\!{margin-top:calc(var(--spacing) * .5)!important}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-4\!{margin-top:calc(var(--spacing) * 4)!important}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-6\!{margin-top:calc(var(--spacing) * 6)!important}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-\[1\.6rem\]{margin-top:1.6rem}.mt-\[21px\]{margin-top:21px}.mr-2{margin-right:calc(var(--spacing) * 2)}.mr-\[-4px\]{margin-right:-4px}.mb-0\!{margin-bottom:calc(var(--spacing) * 0)!important}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-\[1\.2rem\]{margin-bottom:1.2rem}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:calc(var(--spacing) * 1)}.ml-2{margin-left:calc(var(--spacing) * 2)}.ml-8{margin-left:calc(var(--spacing) * 8)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.table{display:table}.aspect-square{aspect-ratio:1}.size-2\.5{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-6\.5{width:calc(var(--spacing) * 6.5);height:calc(var(--spacing) * 6.5)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-full{width:100%;height:100%}.h-\(--radix-select-trigger-height\){height:var(--radix-select-trigger-height)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-4{height:calc(var(--spacing) * 4)}.h-4\.5{height:calc(var(--spacing) * 4.5)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-12\!{height:calc(var(--spacing) * 12)!important}.h-64{height:calc(var(--spacing) * 64)}.h-80{height:calc(var(--spacing) * 80)}.h-\[72px\]{height:72px}.h-\[inherit\]{height:inherit}.h-auto{height:auto}.h-fit{height:fit-content}.h-full{height:100%}.h-px{height:1px}.max-h-\(--radix-popover-content-available-height\){max-height:var(--radix-popover-content-available-height)}.max-h-22{max-height:calc(var(--spacing) * 22)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-80{max-height:calc(var(--spacing) * 80)}.max-h-\[90vh\]{max-height:90vh}.max-h-\[min\(var\(--available-height\)\,18rem\)\]{max-height:min(var(--available-height), 18rem)}.max-h-\[min\(var\(--radix-dropdown-menu-content-available-height\)\,300px\)\]{max-height:min(var(--radix-dropdown-menu-content-available-height), 300px)}.max-h-\[min\(var\(--radix-select-content-available-height\)\,300px\)\]{max-height:min(var(--radix-select-content-available-height), 300px)}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-8{min-height:calc(var(--spacing) * 8)}.min-h-12\!{min-height:calc(var(--spacing) * 12)!important}.w-\(--popover-width\){width:var(--popover-width)}.w-\(--spectral-select-content-width\){width:var(--spectral-select-content-width)}.w-1\/3{width:33.3333%}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-2xs{width:var(--container-2xs)}.w-4{width:calc(var(--spacing) * 4)}.w-4\.5{width:calc(var(--spacing) * 4.5)}.w-5{width:calc(var(--spacing) * 5)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-14{width:calc(var(--spacing) * 14)}.w-44{width:calc(var(--spacing) * 44)}.w-72{width:calc(var(--spacing) * 72)}.w-\[60\%\]{width:60%}.w-\[240px\]{width:240px}.w-\[300px\]{width:300px}.w-\[320px\]{width:320px}.w-\[330px\]{width:330px}.w-\[340px\]{width:340px}.w-\[360px\]{width:360px}.w-\[380px\]{width:380px}.w-\[400px\]{width:400px}.w-\[420px\]{width:420px}.w-\[486px\]{width:486px}.w-\[520px\]{width:520px}.w-\[560px\]{width:560px}.w-auto{width:auto}.w-auto\!{width:auto!important}.w-fit{width:fit-content}.w-full{width:100%}.w-lg{width:var(--container-lg)}.w-max{width:max-content}.w-px{width:1px}.max-w-44{max-width:calc(var(--spacing) * 44)}.max-w-48{max-width:calc(var(--spacing) * 48)}.max-w-\[360px\]{max-width:360px}.max-w-\[400px\]{max-width:400px}.max-w-\[420px\]{max-width:420px}.max-w-\[520px\]{max-width:520px}.max-w-\[600px\]{max-width:600px}.max-w-\[800px\]{max-width:800px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-xl{max-width:var(--container-xl)}.min-w-\(--spectral-select-content-width\){min-width:var(--spectral-select-content-width)}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-5{min-width:calc(var(--spacing) * 5)}.min-w-6{min-width:calc(var(--spacing) * 6)}.min-w-8{min-width:calc(var(--spacing) * 8)}.min-w-9{min-width:calc(var(--spacing) * 9)}.min-w-10{min-width:calc(var(--spacing) * 10)}.min-w-32{min-width:calc(var(--spacing) * 32)}.min-w-\[300px\]{min-width:300px}.flex-1{flex:1}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.basis-\[30\%\]{flex-basis:30%}.basis-\[70\%\]{flex-basis:70%}.border-collapse{border-collapse:collapse}.origin-\(--radix-dropdown-menu-content-transform-origin\){transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.origin-\(--radix-popover-content-transform-origin\){transform-origin:var(--radix-popover-content-transform-origin)}.origin-\(--radix-select-content-transform-origin\){transform-origin:var(--radix-select-content-transform-origin)}.origin-\(--transform-origin\){transform-origin:var(--transform-origin)}.origin-\[--radix-hover-card-content-transform-origin\]{transform-origin:--radix-hover-card-content-transform-origin}.origin-\[--radix-popover-content-transform-origin\]{transform-origin:--radix-popover-content-transform-origin}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-x-2{--tw-translate-x:calc(var(--spacing) * -2);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-0\.5{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-\[calc\(50\%\+1px\)\]{--tw-translate-y:calc(calc(50% + 1px) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-\[calc\(50\%-1\.5px\)\]{--tw-translate-y:calc(calc(50% - 1.5px) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0{--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.-rotate-90{rotate:-90deg}.rotate-45{rotate:45deg}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-wait{cursor:wait}.touch-none{touch-action:none}.scroll-my-1{scroll-margin-block:calc(var(--spacing) * 1)}.list-inside{list-style-position:inside}.list-inside\!{list-style-position:inside!important}.list-disc{list-style-type:disc}.\[appearance\:textfield\]{appearance:textfield}.grid-cols-\[1fr_1fr\]{grid-template-columns:1fr 1fr}.grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.justify-items-start{justify-items:start}.gap-0{gap:calc(var(--spacing) * 0)}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-\[0\.4rem\]{gap:.4rem}.gap-\[15px\]{gap:15px}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-y-1{row-gap:calc(var(--spacing) * 1)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}.self-stretch{align-self:stretch}.justify-self-end{justify-self:flex-end}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-contain{overscroll-behavior:contain}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-\[2px\]{border-radius:2px}.rounded-\[8px\]{border-radius:8px}.rounded-\[16px\]{border-radius:16px}.rounded-\[var\(--radius\,0\.375rem\)\]{border-radius:var(--radius,.375rem)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-none{border-radius:0}.rounded-none\!{border-radius:0!important}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-xs{border-radius:var(--radius-xs)}.rounded-s-md{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md)}.rounded-s-none{border-start-start-radius:0;border-end-start-radius:0}.rounded-ss-md{border-start-start-radius:var(--radius-md)}.rounded-ss-none{border-start-start-radius:0}.rounded-e-md{border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md)}.rounded-e-none{border-start-end-radius:0;border-end-end-radius:0}.rounded-se-md{border-start-end-radius:var(--radius-md)}.rounded-se-none{border-start-end-radius:0}.rounded-ee-md{border-end-end-radius:var(--radius-md)}.rounded-ee-none{border-end-end-radius:0}.rounded-es-md{border-end-start-radius:var(--radius-md)}.rounded-es-none{border-end-start-radius:0}.rounded-r-none\!{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-r-xl{border-top-right-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-2\!{border-style:var(--tw-border-style)!important;border-width:2px!important}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-r-0{border-right-style:var(--tw-border-style);border-right-width:0}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-l-0{border-left-style:var(--tw-border-style);border-left-width:0}.border-none{--tw-border-style:none;border-style:none}.border-none\!{--tw-border-style:none!important;border-style:none!important}.border-\[\#F5F5F5\]{border-color:#f5f5f5}.border-\[\#F7F7F7\]{border-color:#f7f7f7}.border-alert-border{border-color:var(--color-alert-border)}.border-alert-danger-border{border-color:var(--color-alert-danger-border)}.border-alert-info-border{border-color:var(--color-alert-info-border)}.border-alert-success-border{border-color:var(--color-alert-success-border)}.border-alert-warning-border{border-color:var(--color-alert-warning-border)}.border-badge-outline-border{border-color:var(--color-badge-outline-border)}.border-border-secondary{border-color:var(--color-border-secondary)}.border-button-danger{border-color:var(--color-button-danger)}.border-button-outline-border{border-color:var(--color-button-outline-border)}.border-button-outline-border--disabled{border-color:var(--color-button-outline-border--disabled)}.border-button-primary-border{border-color:var(--color-button-primary-border)}.border-button-primary-border--disabled{border-color:var(--color-button-primary-border--disabled)}.border-button-secondary-border{border-color:var(--color-button-secondary-border)}.border-button-secondary-border--disabled{border-color:var(--color-button-secondary-border--disabled)}.border-checkbox-border{border-color:var(--color-checkbox-border)}.border-danger-400{border-color:var(--color-danger-400)}.border-gray-200{border-color:var(--color-gray-200)}.border-input-border{border-color:var(--color-input-border)}.border-input-otp-border{border-color:var(--color-input-otp-border)}.border-input-otp-border--focus{border-color:var(--color-input-otp-border--focus)}.border-level-four{border-color:var(--color-level-four)}.border-level-one{border-color:var(--color-level-one)}.border-level-three{border-color:var(--color-level-three)}.border-slider-thumb-border{border-color:var(--color-slider-thumb-border)}.border-tabs-border{border-color:var(--color-tabs-border)}.border-toast-border{border-color:var(--color-toast-border)}.border-toast-danger-border{border-color:var(--color-toast-danger-border)}.border-toast-info-border{border-color:var(--color-toast-info-border)}.border-toast-success-border{border-color:var(--color-toast-success-border)}.border-toast-warning-border{border-color:var(--color-toast-warning-border)}.border-toggle-border{border-color:var(--color-toggle-border)}.border-toggle-outline-border{border-color:var(--color-toggle-outline-border)}.border-tooltip-outline-arrow{border-color:var(--color-tooltip-outline-arrow)}.border-tooltip-outline-border{border-color:var(--color-tooltip-outline-border)}.border-transparent{border-color:#0000}.border-warning-400{border-color:var(--color-warning-400)}.bg-\[\#4DAFFF\]{background-color:#4dafff}.bg-\[\#F0F2F4\]{background-color:#f0f2f4}.bg-\[\#F7F8F9\]{background-color:#f7f8f9}.bg-\[\#FF3F40\]{background-color:#ff3f40}.bg-\[\#FFF0F0\]{background-color:#fff0f0}.bg-alert-bg{background-color:var(--color-alert-bg)}.bg-alert-danger-bg{background-color:var(--color-alert-danger-bg)}.bg-alert-info-bg{background-color:var(--color-alert-info-bg)}.bg-alert-success-bg{background-color:var(--color-alert-success-bg)}.bg-alert-warning-bg{background-color:var(--color-alert-warning-bg)}.bg-background{background-color:var(--color-background)}.bg-badge-destructive-bg{background-color:var(--color-badge-destructive-bg)}.bg-badge-primary-bg{background-color:var(--color-badge-primary-bg)}.bg-badge-secondary-bg{background-color:var(--color-badge-secondary-bg)}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.bg-border-secondary{background-color:var(--color-border-secondary)}.bg-button-danger{background-color:var(--color-button-danger)}.bg-button-ghost-bg{background-color:var(--color-button-ghost-bg)}.bg-button-outline-bg{background-color:var(--color-button-outline-bg)}.bg-button-primary-bg{background-color:var(--color-button-primary-bg)}.bg-button-primary-bg--disabled{background-color:var(--color-button-primary-bg--disabled)}.bg-button-secondary-bg{background-color:var(--color-button-secondary-bg)}.bg-button-secondary-bg--disabled{background-color:var(--color-button-secondary-bg--disabled)}.bg-dialog-bg,.bg-dialog-bg\/85{background-color:var(--color-dialog-bg)}@supports (color:color-mix(in lab, red, red)){.bg-dialog-bg\/85{background-color:color-mix(in oklab, var(--color-dialog-bg) 85%, transparent)}}.bg-drawer-bg{background-color:var(--color-drawer-bg)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-input-bg{background-color:var(--color-input-bg)}.bg-input-bg--hover{background-color:var(--color-input-bg--hover)}.bg-input-bg--selected{background-color:var(--color-input-bg--selected)}.bg-input-border{background-color:var(--color-input-border)}.bg-input-otp-caret{background-color:var(--color-input-otp-caret)}.bg-input-primitive-border{background-color:var(--color-input-primitive-border)}.bg-kbd-bg{background-color:var(--color-kbd-bg)}.bg-level-one{background-color:var(--color-level-one)}.bg-level-three{background-color:var(--color-level-three)}.bg-level-two{background-color:var(--color-level-two)}.bg-overlay{background-color:var(--color-overlay)}.bg-popover-bg{background-color:var(--color-popover-bg)}.bg-radio-bg{background-color:var(--color-radio-bg)}.bg-radio-bg--selected{background-color:var(--color-radio-bg--selected)}.bg-slider-range{background-color:var(--color-slider-range)}.bg-slider-thumb-bg{background-color:var(--color-slider-thumb-bg)}.bg-slider-track{background-color:var(--color-slider-track)}.bg-switch-thumb--checked{background-color:var(--color-switch-thumb--checked)}.bg-tabs-enclosed-indicator{background-color:var(--color-tabs-enclosed-indicator)}.bg-tabs-group-bg{background-color:var(--color-tabs-group-bg)}.bg-toast-bg{background-color:var(--color-toast-bg)}.bg-toast-danger-bg{background-color:var(--color-toast-danger-bg)}.bg-toast-info-bg{background-color:var(--color-toast-info-bg)}.bg-toast-success-bg{background-color:var(--color-toast-success-bg)}.bg-toast-warning-bg{background-color:var(--color-toast-warning-bg)}.bg-toggle-bg{background-color:var(--color-toggle-bg)}.bg-tooltip-arrow{background-color:var(--color-tooltip-arrow)}.bg-tooltip-bg{background-color:var(--color-tooltip-bg)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.fill-tooltip-arrow{fill:var(--color-tooltip-arrow)}.object-cover{object-fit:cover}.p-0{padding:calc(var(--spacing) * 0)}.p-0\!{padding:calc(var(--spacing) * 0)!important}.p-1{padding:calc(var(--spacing) * 1)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pt-0{padding-top:calc(var(--spacing) * 0)}.pt-1{padding-top:calc(var(--spacing) * 1)}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-3\!{padding-top:calc(var(--spacing) * 3)!important}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-1{padding-right:calc(var(--spacing) * 1)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pr-10{padding-right:calc(var(--spacing) * 10)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-0{padding-bottom:calc(var(--spacing) * 0)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-5{padding-left:calc(var(--spacing) * 5)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-7{padding-left:calc(var(--spacing) * 7)}.pl-9{padding-left:calc(var(--spacing) * 9)}.text-center{text-align:center}.text-left{text-align:left}.text-start{text-align:start}.\[text-indent\:var\(--prefix-width\)\]{text-indent:var(--prefix-width)}.font-mono\!{font-family:var(--font-mono)!important}.font-sans\!{font-family:var(--font-sans)!important}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-base\!{font-size:var(--text-base)!important;line-height:var(--tw-leading,var(--text-base--line-height))!important}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\!{font-size:var(--text-sm)!important;line-height:var(--tw-leading,var(--text-sm--line-height))!important}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-xs\!{font-size:var(--text-xs)!important;line-height:var(--tw-leading,var(--text-xs--line-height))!important}.text-\[11px\]{font-size:11px}.text-\[15px\]{font-size:15px}.text-\[17px\]{font-size:17px}.text-\[19px\]{font-size:19px}.text-\[22px\]{font-size:22px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-\[24px\]{--tw-leading:24px;line-height:24px}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-tighter{--tw-tracking:var(--tracking-tighter);letter-spacing:var(--tracking-tighter)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.whitespace-nowrap{white-space:nowrap}.text-\[\#222222\]{color:#222}.text-\[\#999999\]{color:#999}.text-\[\#FF3F40\]{color:#ff3f40}.text-\[\#FFFFFF\]{color:#fff}.text-alert-danger-text{color:var(--color-alert-danger-text)}.text-alert-info-text{color:var(--color-alert-info-text)}.text-alert-success-text{color:var(--color-alert-success-text)}.text-alert-text{color:var(--color-alert-text)}.text-alert-warning-text{color:var(--color-alert-warning-text)}.text-badge-secondary-text{color:var(--color-badge-secondary-text)}.text-button-danger{color:var(--color-button-danger)}.text-button-ghost-text{color:var(--color-button-ghost-text)}.text-button-ghost-text--disabled{color:var(--color-button-ghost-text--disabled)}.text-button-outline-text{color:var(--color-button-outline-text)}.text-button-outline-text--disabled{color:var(--color-button-outline-text--disabled)}.text-button-primary-text{color:var(--color-button-primary-text)}.text-button-primary-text--disabled{color:var(--color-button-primary-text--disabled)}.text-button-secondary-text{color:var(--color-button-secondary-text)}.text-button-secondary-text--disabled{color:var(--color-button-secondary-text--disabled)}.text-checkbox-indicator--checked{color:var(--color-checkbox-indicator--checked)}.text-current{color:currentColor}.text-danger-400{color:var(--color-danger-400)}.text-danger-400\!{color:var(--color-danger-400)!important}.text-data-card-description{color:var(--color-data-card-description)}.text-gray-500{color:var(--color-gray-500)}.text-inherit{color:inherit}.text-input-text{color:var(--color-input-text)}.text-input-text\!{color:var(--color-input-text)!important}.text-input-text--disabled{color:var(--color-input-text--disabled)}.text-input-text-placeholder{color:var(--color-input-text-placeholder)}.text-input-text-prefix{color:var(--color-input-text-prefix)}.text-kbd-text{color:var(--color-kbd-text)}.text-neutral-200\!{color:var(--color-neutral-200)!important}.text-neutral-400{color:var(--color-neutral-400)}.text-neutral-400\!{color:var(--color-neutral-400)!important}.text-popover-text{color:var(--color-popover-text)}.text-success-400{color:var(--color-success-400)}.text-text-primary{color:var(--color-text-primary)}.text-text-primary\!{color:var(--color-text-primary)!important}.text-text-secondary{color:var(--color-text-secondary)}.text-text-secondary\!{color:var(--color-text-secondary)!important}.text-toast-danger-icon{color:var(--color-toast-danger-icon)}.text-toast-danger-text{color:var(--color-toast-danger-text)}.text-toast-info-icon{color:var(--color-toast-info-icon)}.text-toast-info-text{color:var(--color-toast-info-text)}.text-toast-success-icon{color:var(--color-toast-success-icon)}.text-toast-success-text{color:var(--color-toast-success-text)}.text-toast-text{color:var(--color-toast-text)}.text-toast-warning-icon{color:var(--color-toast-warning-icon)}.text-toast-warning-text{color:var(--color-toast-warning-text)}.text-toggle-text{color:var(--color-toggle-text)}.text-warning-400{color:var(--color-warning-400)}.text-warning-400\!{color:var(--color-warning-400)!important}.uppercase{text-transform:uppercase}.font-stretch-condensed{font-stretch:75%}.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,)}.no-underline\!{text-decoration-line:none!important}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.opacity-100{opacity:1}.shadow-2xs{--tw-shadow:0 1px 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)}.shadow-\[-20px_0_20px_var\(--color-black-40\)\]{--tw-shadow:-20px 0 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_-20px_20px_var\(--color-black-40\)\]{--tw-shadow:0 -20px 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_20px_20px_var\(--color-black-40\)\]{--tw-shadow:0 20px 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[4px_0_10px_rgb\(0_0_0_\/_0\.18\)\]{--tw-shadow:4px 0 10px 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)}.shadow-\[20px_0_20px_var\(--color-black-40\)\]{--tw-shadow:20px 0 20px var(--tw-shadow-color,var(--color-black-40));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.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)}.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)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none\!{--tw-shadow:0 0 #0000!important;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)!important}.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)}.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)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + 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)}.ring-0\!{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor)!important;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)!important}.ring-black{--tw-ring-color:var(--color-black)}.ring-slider-thumb-ring\/50{--tw-ring-color:var(--color-slider-thumb-ring)}@supports (color:color-mix(in lab, red, red)){.ring-slider-thumb-ring\/50{--tw-ring-color:color-mix(in oklab, var(--color-slider-thumb-ring) 50%, transparent)}}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-0{outline-style:var(--tw-outline-style);outline-width:0}.outline-transparent{outline-color:#0000}.blur{--tw-blur:blur(8px);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,)}.blur-\[2px\]{--tw-blur:blur(2px);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,)}.grayscale{--tw-grayscale:grayscale(100%);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,)}.filter{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,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--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,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,box-shadow\]{transition-property:background-color,color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,transform\]{transition-property:background-color,color,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\,opacity\,transform\]{transition-property:filter,opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[opacity\,transform\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[transform\,opacity\,clip-path\]{transition-property:transform,opacity,clip-path;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.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(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}.select-none{-webkit-user-select:none;user-select:none}.\[clip-path\:inset\(0_0_0_0\)\]{clip-path:inset(0)}.\[clip-path\:inset\(0_100\%_0_0\)\]{clip-path:inset(0 100% 0 0)}.duration-150{animation-duration:.15s}.duration-200{animation-duration:.2s}.ease-in{animation-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{animation-timing-function:cubic-bezier(0,0,.2,1)}:is(.\*\:box-border>*),:is(.\*\*\:box-border *){box-sizing:border-box}.not-last\:border-b:not(:last-child){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.group-active\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group):active *),.group-aria-pressed\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group)[aria-pressed=true] *),.group-data-\[state\=on\]\:\[background-color\:var\(--color-toggle-border--active\)\]:is(:where(.group)[data-state=on] *){background-color:var(--color-toggle-border--active)}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:text-neutral-400:is(:where(.peer):disabled~*){color:var(--color-neutral-400)}.peer-disabled\:opacity-50:is(:where(.peer):disabled~*){opacity:.5}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.peer-data-\[state\=checked\]\:invisible:is(:where(.peer)[data-state=checked]~*){visibility:hidden}.peer-data-\[state\=checked\]\:-translate-x-full:is(:where(.peer)[data-state=checked]~*){--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.peer-data-\[state\=checked\]\:text-background:is(:where(.peer)[data-state=checked]~*){color:var(--color-background)}.peer-data-\[state\=on\]\/spectral-split-menu\:border-toggle-border--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){border-color:var(--color-toggle-border--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:bg-toggle-bg--active:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){background-color:var(--color-toggle-bg--active)}.peer-data-\[state\=on\]\/spectral-split-menu\:text-toggle-text--active:is(:where(.peer\/spectral-split-menu)[data-state=on]~*){color:var(--color-toggle-text--active)}.peer-data-\[state\=unchecked\]\:invisible:is(:where(.peer)[data-state=unchecked]~*){visibility:hidden}.peer-data-\[state\=unchecked\]\:translate-x-6:is(:where(.peer)[data-state=unchecked]~*){--tw-translate-x:calc(var(--spacing) * 6);translate:var(--tw-translate-x) var(--tw-translate-y)}.placeholder\:text-input-text\!::placeholder{color:var(--color-input-text)!important}.placeholder\:text-input-text-placeholder::placeholder{color:var(--color-input-text-placeholder)}.placeholder\:text-input-text-placeholder\!::placeholder{color:var(--color-input-text-placeholder)!important}.placeholder\:opacity-100::placeholder{opacity:1}.before\:pointer-events-none:before{content:var(--tw-content);pointer-events:none}.before\:absolute:before{content:var(--tw-content);position:absolute}.before\:inset-y-2:before{content:var(--tw-content);inset-block:calc(var(--spacing) * 2)}.before\:left-0:before{content:var(--tw-content);left:calc(var(--spacing) * 0)}.before\:w-px:before{content:var(--tw-content);width:1px}.before\:bg-border-secondary\/6:before{content:var(--tw-content);background-color:var(--color-border-secondary)}@supports (color:color-mix(in lab, red, red)){.before\:bg-border-secondary\/6:before{background-color:color-mix(in oklab, var(--color-border-secondary) 6%, transparent)}}.before\:content-none:before{content:var(--tw-content);--tw-content:none;content:none}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:inset-0:after{content:var(--tw-content);inset:calc(var(--spacing) * 0)}.after\:top-0:after{content:var(--tw-content);top:calc(var(--spacing) * 0)}.after\:right-0:after{content:var(--tw-content);right:calc(var(--spacing) * 0)}.after\:bottom-0:after{content:var(--tw-content);bottom:calc(var(--spacing) * 0)}.after\:left-0:after{content:var(--tw-content);left:calc(var(--spacing) * 0)}.after\:m-auto:after{content:var(--tw-content);margin:auto}.after\:h-2\.5:after{content:var(--tw-content);height:calc(var(--spacing) * 2.5)}.after\:h-full:after{content:var(--tw-content);height:100%}.after\:w-1:after{content:var(--tw-content);width:calc(var(--spacing) * 1)}.after\:w-2\.5:after{content:var(--tw-content);width:calc(var(--spacing) * 2.5)}.after\:w-full:after{content:var(--tw-content);width:100%}.after\:rounded-full:after{content:var(--tw-content);border-radius:3.40282e38px}.after\:rounded-t-\[0\.3rem\]:after{content:var(--tw-content);border-top-left-radius:.3rem;border-top-right-radius:.3rem}.after\:rounded-l-\[0\.3rem\]:after{content:var(--tw-content);border-top-left-radius:.3rem;border-bottom-left-radius:.3rem}.after\:border-r-\[0\.3rem\]:after{content:var(--tw-content);border-right-style:var(--tw-border-style);border-right-width:.3rem}.after\:border-b-\[0\.3rem\]:after{content:var(--tw-content);border-bottom-style:var(--tw-border-style);border-bottom-width:.3rem}.after\:border-tabs-indicator:after{content:var(--tw-content);border-color:var(--color-tabs-indicator)}.after\:bg-radio-bg--selected:after{content:var(--tw-content);background-color:var(--color-radio-bg--selected)}.after\:content-\[\'\'\]:after{--tw-content:"";content:var(--tw-content)}.after\:content-none:after{content:var(--tw-content);--tw-content:none;content:none}.first\:mt-0:first-child{margin-top:calc(var(--spacing) * 0)}.first\:rounded-s-md:first-child{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md)}.first\:rounded-ss-md:first-child{border-start-start-radius:var(--radius-md)}.first\:rounded-se-md:first-child{border-start-end-radius:var(--radius-md)}.last\:me-0:last-child{margin-inline-end:calc(var(--spacing) * 0)}.last\:mbe-0:last-child{margin-block-end:calc(var(--spacing) * 0)}.last\:mb-0:last-child{margin-bottom:calc(var(--spacing) * 0)}.last\:rounded-e-md:last-child{border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md)}.last\:rounded-ee-md:last-child{border-end-end-radius:var(--radius-md)}.last\:rounded-es-md:last-child{border-end-start-radius:var(--radius-md)}.focus-within\:z-10:focus-within{z-index:10}.focus-within\:outline-none:focus-within{--tw-outline-style:none;outline-style:none}@media (hover:hover){.hover\:z-10:hover{z-index:10}.hover\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:cursor-pointer:hover{cursor:pointer}.hover\:border-button-danger--hover:hover{border-color:var(--color-button-danger--hover)}.hover\:border-button-primary-border--hover:hover{border-color:var(--color-button-primary-border--hover)}.hover\:border-danger-500:hover{border-color:var(--color-danger-500)}.hover\:border-input-border--hover:hover{border-color:var(--color-input-border--hover)}.hover\:border-radio-border--hover:hover{border-color:var(--color-radio-border--hover)}.hover\:border-toggle-border--hover:hover{border-color:var(--color-toggle-border--hover)}.hover\:border-toggle-outline-border--hover:hover{border-color:var(--color-toggle-outline-border--hover)}.hover\:border-warning-400:hover{border-color:var(--color-warning-400)}.hover\:bg-button-danger--hover:hover{background-color:var(--color-button-danger--hover)}.hover\:bg-button-ghost-bg--hover:hover{background-color:var(--color-button-ghost-bg--hover)}.hover\:bg-button-outline-bg--hover:hover{background-color:var(--color-button-outline-bg--hover)}.hover\:bg-button-primary-bg--hover:hover{background-color:var(--color-button-primary-bg--hover)}.hover\:bg-button-secondary-bg--hover:hover{background-color:var(--color-button-secondary-bg--hover)}.hover\:bg-input-bg--hover:hover{background-color:var(--color-input-bg--hover)}.hover\:bg-level-four:hover{background-color:var(--color-level-four)}.hover\:bg-level-three:hover{background-color:var(--color-level-three)}.hover\:bg-level-two:hover{background-color:var(--color-level-two)}.hover\:bg-toggle-bg--hover:hover{background-color:var(--color-toggle-bg--hover)}.hover\:bg-transparent:hover{background-color:#0000}.hover\:text-accent:hover{color:var(--color-accent)}.hover\:text-button-danger\/80:hover{color:var(--color-button-danger)}@supports (color:color-mix(in lab, red, red)){.hover\:text-button-danger\/80:hover{color:color-mix(in oklab, var(--color-button-danger) 80%, transparent)}}.hover\:text-button-ghost-text--hover:hover{color:var(--color-button-ghost-text--hover)}.hover\:text-button-outline-text--hover:hover{color:var(--color-button-outline-text--hover)}.hover\:text-button-primary-text--hover:hover{color:var(--color-button-primary-text--hover)}.hover\:text-button-secondary-text--hover:hover{color:var(--color-button-secondary-text--hover)}.hover\:text-neutral-100:hover{color:var(--color-neutral-100)}.hover\:text-text-primary:hover{color:var(--color-text-primary)}.hover\:text-text-secondary:hover{color:var(--color-text-secondary)}.hover\:text-toggle-text--hover:hover{color:var(--color-toggle-text--hover)}.hover\:no-underline:hover{text-decoration-line:none}.hover\:opacity-80:hover{opacity:.8}.hover\:opacity-100:hover{opacity:1}.hover\:opacity-100\!:hover{opacity:1!important}.hover\:ring-4:hover{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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)}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:border-toggle-border--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{border-color:var(--color-toggle-border--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:bg-toggle-bg--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{background-color:var(--color-toggle-bg--active)!important}.peer-data-\[state\=on\]\/spectral-split-menu\:hover\:text-toggle-text--active\!:is(:where(.peer\/spectral-split-menu)[data-state=on]~*):hover{color:var(--color-toggle-text--active)!important}}.focus\:z-10:focus{z-index:10}.focus\:scale-95:focus{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.focus\:border-danger-400:focus{border-color:var(--color-danger-400)}.focus\:border-input-border--focus:focus{border-color:var(--color-input-border--focus)}.focus\:border-warning-400:focus{border-color:var(--color-warning-400)}.focus\:text-text-primary:focus{color:var(--color-text-primary)}.focus\:ring-1:focus{--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)}.focus\:ring-accent:focus{--tw-ring-color:var(--color-accent)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:z-10:focus-visible{z-index:10}.focus-visible\:border-accent:focus-visible{border-color:var(--color-accent)}.focus-visible\:border-input-border--focus:focus-visible{border-color:var(--color-input-border--focus)}.focus-visible\:bg-input-bg--hover:focus-visible{background-color:var(--color-input-bg--hover)}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:ring-0:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + 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)}.focus-visible\:ring-1:focus-visible{--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)}.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)}.focus-visible\:ring-4:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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)}.focus-visible\:ring-accent:focus-visible{--tw-ring-color:var(--color-accent)}.focus-visible\:ring-black:focus-visible{--tw-ring-color:var(--color-black)}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.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)}.focus-visible\:ring-offset-background:focus-visible{--tw-ring-offset-color:var(--color-background)}.focus-visible\:outline:focus-visible,.focus-visible\:outline-1:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-offset-1:focus-visible{outline-offset:1px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-accent:focus-visible{outline-color:var(--color-accent)}.focus-visible\:outline-badge-destructive-border:focus-visible{outline-color:var(--color-badge-destructive-border)}.focus-visible\:outline-button-danger:focus-visible{outline-color:var(--color-button-danger)}.focus-visible\:outline-button-outline-border:focus-visible{outline-color:var(--color-button-outline-border)}.focus-visible\:outline-button-primary-border:focus-visible{outline-color:var(--color-button-primary-border)}.focus-visible\:outline-button-secondary-border:focus-visible{outline-color:var(--color-button-secondary-border)}.focus-visible\:outline-checkbox-border--focus:focus-visible{outline-color:var(--color-checkbox-border--focus)}.focus-visible\:outline-danger-400:focus-visible{outline-color:var(--color-danger-400)}.focus-visible\:outline-input-border--focus:focus-visible{outline-color:var(--color-input-border--focus)}.focus-visible\:outline-level-three:focus-visible{outline-color:var(--color-level-three)}.focus-visible\:outline-text-secondary:focus-visible{outline-color:var(--color-text-secondary)}.focus-visible\:outline-warning-400:focus-visible{outline-color:var(--color-warning-400)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-100:active{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-\[0\.97\]:active{scale:.97}.active\:border-toggle-border--active:active{border-color:var(--color-toggle-border--active)}.active\:bg-accent:active{background-color:var(--color-accent)}.active\:bg-toggle-bg--active:active{background-color:var(--color-toggle-bg--active)}.active\:text-text-inverted:active{color:var(--color-text-inverted)}.active\:text-toggle-text--active:active{color:var(--color-toggle-text--active)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:border-button-outline-border--disabled:disabled{border-color:var(--color-button-outline-border--disabled)}.disabled\:border-button-primary-border--disabled:disabled{border-color:var(--color-button-primary-border--disabled)}.disabled\:border-button-secondary-border--disabled:disabled{border-color:var(--color-button-secondary-border--disabled)}.disabled\:border-input-border--disabled:disabled{border-color:var(--color-input-border--disabled)}.disabled\:bg-button-primary-bg--disabled:disabled{background-color:var(--color-button-primary-bg--disabled)}.disabled\:bg-button-secondary-bg--disabled:disabled{background-color:var(--color-button-secondary-bg--disabled)}.disabled\:bg-input-bg--disabled:disabled{background-color:var(--color-input-bg--disabled)}.disabled\:text-button-ghost-text--disabled:disabled{color:var(--color-button-ghost-text--disabled)}.disabled\:text-button-outline-text--disabled:disabled{color:var(--color-button-outline-text--disabled)}.disabled\:text-button-primary-text--disabled:disabled{color:var(--color-button-primary-text--disabled)}.disabled\:text-button-secondary-text--disabled:disabled{color:var(--color-button-secondary-text--disabled)}.disabled\:text-input-text--disabled:disabled{color:var(--color-input-text--disabled)}.disabled\:text-text-secondary:disabled{color:var(--color-text-secondary)}.disabled\:opacity-50:disabled{opacity:.5}@media (hover:hover){.disabled\:hover\:bg-level-one:disabled:hover{background-color:var(--color-level-one)}.disabled\:hover\:bg-transparent:disabled:hover{background-color:#0000}.disabled\:hover\:text-text-primary:disabled:hover{color:var(--color-text-primary)}}.disabled\:active\:scale-100:disabled:active{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}:where([data-orientation=horizontal]) .in-data-\[orientation\=horizontal\]\:p-4{padding:calc(var(--spacing) * 4)}:where([data-slot=tooltip-content]) .in-data-\[slot\=tooltip-content\]\:bg-level-three{background-color:var(--color-level-three)}.has-\[\[data-slot\=dialog-footer\]\]\:pb-0:has([data-slot=dialog-footer]){padding-bottom:calc(var(--spacing) * 0)}.has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:outline-0:has([data-slot=input-group-control]:focus-visible){outline-style:var(--tw-outline-style);outline-width:0}.has-\[disabled\]\:opacity-50:has(:is(disabled)){opacity:.5}.has-\[\>\[data-slot\=button-group\]\]\:gap-2:has(>[data-slot=button-group]){gap:calc(var(--spacing) * 2)}.has-\[\>svg\]\:px-2\.5:has(>svg){padding-inline:calc(var(--spacing) * 2.5)}.has-\[\>svg\]\:px-3:has(>svg){padding-inline:calc(var(--spacing) * 3)}.has-\[\>svg\]\:px-4:has(>svg){padding-inline:calc(var(--spacing) * 4)}.aria-invalid\:border-danger-200[aria-invalid=true]{border-color:var(--color-danger-200)}.aria-invalid\:outline-danger-200\/20[aria-invalid=true]{outline-color:var(--color-danger-200)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:outline-danger-200\/20[aria-invalid=true]{outline-color:color-mix(in oklab, var(--color-danger-200) 20%, transparent)}}.aria-pressed\:border-toggle-border--active[aria-pressed=true]{border-color:var(--color-toggle-border--active)}.aria-pressed\:bg-toggle-bg--active[aria-pressed=true]{background-color:var(--color-toggle-bg--active)}.aria-pressed\:text-toggle-text--active[aria-pressed=true]{color:var(--color-toggle-text--active)}.data-disabled\:opacity-50[data-disabled]{opacity:.5}.data-highlighted\:bg-input-bg--hover[data-highlighted]{background-color:var(--color-input-bg--hover)}.data-placeholder\:text-input-text-placeholder\![data-placeholder]{color:var(--color-input-text-placeholder)!important}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:cursor-not-allowed[data-disabled]{cursor:not-allowed}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[expanded\=true\]\:w-full[data-expanded=true],.data-\[layout\=\'expanded\'\]\:w-full[data-layout=expanded]{width:100%}.data-\[orientation\=horizontal\]\:h-1\.5[data-orientation=horizontal]{height:calc(var(--spacing) * 1.5)}.data-\[orientation\=horizontal\]\:h-full[data-orientation=horizontal]{height:100%}.data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.data-\[orientation\=vertical\]\:flex[data-orientation=vertical]{display:flex}.data-\[orientation\=vertical\]\:h-auto[data-orientation=vertical]{height:auto}.data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.data-\[orientation\=vertical\]\:min-h-44[data-orientation=vertical]{min-height:calc(var(--spacing) * 44)}.data-\[orientation\=vertical\]\:w-1\.5[data-orientation=vertical]{width:calc(var(--spacing) * 1.5)}.data-\[orientation\=vertical\]\:w-auto[data-orientation=vertical]{width:auto}.data-\[orientation\=vertical\]\:w-full[data-orientation=vertical]{width:100%}.data-\[orientation\=vertical\]\:flex-col[data-orientation=vertical]{flex-direction:column}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:calc(var(--spacing) * 1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[size\=lg\]\:min-w-7[data-size=lg]{min-width:calc(var(--spacing) * 7)}.data-\[size\=lg\]\:px-1\.5[data-size=lg]{padding-inline:calc(var(--spacing) * 1.5)}.data-\[size\=sm\]\:min-w-5[data-size=sm]{min-width:calc(var(--spacing) * 5)}.data-\[size\=sm\]\:px-0\.5[data-size=sm]{padding-inline:calc(var(--spacing) * .5)}.data-\[state\=active\]\:text-accent[data-state=active]{color:var(--color-accent)}.data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:translate-x-\[26px\][data-state=checked]{--tw-translate-x:26px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-checkbox-border--checked[data-state=checked]{border-color:var(--color-checkbox-border--checked)}.data-\[state\=checked\]\:border-radio-border--selected[data-state=checked]{border-color:var(--color-radio-border--selected)}.data-\[state\=checked\]\:bg-radio-bg[data-state=checked]{background-color:var(--color-radio-bg)}.data-\[state\=checked\]\:bg-switch-bg--checked[data-state=checked]{background-color:var(--color-switch-bg--checked)}.data-\[state\=checked\]\:bg-switch-thumb[data-state=checked]{background-color:var(--color-switch-thumb)}.data-\[state\=on\]\:border-toggle-border--active[data-state=on]{border-color:var(--color-toggle-border--active)}.data-\[state\=on\]\:bg-toggle-bg--active[data-state=on]{background-color:var(--color-toggle-bg--active)}.data-\[state\=on\]\:text-toggle-text--active[data-state=on]{color:var(--color-toggle-text--active)}.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:var(--color-accent)}.data-\[state\=open\]\:text-text-primary[data-state=open]{color:var(--color-text-primary)}.data-\[state\=unchecked\]\:bg-switch-bg[data-state=unchecked],.data-\[state\=unchecked\]\:bg-switch-bg\/50[data-state=unchecked]{background-color:var(--color-switch-bg)}@supports (color:color-mix(in lab, red, red)){.data-\[state\=unchecked\]\:bg-switch-bg\/50[data-state=unchecked]{background-color:color-mix(in oklab, var(--color-switch-bg) 50%, transparent)}}.data-\[variant\=\'divided\'\]\:gap-0[data-variant=divided]{gap:calc(var(--spacing) * 0)}.data-\[variant\=\'divided\'\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=divided]{--color-toggle-border:var(--color-toggle-outline-border)}.data-\[variant\=\'outline\'\]\:gap-0[data-variant=outline]{gap:calc(var(--spacing) * 0)}.data-\[variant\=\'outline\'\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=outline]{--color-toggle-border:var(--color-toggle-outline-border)}.data-\[variant\=\'separated\'\]\:gap-1\.5[data-variant=separated]{gap:calc(var(--spacing) * 1.5)}.data-\[size\=\'lg\'\]\:data-\[variant\=\'separated\'\]\:gap-2[data-size=lg][data-variant=separated]{gap:calc(var(--spacing) * 2)}.data-\[size\=\'sm\'\]\:data-\[variant\=\'separated\'\]\:gap-1[data-size=sm][data-variant=separated]{gap:calc(var(--spacing) * 1)}.data-\[variant\=divided\]\:gap-0[data-variant=divided]{gap:calc(var(--spacing) * 0)}.data-\[variant\=divided\]\:border-toggle-border[data-variant=divided]{border-color:var(--color-toggle-border)}.data-\[variant\=divided\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=divided]{--color-toggle-border:var(--color-toggle-outline-border)}@media (hover:hover){.data-\[variant\=divided\]\:hover\:border-toggle-border[data-variant=divided]:hover{border-color:var(--color-toggle-border)}}.data-\[variant\=divided\]\:data-\[state\=on\]\:border-toggle-border--active[data-variant=divided][data-state=on]{border-color:var(--color-toggle-border--active)}@media (hover:hover){.data-\[variant\=divided\]\:data-\[state\=on\]\:hover\:border-toggle-border--active[data-variant=divided][data-state=on]:hover{border-color:var(--color-toggle-border--active)}}.data-\[variant\=outline\]\:gap-0[data-variant=outline]{gap:calc(var(--spacing) * 0)}.data-\[variant\=outline\]\:border-toggle-border[data-variant=outline]{border-color:var(--color-toggle-border)}.data-\[variant\=outline\]\:\[--color-toggle-border\:var\(--color-toggle-outline-border\)\][data-variant=outline]{--color-toggle-border:var(--color-toggle-outline-border)}@media (hover:hover){.data-\[variant\=outline\]\:hover\:border-toggle-border[data-variant=outline]:hover{border-color:var(--color-toggle-border)}}.data-\[variant\=outline\]\:data-\[state\=on\]\:border-toggle-border--active[data-variant=outline][data-state=on]{border-color:var(--color-toggle-border--active)}@media (hover:hover){.data-\[variant\=outline\]\:data-\[state\=on\]\:hover\:border-toggle-border--active[data-variant=outline][data-state=on]:hover{border-color:var(--color-toggle-border--active)}}.data-\[variant\=separated\]\:rounded-md[data-variant=separated]{border-radius:var(--radius-md)}.data-\[variant\=separated\]\:border-toggle-border[data-variant=separated]{border-color:var(--color-toggle-border)}@media (hover:hover){.data-\[variant\=separated\]\:hover\:border-toggle-border--hover[data-variant=separated]:hover{border-color:var(--color-toggle-border--hover)}}.data-\[variant\=separated\]\:data-\[state\=on\]\:border-toggle-border--active[data-variant=separated][data-state=on]{border-color:var(--color-toggle-border--active)}.data-\[variant\=separated\]\:data-\[state\=on\]\:bg-toggle-bg--active[data-variant=separated][data-state=on]{background-color:var(--color-toggle-bg--active)}@media (hover:hover){.data-\[variant\=separated\]\:data-\[state\=on\]\:hover\:border-toggle-border--active[data-variant=separated][data-state=on]:hover{border-color:var(--color-toggle-border--active)}.data-\[variant\=separated\]\:data-\[state\=on\]\:hover\:bg-toggle-bg--active[data-variant=separated][data-state=on]:hover{background-color:var(--color-toggle-bg--active)}}@media (prefers-reduced-motion:no-preference){.motion-safe\:animate-caret-blink{animation:var(--animate-caret-blink)}.motion-safe\:animate-pulse{animation:var(--animate-pulse)}.motion-safe\:animate-spin{animation:var(--animate-spin)}.motion-safe\:duration-200{--tw-duration:.2s;transition-duration:.2s}.motion-safe\:animate-in{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:duration-200{animation-duration:.2s}.motion-safe\:fade-in{--tw-enter-opacity:0}.motion-safe\:slide-in-from-top-full{--tw-enter-translate-y:-100%}.motion-safe\:data-closed\:animate-out[data-closed]{--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial;animation-name:exit;animation-duration:.15s}.motion-safe\:data-closed\:fade-out-0[data-closed]{--tw-exit-opacity:0}.motion-safe\:data-closed\:zoom-out-95[data-closed]{--tw-exit-scale:.95}.motion-safe\:data-open\:animate-in[data-open]{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:data-open\:fade-in-0[data-open]{--tw-enter-opacity:0}.motion-safe\:data-open\:zoom-in-95[data-open]{--tw-enter-scale:.95}.motion-safe\:data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-.5rem}.motion-safe\:data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:.5rem}.motion-safe\:data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:-.5rem}.motion-safe\:data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:.5rem}.motion-safe\:data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:var(--animate-accordion-up)}.motion-safe\:data-\[state\=closed\]\:animate-out[data-state=closed]{--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial;animation-name:exit;animation-duration:.15s}.motion-safe\:data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.motion-safe\:data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.motion-safe\:data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:var(--animate-accordion-down)}.motion-safe\:data-\[state\=open\]\:duration-200[data-state=open]{--tw-duration:.2s;transition-duration:.2s}.motion-safe\:data-\[state\=open\]\:animate-in[data-state=open]{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.motion-safe\:data-\[state\=open\]\:duration-200[data-state=open]{animation-duration:.2s}.motion-safe\:data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.motion-safe\:data-\[state\=open\]\:slide-in-from-bottom-20[data-state=open]{--tw-enter-translate-y:5rem}.motion-safe\:data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.motion-safe\:data-\[state\=open\]\:zoom-in-100\![data-state=open]{--tw-enter-scale:1!important}}@media (prefers-reduced-motion:reduce){.motion-reduce\:translate-x-0{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.motion-reduce\:transition-none{transition-property:none}.motion-reduce\:duration-0{--tw-duration:0s;transition-duration:0s;animation-duration:0s}}@media (min-width:40rem){.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:text-left{text-align:left}@media not all and (min-width:48rem){.sm\:max-md\:max-w-full{max-width:100%}}}@media (min-width:48rem){.md\:font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.md\:font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}}.peer-data-\[state\=checked\]\:rtl\:translate-x-full:is(:where(.peer)[data-state=checked]~*):where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.peer-data-\[state\=unchecked\]\:rtl\:-translate-x-6:is(:where(.peer)[data-state=unchecked]~*):where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:calc(var(--spacing) * -6);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:rtl\:-translate-x-4[data-state=checked]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:calc(var(--spacing) * -4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:rtl\:translate-x-\[-26px\][data-state=checked]:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-translate-x:-26px;translate:var(--tw-translate-x) var(--tw-translate-y)}.\[\&_\*\]\:min-w-0 *{min-width:calc(var(--spacing) * 0)}.data-\[variant\=\'divided\'\]\:\[\&_button\]\:border-y-0[data-variant=divided] button,.data-\[variant\=divided\]\:\[\&_button\]\:border-y-0[data-variant=divided] button{border-block-style:var(--tw-border-style);border-block-width:0}.\[\&_button\:first-of-type\]\:rounded-l-md button:first-of-type{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.data-\[variant\=\'divided\'\]\:\[\&_button\:first-of-type\]\:border-l-0[data-variant=divided] button:first-of-type,.data-\[variant\=divided\]\:\[\&_button\:first-of-type\]\:border-l-0[data-variant=divided] button:first-of-type{border-left-style:var(--tw-border-style);border-left-width:0}.\[\&_button\:last-of-type\]\:rounded-r-md button:last-of-type{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.data-\[variant\=\'divided\'\]\:\[\&_button\:last-of-type\]\:border-r-0[data-variant=divided] button:last-of-type,.data-\[variant\=divided\]\:\[\&_button\:last-of-type\]\:border-r-0[data-variant=divided] button:last-of-type{border-right-style:var(--tw-border-style);border-right-width:0}.data-\[variant\=\'divided\'\]\:\[\&_button\:not\(\:first-of-type\)\]\:border-l-0[data-variant=divided] button:not(:first-of-type),.data-\[variant\=\'outline\'\]\:\[\&_button\:not\(\:first-of-type\)\]\:border-l-0[data-variant=outline] button:not(:first-of-type){border-left-style:var(--tw-border-style);border-left-width:0}.data-\[variant\=\'divided\'\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=divided] button:not(:last-of-type),.data-\[variant\=\'outline\'\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=outline] button:not(:last-of-type),.data-\[variant\=divided\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=divided] button:not(:last-of-type),.data-\[variant\=outline\]\:\[\&_button\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-outline-divider\)\][data-variant=outline] button:not(:last-of-type){border-right-color:var(--color-toggle-outline-divider)}.data-\[variant\=\'divided\'\]\:\[\&_button\[data-state\=\'on\'\]\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-border--active\)\][data-variant=divided] button[data-state=on]:not(:last-of-type),.data-\[variant\=\'outline\'\]\:\[\&_button\[data-state\=\'on\'\]\:not\(\:last-of-type\)\]\:\[border-right-color\:var\(--color-toggle-border--active\)\][data-variant=outline] button[data-state=on]:not(:last-of-type){border-right-color:var(--color-toggle-border--active)}.\[\&_p\]\:leading-relaxed p{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.\[\&_p\]\:text-alert-danger-text p{color:var(--color-alert-danger-text)}.\[\&_p\]\:text-alert-info-text p{color:var(--color-alert-info-text)}.\[\&_p\]\:text-alert-success-text p{color:var(--color-alert-success-text)}.\[\&_p\]\:text-alert-text p{color:var(--color-alert-text)}.\[\&_p\]\:text-alert-warning-text p{color:var(--color-alert-warning-text)}.\[\&_span\]\:rounded-\[4px\] span{border-radius:4px}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3 svg:not([class*=size-]){width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-3 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-4 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\:not\(\[width\]\)\:not\(\[height\]\)\]\:size-5 svg:not([class*=size-]):not([width]):not([height]){width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&\:\:-webkit-inner-spin-button\]\:appearance-none::-webkit-inner-spin-button{appearance:none}.\[\&\:\:-webkit-outer-spin-button\]\:appearance-none::-webkit-outer-spin-button{appearance:none}.\[\&\:not\(\:first-child\)\]\:border-l-0:not(:first-child){border-left-style:var(--tw-border-style);border-left-width:0}.\[\&\>\*\]\:min-w-0>*{min-width:calc(var(--spacing) * 0)}.\[\&\>\*\]\:focus-visible\:relative>:focus-visible{position:relative}.\[\&\>\*\]\:focus-visible\:z-10>:focus-visible{z-index:10}.\[\&\>\*\:last-child\]\:-ms-0\.5>:last-child{margin-inline-start:calc(var(--spacing) * -.5)}.\[\&\>\*\:last-child\]\:-mt-0\.5>:last-child{margin-top:calc(var(--spacing) * -.5)}.\[\&\>\*\:not\(\:first-child\)\]\:rounded-t-none>:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.\[\&\>\*\:not\(\:first-child\)\]\:rounded-l-none>:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.\[\&\>\*\:not\(\:first-child\)\]\:border-t-0>:not(:first-child){border-top-style:var(--tw-border-style);border-top-width:0}.\[\&\>\*\:not\(\:first-child\)\]\:border-l-0>:not(:first-child){border-left-style:var(--tw-border-style);border-left-width:0}.\[\&\>\*\:not\(\:last-child\)\]\:rounded-r-none>:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.\[\&\>\*\:not\(\:last-child\)\]\:rounded-b-none>:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0}.data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\]\:border-y-0[data-variant=divided]>[data-slot=button-group-item]{border-block-style:var(--tw-border-style);border-block-width:0}.data-\[orientation\=\'vertical\'\]\:data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\]\:border-x-0[data-orientation=vertical][data-variant=divided]>[data-slot=button-group-item]{border-inline-style:var(--tw-border-style);border-inline-width:0}.data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\:first-of-type\]\:border-l-0[data-variant=divided]>[data-slot=button-group-item]:first-of-type{border-left-style:var(--tw-border-style);border-left-width:0}.data-\[orientation\=\'vertical\'\]\:data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\:first-of-type\]\:border-t-0[data-orientation=vertical][data-variant=divided]>[data-slot=button-group-item]:first-of-type{border-top-style:var(--tw-border-style);border-top-width:0}.data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\:last-of-type\]\:border-r-0[data-variant=divided]>[data-slot=button-group-item]:last-of-type{border-right-style:var(--tw-border-style);border-right-width:0}.data-\[orientation\=\'vertical\'\]\:data-\[variant\=\'divided\'\]\:\[\&\>\[data-slot\=button-group-item\]\:last-of-type\]\:border-b-0[data-orientation=vertical][data-variant=divided]>[data-slot=button-group-item]:last-of-type{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.has-\[select\[aria-hidden\=true\]\:last-child\]\:\[\&\>\[data-slot\=select-trigger\]\:last-of-type\]\:rounded-r-md:has(:is(select[aria-hidden=true]:last-child))>[data-slot=select-trigger]:last-of-type{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.\[\&\>\[data-slot\=select-trigger\]\:not\(\[class\*\=\'w-\'\]\)\]\:w-fit>[data-slot=select-trigger]:not([class*=w-]){width:fit-content}.\[\&\>input\]\:flex-1>input{flex:1}.\[\&\>span\]\:block>span{display:block}.\[\&\>span\]\:min-w-0>span{min-width:calc(var(--spacing) * 0)}.\[\&\>span\]\:overflow-hidden>span{overflow:hidden}.\[\&\>span\]\:text-ellipsis>span{text-overflow:ellipsis}.\[\&\>span\]\:whitespace-nowrap>span{white-space:nowrap}.\[\&\>span\[data-placeholder\]\]\:text-input-text-placeholder\!>span[data-placeholder]{color:var(--color-input-text-placeholder)!important}.\[\&\>svg\]\:pointer-events-none>svg{pointer-events:none}.\[\&\>svg\]\:size-3>svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&\>svg\]\:size-6>svg{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.\[\&\>svg\]\:shrink-0>svg{flex-shrink:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}@media (hover:hover){a.\[a\&\]\:hover\:bg-accent:hover{background-color:var(--color-accent)}a.\[a\&\]\:hover\:bg-badge-primary-bg--hover:hover{background-color:var(--color-badge-primary-bg--hover)}a.\[a\&\]\:hover\:bg-danger-400:hover{background-color:var(--color-danger-400)}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0) scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0) scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}@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-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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-tracking{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-outline-style{syntax:"*";inherits:false;initial-value:solid}@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}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}
4
4
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spear-ai/spectral",
3
- "version": "1.15.4",
3
+ "version": "1.15.6",
4
4
  "type": "module",
5
5
  "private": false,
6
6
  "engines": {