/* current theme */
html:root {
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
  --radius: 0.625rem;
  --shadow-opacity: 0.1;
  --shadow-blur: 1px;
  --shadow-spread: 0px;
  --shadow-offset-x: 0;
  --shadow-offset-y: 2px;
  --letter-spacing: 0em;
  --spacing: 0.25rem;
  --background: oklch(1 0 0);
  --foreground: oklch(0.2000 0.0440 250);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.2000 0.0440 250);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.2000 0.0440 250);
  --primary: oklch(0.2000 0.0440 250);
  --primary-foreground: oklch(1 0 0);
  --secondary: oklch(0.9500 0.0030 248);
  --secondary-foreground: oklch(0.4500 0.0400 251);
  --muted: oklch(0.9700 0.0040 250);
  --muted-foreground: oklch(0.5500 0.0200 250);
  --accent: oklch(0.6235 0.2343 250);
  --accent-foreground: oklch(1 0 0);
  --destructive: oklch(0.5770 0.2450 27.3250);
  --destructive-foreground: oklch(1 0 0);
  --border: oklch(0.9200 0.0200 250);
  --input: oklch(0.9200 0.0040 250);
  --ring: oklch(0.6235 0.2343 250);
  --chart-1: oklch(0.8090 0.0990 251.8000);
  --chart-2: oklch(0.6210 0.1890 259.9000);
  --chart-3: oklch(0.5490 0.2200 263.1000);
  --chart-4: oklch(0.4890 0.2200 264);
  --chart-5: oklch(0.4210 0.1790 266);
  --shadow-color: oklch(0.0250 0.3300 250);
  --shadow-2xs: 0.1px 0.7px 0.5px -0.3px oklch(0.0250 0.3300 250 / 7.6500%);
  --shadow-xs: 0.2px 1.2px 0.5px -0.5px oklch(0.0250 0.3300 250 / 7.4093%), 0.1px 0.6px 2px -0.7px oklch(0.0250 0.3300 250 / 2.4407%);
  --shadow-sm: 0.5px 3px 1.7px -1.4px oklch(0.0250 0.3300 250 / 6.6041%), 0.2px 1.5px 2.3px -1.7px oklch(0.0250 0.3300 250 / 2.2199%);
  --shadow: 0.3px 2px 1px -0.9px oklch(0.0250 0.3300 250 / 7.0400%), 0.2px 1px 2px -1.1px oklch(0.0250 0.3300 250 / 2.3400%);
  --shadow-md: 0.5px 3px 1.7px -1.4px oklch(0.0250 0.3300 250 / 6.6041%), 0.4px 2.4px 1.9px -1px oklch(0.0250 0.3300 250 / 2.9884%), 0.2px 1.5px 2.3px -1.7px oklch(0.0250 0.3300 250 / 2.2199%);
  --shadow-lg: 0.7px 4px 2.5px -1.8px oklch(0.0250 0.3300 250 / 6.1952%), 0.5px 3.2px 3px -1.4px oklch(0.0250 0.3300 250 / 2.8350%), 0.3px 2px 4px -2.2px oklch(0.0250 0.3300 250 / 2.1060%);
  --shadow-xl: 0.9px 5.6px 4px -2.5px oklch(0.0250 0.3300 250 / 5.5930%), 0.7px 4.5px 5.2px -2px oklch(0.0250 0.3300 250 / 2.6058%), 0.5px 2.8px 7.8px -3.1px oklch(0.0250 0.3300 250 / 1.9358%);
  --shadow-2xl: 1.2px 7.2px 5.6px -3.2px oklch(0.0250 0.3300 250 / 5.0493%), 0.9px 5.8px 7.8px -2.5px oklch(0.0250 0.3300 250 / 2.3952%), 0.6px 3.6px 13px -4px oklch(0.0250 0.3300 250 / 1.7793%);
}

html[data-theme="dark"], html.dark {
  --background: oklch(0.2000 0.0200 250);
  --foreground: oklch(0.9700 0.0200 250);
  --card: oklch(0.2250 0.0200 250);
  --card-foreground: oklch(0.9700 0 0);
  --popover: oklch(0.2200 0.0200 250);
  --popover-foreground: oklch(0.9700 0 0);
  --primary: oklch(0.9700 0 0);
  --primary-foreground: oklch(0.2000 0.0440 250);
  --secondary: oklch(0.3200 0.0440 250);
  --secondary-foreground: oklch(0.9700 0.0200 250);
  --muted: oklch(0.2560 0.0200 250);
  --muted-foreground: oklch(0.7080 0.0200 250);
  --accent: oklch(0.6235 0.2343 250);
  --accent-foreground: oklch(0.9850 0 0);
  --destructive: oklch(0.7040 0.1910 22.2160);
  --destructive-foreground: oklch(0.9850 0 0);
  --border: oklch(0.3000 0.0330 250);
  --input: oklch(0.4000 0.0330 250);
  --ring: oklch(0.6235 0.2343 250);
  --chart-1: oklch(0.8090 0.0990 251.8000);
  --chart-2: oklch(0.6210 0.1890 259.9000);
  --chart-3: oklch(0.5490 0.2200 263.1000);
  --chart-4: oklch(0.4890 0.2200 264);
  --chart-5: oklch(0.4210 0.1790 266);
  --sidebar: oklch(0.2050 0 0);
  --sidebar-foreground: oklch(0.9850 0 0);
  --sidebar-primary: oklch(0.4880 0.2430 264.3760);
  --sidebar-primary-foreground: oklch(0.9850 0 0);
  --sidebar-accent: oklch(0.2690 0 0);
  --sidebar-accent-foreground: oklch(0.9850 0 0);
  --sidebar-border: oklch(0.2750 0 0);
  --sidebar-ring: oklch(0.4390 0 0);
  --shadow-color: oklch(0 0 0);
  --shadow-2xs: 0.1px 0.3px 0.6px 0px oklch(0 0 0 / 15.6442%);
  --shadow-xs: 0.1px 0.6px 1.2px -0.3px oklch(0 0 0 / 15.1521%), 0.1px 0.5px 2px -0.4px oklch(0 0 0 / 4.9913%);
  --shadow-sm: 0.2px 1.5px 4.2px -1.1px oklch(0 0 0 / 13.5054%), 0.1px 0.8px 5.5px -1.4px oklch(0 0 0 / 4.5397%);
  --shadow: 0.2px 1px 2.4px -0.6px oklch(0 0 0 / 14.3968%), 0.1px 0.5px 2.4px -0.8px oklch(0 0 0 / 4.7853%);
  --shadow-md: 0.2px 1.5px 4.2px -1.1px oklch(0 0 0 / 13.5054%), 0.2px 1.2px 4.6px -0.8px oklch(0 0 0 / 6.1112%), 0.1px 0.8px 5.5px -1.4px oklch(0 0 0 / 4.5397%);
  --shadow-lg: 0.3px 2px 6.2px -1.5px oklch(0 0 0 / 12.6692%), 0.3px 1.6px 7.3px -1.1px oklch(0 0 0 / 5.7976%), 0.2px 1px 9.7px -1.9px oklch(0 0 0 / 4.3068%);
  --shadow-xl: 0.5px 2.8px 9.7px -2.2px oklch(0 0 0 / 11.4376%), 0.4px 2.2px 12.6px -1.7px oklch(0 0 0 / 5.3289%), 0.2px 1.4px 19px -2.8px oklch(0 0 0 / 3.9586%);
  --shadow-2xl: 0.6px 3.6px 13.7px -3px oklch(0 0 0 / 10.3257%), 0.5px 2.9px 18.8px -2.2px oklch(0 0 0 / 4.8982%), 0.3px 1.8px 31.4px -3.7px oklch(0 0 0 / 3.6386%);
}

/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
@layer properties;
@property --tw-animation-delay {
  syntax: "*";
  inherits: false;
  initial-value: 0s;
}
@property --tw-animation-direction {
  syntax: "*";
  inherits: false;
  initial-value: normal;
}
@property --tw-animation-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-animation-fill-mode {
  syntax: "*";
  inherits: false;
  initial-value: none;
}
@property --tw-animation-iteration-count {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-enter-blur {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-enter-opacity {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-enter-rotate {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-enter-scale {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-enter-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-enter-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-exit-blur {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-exit-opacity {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-exit-rotate {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-exit-scale {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-exit-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-exit-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer base, starlight.reset, starlight, bejamas, theme, components, utilities;
@layer components {
  .cn-accordion-item {
    &:not(*:last-child) {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
  }
  .cn-accordion-trigger {
    border-radius: calc(var(--radius) - 2px);
    padding-block: calc(var(--spacing, 0.25rem) * 4);
    text-align: left;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &:focus-visible {
      &::after {
        content: var(--tw-content);
        border-color: var(--ring);
      }
    }
    :is(& *) {
      &[data-slot="accordion-trigger-icon"] {
        margin-left: auto;
      }
    }
    :is(& *) {
      &[data-slot="accordion-trigger-icon"] {
        width: calc(var(--spacing, 0.25rem) * 4);
        height: calc(var(--spacing, 0.25rem) * 4);
      }
    }
    :is(& *) {
      &[data-slot="accordion-trigger-icon"] {
        color: var(--muted-foreground);
      }
    }
  }
  .cn-accordion-content {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: accordion-down var(--tw-animation-duration,var(--tw-duration,.2s))var(--tw-ease,ease-out)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: accordion-up var(--tw-animation-duration,var(--tw-duration,.2s))var(--tw-ease,ease-out)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
  }
  .cn-accordion-content-inner {
    padding-top: calc(var(--spacing, 0.25rem) * 0);
    padding-bottom: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-alert-dialog-overlay {
    background-color: color-mix(in srgb, #000 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 10%, transparent);
    }
    --tw-duration: 100ms;
    transition-duration: 100ms;
    @supports (backdrop-filter: var(--tw)) {
      --tw-backdrop-blur: blur(var(--blur-xs, 4px));
      -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,);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
  }
  .cn-alert-dialog-content {
    gap: calc(var(--spacing, 0.25rem) * 6);
    border-radius: calc(var(--radius) + 4px);
    background-color: var(--background);
    padding: calc(var(--spacing, 0.25rem) * 6);
    --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);
    --tw-ring-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-size="default"] {
      max-width: var(--container-xs, 20rem);
    }
    &[data-size="sm"] {
      max-width: var(--container-xs, 20rem);
    }
    &[data-size="default"] {
      @media (width >= 40rem) {
        max-width: var(--container-lg, 32rem);
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-alert-dialog-header {
    display: grid;
    grid-template-rows: auto 1fr;
    place-items: center;
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    text-align: center;
    &:has(*[data-slot="alert-dialog-media"]) {
      grid-template-rows: auto auto 1fr;
    }
    &:has(*[data-slot="alert-dialog-media"]) {
      column-gap: calc(var(--spacing, 0.25rem) * 6);
    }
    @media (width >= 40rem) {
      &:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
        place-items: start;
      }
    }
    @media (width >= 40rem) {
      &:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
        text-align: left;
      }
    }
    @media (width >= 40rem) {
      &:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
        &:has(*[data-slot="alert-dialog-media"]) {
          grid-template-rows: auto 1fr;
        }
      }
    }
  }
  .cn-alert-dialog-media {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
    display: inline-flex;
    width: calc(var(--spacing, 0.25rem) * 16);
    height: calc(var(--spacing, 0.25rem) * 16);
    align-items: center;
    justify-content: center;
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--muted);
    @media (width >= 40rem) {
      &:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
        grid-row: span 2 / span 2;
      }
    }
    :is(& > *) {
      &:is(svg:not([class*='size-'])) {
        width: calc(var(--spacing, 0.25rem) * 8);
        height: calc(var(--spacing, 0.25rem) * 8);
      }
    }
  }
  .cn-alert-dialog-title {
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    @media (width >= 40rem) {
      &:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
        &:is(:where(.group\/alert-dialog-content):has(*[data-slot="alert-dialog-media"]) *) {
          grid-column-start: 2;
        }
      }
    }
  }
  .cn-alert-dialog-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    text-wrap: balance;
    color: var(--muted-foreground);
    @media (width >= 48rem) {
      text-wrap: pretty;
    }
    :is(& > *) {
      &:is(a) {
        text-decoration-line: underline;
      }
    }
    :is(& > *) {
      &:is(a) {
        text-underline-offset: 3px;
      }
    }
    :is(& > *) {
      &:is(a) {
        &:hover {
          @media (hover: hover) {
            color: var(--foreground);
          }
        }
      }
    }
  }
  .cn-alert {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 0.5);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    text-align: left;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:has(*[data-slot="alert-action"]) {
      position: relative;
    }
    &:has(*[data-slot="alert-action"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 18);
    }
    &:has(>svg) {
      grid-template-columns: auto 1fr;
    }
    &:has(>svg) {
      column-gap: calc(var(--spacing, 0.25rem) * 2.5);
    }
    :is(& > *) {
      &:is(svg) {
        grid-row: span 2 / span 2;
      }
    }
    :is(& > *) {
      &:is(svg) {
        --tw-translate-y: calc(var(--spacing, 0.25rem) * 0.5);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    :is(& > *) {
      &:is(svg) {
        color: currentcolor;
      }
    }
    :is(& > *) {
      &:is(svg:not([class*='size-'])) {
        width: calc(var(--spacing, 0.25rem) * 4);
        height: calc(var(--spacing, 0.25rem) * 4);
      }
    }
  }
  .cn-alert-variant-default {
    background-color: var(--card);
    color: var(--card-foreground);
  }
  .cn-alert-variant-destructive {
    background-color: var(--card);
    color: var(--destructive);
    :is(& > *) {
      &[data-slot="alert-description"] {
        color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          color: color-mix(in oklab, var(--destructive) 90%, transparent);
        }
      }
    }
    :is(& > *) {
      &:is(svg) {
        color: currentcolor;
      }
    }
  }
  .cn-alert-title {
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:is(:where(.group\/alert):has(>svg) *) {
      grid-column-start: 2;
    }
  }
  .cn-alert-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    text-wrap: balance;
    color: var(--muted-foreground);
    @media (width >= 48rem) {
      text-wrap: pretty;
    }
    & p:not(:last-child) {
      margin-bottom: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-alert-action {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 2.5);
    right: calc(var(--spacing, 0.25rem) * 3);
  }
  .cn-avatar {
    width: calc(var(--spacing, 0.25rem) * 8);
    height: calc(var(--spacing, 0.25rem) * 8);
    border-radius: calc(infinity * 1px);
    &::after {
      content: var(--tw-content);
      border-radius: calc(infinity * 1px);
    }
    &[data-size="lg"] {
      width: calc(var(--spacing, 0.25rem) * 10);
      height: calc(var(--spacing, 0.25rem) * 10);
    }
    &[data-size="sm"] {
      width: calc(var(--spacing, 0.25rem) * 6);
      height: calc(var(--spacing, 0.25rem) * 6);
    }
  }
  .cn-avatar-fallback {
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
    color: var(--muted-foreground);
  }
  .cn-avatar-image {
    border-radius: calc(infinity * 1px);
  }
  .cn-avatar-badge {
    background-color: var(--primary);
    color: var(--primary-foreground);
    --tw-ring-color: var(--background);
  }
  .cn-avatar-group-count {
    width: calc(var(--spacing, 0.25rem) * 8);
    height: calc(var(--spacing, 0.25rem) * 8);
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    &:is(:where(.group\/avatar-group):has(*[data-size="lg"]) *) {
      width: calc(var(--spacing, 0.25rem) * 10);
      height: calc(var(--spacing, 0.25rem) * 10);
    }
    &:is(:where(.group\/avatar-group):has(*[data-size="sm"]) *) {
      width: calc(var(--spacing, 0.25rem) * 6);
      height: calc(var(--spacing, 0.25rem) * 6);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &:is(:where(.group\/avatar-group):has(*[data-size="lg"]) *) {
      &>svg {
        width: calc(var(--spacing, 0.25rem) * 5);
        height: calc(var(--spacing, 0.25rem) * 5);
      }
    }
    &:is(:where(.group\/avatar-group):has(*[data-size="sm"]) *) {
      &>svg {
        width: calc(var(--spacing, 0.25rem) * 3);
        height: calc(var(--spacing, 0.25rem) * 3);
      }
    }
  }
  .cn-badge {
    height: calc(var(--spacing, 0.25rem) * 5);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) + 16px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: transparent;
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 0.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:has(*[data-icon="inline-end"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:has(*[data-icon="inline-start"]) {
      padding-left: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 3) !important;
      height: calc(var(--spacing, 0.25rem) * 3) !important;
    }
  }
  .cn-badge-variant-default {
    background-color: var(--primary);
    color: var(--primary-foreground);
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--primary);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--primary) 80%, transparent);
          }
        }
      }
    }
  }
  .cn-badge-variant-secondary {
    background-color: var(--secondary);
    color: var(--secondary-foreground);
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--secondary);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
          }
        }
      }
    }
  }
  .cn-badge-variant-outline {
    border-color: var(--border);
    color: var(--foreground);
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
        }
      }
    }
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          color: var(--muted-foreground);
        }
      }
    }
  }
  .cn-badge-variant-destructive {
    background-color: var(--destructive);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
    color: var(--destructive);
    &:focus-visible {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      background-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      &:focus-visible {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
          }
        }
      }
    }
  }
  .cn-badge-variant-ghost {
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--muted-foreground);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--muted) 50%, transparent);
          }
        }
      }
    }
  }
  .cn-badge-variant-link {
    color: var(--primary);
    text-underline-offset: 4px;
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .cn-breadcrumb-list {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    @media (width >= 40rem) {
      gap: calc(var(--spacing, 0.25rem) * 2.5);
    }
  }
  .cn-breadcrumb-item {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
  }
  .cn-breadcrumb-link {
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        color: var(--foreground);
      }
    }
  }
  .cn-breadcrumb-page {
    --tw-font-weight: var(--font-weight-normal, 400);
    font-weight: var(--font-weight-normal, 400);
    color: var(--foreground);
  }
  .cn-breadcrumb-separator {
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 3.5);
      height: calc(var(--spacing, 0.25rem) * 3.5);
    }
  }
  .cn-breadcrumb-ellipsis {
    width: calc(var(--spacing, 0.25rem) * 5);
    height: calc(var(--spacing, 0.25rem) * 5);
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-button {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: transparent;
    background-clip: padding-box;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-button-variant-default {
    background-color: var(--primary);
    color: var(--primary-foreground);
    --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);
    &:hover {
      @media (hover: hover) {
        background-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--primary) 80%, transparent);
        }
      }
    }
  }
  .cn-button-variant-outline {
    border-color: var(--border);
    background-color: var(--background);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--foreground);
      }
    }
    &[aria-expanded="true"] {
      background-color: var(--muted);
    }
    &[aria-expanded="true"] {
      color: var(--foreground);
    }
    &:is(.dark *) {
      border-color: var(--input);
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--input);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--input) 50%, transparent);
          }
        }
      }
    }
  }
  .cn-button-variant-secondary {
    background-color: var(--secondary);
    color: var(--secondary-foreground);
    &:hover {
      @media (hover: hover) {
        background-color: var(--secondary);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
        }
      }
    }
    &[aria-expanded="true"] {
      background-color: var(--secondary);
    }
    &[aria-expanded="true"] {
      color: var(--secondary-foreground);
    }
  }
  .cn-button-variant-ghost {
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--foreground);
      }
    }
    &[aria-expanded="true"] {
      background-color: var(--muted);
    }
    &[aria-expanded="true"] {
      color: var(--foreground);
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--muted) 50%, transparent);
          }
        }
      }
    }
  }
  .cn-button-variant-destructive {
    background-color: var(--destructive);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
    color: var(--destructive);
    &:hover {
      @media (hover: hover) {
        background-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
        }
      }
    }
    &:focus-visible {
      border-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        border-color: color-mix(in oklab, var(--destructive) 40%, transparent);
      }
    }
    &:focus-visible {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      background-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--destructive) 30%, transparent);
          }
        }
      }
    }
    &:is(.dark *) {
      &:focus-visible {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-button-variant-link {
    color: var(--primary);
    text-underline-offset: 4px;
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .cn-button-size-xs {
    height: calc(var(--spacing, 0.25rem) * 6);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: min(var(--radius-md), 8px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    :where(*[data-slot="button-group"]) & {
      border-radius: calc(var(--radius) - 2px);
    }
    &:has(*[data-icon="inline-end"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:has(*[data-icon="inline-start"]) {
      padding-left: calc(var(--spacing, 0.25rem) * 1.5);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 3);
      height: calc(var(--spacing, 0.25rem) * 3);
    }
  }
  .cn-button-size-sm {
    height: calc(var(--spacing, 0.25rem) * 8);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: min(var(--radius-md), 10px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    :where(*[data-slot="button-group"]) & {
      border-radius: calc(var(--radius) - 2px);
    }
    &:has(*[data-icon="inline-end"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:has(*[data-icon="inline-start"]) {
      padding-left: calc(var(--spacing, 0.25rem) * 1.5);
    }
  }
  .cn-button-size-default {
    height: calc(var(--spacing, 0.25rem) * 9);
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    :where(*[data-slot="button-group"]) & {
      border-radius: calc(var(--radius) - 2px);
    }
    &:has(*[data-icon="inline-end"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 2);
    }
    &:has(*[data-icon="inline-start"]) {
      padding-left: calc(var(--spacing, 0.25rem) * 2);
    }
  }
  .cn-button-size-lg {
    height: calc(var(--spacing, 0.25rem) * 10);
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    &:has(*[data-icon="inline-end"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 3);
    }
    &:has(*[data-icon="inline-start"]) {
      padding-left: calc(var(--spacing, 0.25rem) * 3);
    }
  }
  .cn-button-size-icon-xs {
    width: calc(var(--spacing, 0.25rem) * 6);
    height: calc(var(--spacing, 0.25rem) * 6);
    border-radius: min(var(--radius-md), 8px);
    :where(*[data-slot="button-group"]) & {
      border-radius: calc(var(--radius) - 2px);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 3);
      height: calc(var(--spacing, 0.25rem) * 3);
    }
  }
  .cn-button-size-icon-sm {
    width: calc(var(--spacing, 0.25rem) * 8);
    height: calc(var(--spacing, 0.25rem) * 8);
    border-radius: min(var(--radius-md), 10px);
    :where(*[data-slot="button-group"]) & {
      border-radius: calc(var(--radius) - 2px);
    }
  }
  .cn-button-size-icon {
    width: calc(var(--spacing, 0.25rem) * 9);
    height: calc(var(--spacing, 0.25rem) * 9);
  }
  .cn-button-size-icon-lg {
    width: calc(var(--spacing, 0.25rem) * 10);
    height: calc(var(--spacing, 0.25rem) * 10);
  }
  .cn-button-group {
    &:has(>[data-slot=button-group]) {
      gap: calc(var(--spacing, 0.25rem) * 2);
    }
    &:has(*:is(select[aria-hidden=true]:last-child)) {
      &>[data-slot=select-trigger]:last-of-type {
        border-top-right-radius: calc(var(--radius) - 2px);
        border-bottom-right-radius: calc(var(--radius) - 2px);
      }
    }
  }
  .cn-button-group-orientation-horizontal {
    &>[data-slot]:not(:has(~[data-slot])) {
      border-top-right-radius: calc(var(--radius) - 2px) !important;
      border-bottom-right-radius: calc(var(--radius) - 2px) !important;
    }
  }
  .cn-button-group-orientation-vertical {
    &>[data-slot]:not(:has(~[data-slot])) {
      border-bottom-right-radius: calc(var(--radius) - 2px) !important;
      border-bottom-left-radius: calc(var(--radius) - 2px) !important;
    }
  }
  .cn-button-group-text {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    background-color: var(--muted);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-button-group-separator {
    background-color: var(--input);
  }
  .cn-calendar {
    padding: calc(var(--spacing, 0.25rem) * 3);
    --cell-radius: var(--radius-md);
    --cell-size: calc(var(--spacing, 0.25rem) * 8);
  }
  .cn-calendar-dropdown-root {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    &:has(*:focus) {
      border-color: var(--ring);
    }
    &:has(*:focus) {
      --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);
    }
    &:has(*:focus) {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
  }
  .cn-calendar-caption-label {
    height: calc(var(--spacing, 0.25rem) * 8);
    padding-right: calc(var(--spacing, 0.25rem) * 1);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-card {
    gap: calc(var(--spacing, 0.25rem) * 6);
    overflow: hidden;
    border-radius: calc(var(--radius) + 4px);
    --tw-border-style: none;
    border-style: none;
    background-color: var(--card);
    padding-block: calc(var(--spacing, 0.25rem) * 6);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--card-foreground);
    --tw-shadow: var(--shadow-sm);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    &:has(>img:first-child) {
      padding-top: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-size="sm"] {
      gap: calc(var(--spacing, 0.25rem) * 4);
    }
    &[data-size="sm"] {
      padding-block: calc(var(--spacing, 0.25rem) * 4);
    }
    :is(& > *) {
      &:is(img:first-child) {
        border-top-left-radius: calc(var(--radius) + 4px);
        border-top-right-radius: calc(var(--radius) + 4px);
      }
    }
    :is(& > *) {
      &:is(img:last-child) {
        border-bottom-right-radius: calc(var(--radius) + 4px);
        border-bottom-left-radius: calc(var(--radius) + 4px);
      }
    }
  }
  .cn-card-header {
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-top-left-radius: calc(var(--radius) + 4px);
    border-top-right-radius: calc(var(--radius) + 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    &:is(:where(.group\/card)[data-size="sm"] *) {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
    }
    &:is(.border-b) {
      padding-bottom: calc(var(--spacing, 0.25rem) * 6);
    }
    &:is(:where(.group\/card)[data-size="sm"] *) {
      &:is(.border-b) {
        padding-bottom: calc(var(--spacing, 0.25rem) * 4);
      }
    }
  }
  .cn-card-title {
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-leading: var(--leading-normal, 1.5);
    line-height: var(--leading-normal, 1.5);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:is(:where(.group\/card)[data-size="sm"] *) {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    @media (width >= 48rem) {
      font-size: var(--text-xl, 1.25rem);
      line-height: var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));
    }
  }
  .cn-card-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
  }
  .cn-card-content {
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    &:is(:where(.group\/card)[data-size="sm"] *) {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-card-footer {
    border-bottom-right-radius: calc(var(--radius) + 4px);
    border-bottom-left-radius: calc(var(--radius) + 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
    &:is(:where(.group\/card)[data-size="sm"] *) {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
    }
    &:is(.border-t) {
      padding-top: calc(var(--spacing, 0.25rem) * 6);
    }
    &:is(:where(.group\/card)[data-size="sm"] *) {
      &:is(.border-t) {
        padding-top: calc(var(--spacing, 0.25rem) * 4);
      }
    }
  }
  .cn-carousel-previous {
    border-radius: calc(infinity * 1px);
  }
  .cn-carousel-next {
    border-radius: calc(infinity * 1px);
  }
  .cn-chart-tooltip {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: var(--radius);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--border) 50%, transparent);
    }
    background-color: var(--background);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-shadow: var(--shadow-xl);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-checkbox {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:is(:where(.group\/field):has(*:disabled) *) {
      opacity: 50%;
    }
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[aria-invalid="true"] {
      &[aria-checked="true"] {
        border-color: var(--primary);
      }
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      border-color: var(--primary);
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      background-color: var(--primary);
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      color: var(--primary-foreground);
    }
    &:is(.dark *) {
      &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
        background-color: var(--primary);
      }
    }
  }
  .cn-checkbox-indicator {
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 3.5);
      height: calc(var(--spacing, 0.25rem) * 3.5);
    }
  }
  .cn-combobox-content {
    max-height: calc(var(--spacing, 0.25rem) * 72);
    min-width: calc(var(--spacing, 0.25rem) * 36);
    overflow: hidden;
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        margin: calc(var(--spacing, 0.25rem) * 1);
      }
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        margin-bottom: calc(var(--spacing, 0.25rem) * 0);
      }
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        height: calc(var(--spacing, 0.25rem) * 8);
      }
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        border-color: var(--input);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--input) 30%, transparent);
        }
      }
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        background-color: var(--input);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--input) 30%, transparent);
        }
      }
    }
    :is(& > *) {
      &[data-slot="input-group"] {
        --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);
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-combobox-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-combobox-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    color: var(--muted-foreground);
  }
  .cn-combobox-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &[data-highlighted] {
      background-color: var(--accent);
    }
    &[data-highlighted] {
      color: var(--accent-foreground);
    }
    &:not(*[data-variant="destructive"]) {
      &[data-highlighted] {
        :is(& *) {
          color: var(--accent-foreground);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-combobox-item-indicator {
    pointer-events: none;
    position: absolute;
    right: calc(var(--spacing, 0.25rem) * 2);
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    align-items: center;
    justify-content: center;
  }
  .cn-combobox-empty {
    display: none;
    width: 100%;
    justify-content: center;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    text-align: center;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    &:is(:where(.group\/combobox-content)[data-empty] *) {
      display: flex;
    }
  }
  .cn-combobox-list {
    -ms-overflow-style: none;
    &::-webkit-scrollbar {
      display: none;
    }
    scrollbar-width: none;
    &::-webkit-scrollbar {
      display: none;
    }
    max-height: min(calc(calc(var(--spacing, 0.25rem) * 72) - calc(var(--spacing, 0.25rem) * 9)), calc(var(--available-height) - calc(var(--spacing, 0.25rem) * 9)));
    scroll-padding-block: calc(var(--spacing, 0.25rem) * 1);
    overflow-y: auto;
    padding: calc(var(--spacing, 0.25rem) * 1);
    &[data-empty] {
      padding: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-combobox-item-text {
    display: flex;
    flex: 1;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-combobox-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * -1);
    margin-block: calc(var(--spacing, 0.25rem) * 1);
    height: 1px;
    background-color: var(--border);
  }
  .cn-combobox-trigger {
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-combobox-trigger-icon {
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    color: var(--muted-foreground);
  }
  .cn-combobox-chips {
    display: flex;
    min-height: calc(var(--spacing, 0.25rem) * 9);
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    background-clip: padding-box;
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:focus-within {
      border-color: var(--ring);
    }
    &:focus-within {
      --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-within {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &:has(*[aria-invalid="true"]) {
      border-color: var(--destructive);
    }
    &:has(*[aria-invalid="true"]) {
      --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);
    }
    &:has(*[aria-invalid="true"]) {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:has(*[data-slot="combobox-chip"]) {
      padding-inline: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:has(*[aria-invalid="true"]) {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &:has(*[aria-invalid="true"]) {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-combobox-chip {
    display: flex;
    height: calc(calc(var(--spacing, 0.25rem) * 5.5));
    width: fit-content;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) - 4px);
    background-color: var(--muted);
    padding-inline: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    white-space: nowrap;
    color: var(--foreground);
    &:has(*[data-slot="combobox-chip-remove"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-combobox-chip-remove {
    margin-left: calc(var(--spacing, 0.25rem) * -1);
    opacity: 50%;
    &:hover {
      @media (hover: hover) {
        opacity: 100%;
      }
    }
  }
  .cn-command {
    border-radius: calc(var(--radius) + 4px) !important;
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
  }
  .cn-command-dialog {
    border-radius: calc(var(--radius) + 4px) !important;
  }
  .cn-command-input-wrapper {
    padding: calc(var(--spacing, 0.25rem) * 1);
    padding-bottom: calc(var(--spacing, 0.25rem) * 0);
  }
  .cn-command-input-group {
    height: calc(var(--spacing, 0.25rem) * 8) !important;
    border-radius: var(--radius) !important;
    border-color: var(--input);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
    background-color: var(--input);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--input) 30%, transparent);
    }
    --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;
    :is(& > *) {
      &[data-slot="input-group-addon"] {
        padding-left: calc(var(--spacing, 0.25rem) * 2) !important;
      }
    }
  }
  .cn-command-input-icon {
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    flex-shrink: 0;
    opacity: 50%;
  }
  .cn-command-input {
    width: 100%;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-command-list {
    -ms-overflow-style: none;
    &::-webkit-scrollbar {
      display: none;
    }
    scrollbar-width: none;
    &::-webkit-scrollbar {
      display: none;
    }
    max-height: calc(var(--spacing, 0.25rem) * 72);
    scroll-padding-block: calc(var(--spacing, 0.25rem) * 1);
    --tw-outline-style: none;
    outline-style: none;
  }
  .cn-command-empty {
    padding-block: calc(var(--spacing, 0.25rem) * 6);
    text-align: center;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-command-group {
    overflow: hidden;
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--foreground);
    :is(& *) {
      &:is([cmdk-group-heading]) {
        padding-inline: calc(var(--spacing, 0.25rem) * 2);
      }
    }
    :is(& *) {
      &:is([cmdk-group-heading]) {
        padding-block: calc(var(--spacing, 0.25rem) * 1.5);
      }
    }
    :is(& *) {
      &:is([cmdk-group-heading]) {
        font-size: var(--text-xs, 0.75rem);
        line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
      }
    }
    :is(& *) {
      &:is([cmdk-group-heading]) {
        --tw-font-weight: var(--font-weight-medium, 500);
        font-weight: var(--font-weight-medium, 500);
      }
    }
    :is(& *) {
      &:is([cmdk-group-heading]) {
        color: var(--muted-foreground);
      }
    }
  }
  .cn-command-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * -1);
    height: 1px;
    width: auto;
    background-color: var(--border);
  }
  .cn-command-item {
    position: relative;
    display: flex;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-outline-style: none;
    outline-style: none;
    @media (forced-colors: active) {
      outline: 2px solid transparent;
      outline-offset: 2px;
    }
    -webkit-user-select: none;
    user-select: none;
    :where(*[data-slot="dialog-content"]) & {
      border-radius: var(--radius) !important;
    }
    &:where([data-selected="true"]) {
      background-color: var(--muted);
    }
    &:where([data-selected="true"]) {
      color: var(--foreground);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &:where([data-selected="true"]) {
      :is(& *) {
        &:is(svg) {
          color: var(--foreground);
        }
      }
    }
  }
  .cn-command-shortcut {
    margin-left: auto;
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-tracking: var(--tracking-widest, 0.1em);
    letter-spacing: var(--tracking-widest, 0.1em);
    color: var(--muted-foreground);
    &:is(:where(.group\/command-item):where([data-selected="true"]) *) {
      color: var(--foreground);
    }
  }
  .cn-context-menu-content {
    min-width: calc(var(--spacing, 0.25rem) * 36);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-context-menu-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-context-menu-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &[data-variant="destructive"] {
      color: var(--destructive);
    }
    &[data-variant="destructive"] {
      &:focus {
        background-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
        }
      }
    }
    &[data-variant="destructive"] {
      &:focus {
        color: var(--destructive);
      }
    }
    &:is(.dark *) {
      &[data-variant="destructive"] {
        &:focus {
          background-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
          }
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &:focus {
      :is(& > *) {
        &:is(svg) {
          color: var(--accent-foreground);
        }
      }
    }
    &[data-variant="destructive"] {
      :is(& > *) {
        &:is(svg) {
          color: var(--destructive);
        }
      }
    }
  }
  .cn-context-menu-checkbox-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-context-menu-radio-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-context-menu-item-indicator {
    position: absolute;
    right: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-context-menu-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--muted-foreground);
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cn-context-menu-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * -1);
    margin-block: calc(var(--spacing, 0.25rem) * 1);
    height: 1px;
    background-color: var(--border);
  }
  .cn-context-menu-shortcut {
    margin-left: auto;
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-tracking: var(--tracking-widest, 0.1em);
    letter-spacing: var(--tracking-widest, 0.1em);
    color: var(--muted-foreground);
    &:is(:where(.group\/context-menu-item):focus *) {
      color: var(--accent-foreground);
    }
  }
  .cn-context-menu-sub-trigger {
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      background-color: var(--accent);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      color: var(--accent-foreground);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-context-menu-sub-content {
    min-width: calc(var(--spacing, 0.25rem) * 32);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-lg);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-context-menu-subcontent {
    --tw-shadow: var(--shadow-lg);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-dialog-overlay {
    background-color: color-mix(in srgb, #000 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 10%, transparent);
    }
    --tw-duration: 100ms;
    transition-duration: 100ms;
    @supports (backdrop-filter: var(--tw)) {
      --tw-backdrop-blur: blur(var(--blur-xs, 4px));
      -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,);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
  }
  .cn-dialog-content {
    display: grid;
    max-width: calc(100% - 2rem);
    gap: calc(var(--spacing, 0.25rem) * 6);
    border-radius: calc(var(--radius) + 4px);
    background-color: var(--background);
    padding: calc(var(--spacing, 0.25rem) * 6);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --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);
    --tw-ring-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    }
    --tw-duration: 100ms;
    transition-duration: 100ms;
    @media (width >= 40rem) {
      max-width: var(--container-md, 28rem);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-dialog-close {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 4);
    right: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-dialog-header {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-dialog-footer {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-dialog-title {
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
  }
  .cn-dialog-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    :is(& > *) {
      &:is(a) {
        text-decoration-line: underline;
      }
    }
    :is(& > *) {
      &:is(a) {
        text-underline-offset: 3px;
      }
    }
    :is(& > *) {
      &:is(a) {
        &:hover {
          @media (hover: hover) {
            color: var(--foreground);
          }
        }
      }
    }
  }
  .cn-drawer-overlay {
    background-color: color-mix(in srgb, #000 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 10%, transparent);
    }
    @supports (backdrop-filter: var(--tw)) {
      --tw-backdrop-blur: blur(var(--blur-xs, 4px));
      -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,);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
  }
  .cn-drawer-content {
    display: flex;
    height: auto;
    flex-direction: column;
    background-color: var(--background);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &[data-vaul-drawer-direction="bottom"] {
      inset-inline: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="bottom"] {
      bottom: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="bottom"] {
      margin-top: calc(var(--spacing, 0.25rem) * 24);
    }
    &[data-vaul-drawer-direction="bottom"] {
      max-height: 80vh;
    }
    &[data-vaul-drawer-direction="bottom"] {
      border-top-left-radius: calc(var(--radius) + 4px);
      border-top-right-radius: calc(var(--radius) + 4px);
    }
    &[data-vaul-drawer-direction="bottom"] {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
    }
    &[data-vaul-drawer-direction="left"] {
      inset-block: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="left"] {
      left: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="left"] {
      width: calc(3 / 4 * 100%);
    }
    &[data-vaul-drawer-direction="left"] {
      border-top-right-radius: calc(var(--radius) + 4px);
      border-bottom-right-radius: calc(var(--radius) + 4px);
    }
    &[data-vaul-drawer-direction="left"] {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }
    &[data-vaul-drawer-direction="right"] {
      inset-block: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="right"] {
      right: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="right"] {
      width: calc(3 / 4 * 100%);
    }
    &[data-vaul-drawer-direction="right"] {
      border-top-left-radius: calc(var(--radius) + 4px);
      border-bottom-left-radius: calc(var(--radius) + 4px);
    }
    &[data-vaul-drawer-direction="right"] {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    &[data-vaul-drawer-direction="top"] {
      inset-inline: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="top"] {
      top: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-vaul-drawer-direction="top"] {
      margin-bottom: calc(var(--spacing, 0.25rem) * 24);
    }
    &[data-vaul-drawer-direction="top"] {
      max-height: 80vh;
    }
    &[data-vaul-drawer-direction="top"] {
      border-bottom-right-radius: calc(var(--radius) + 4px);
      border-bottom-left-radius: calc(var(--radius) + 4px);
    }
    &[data-vaul-drawer-direction="top"] {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
    &[data-vaul-drawer-direction="left"] {
      @media (width >= 40rem) {
        max-width: var(--container-sm, 24rem);
      }
    }
    &[data-vaul-drawer-direction="right"] {
      @media (width >= 40rem) {
        max-width: var(--container-sm, 24rem);
      }
    }
  }
  .cn-drawer-handle {
    margin-inline: auto;
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    display: none;
    height: calc(var(--spacing, 0.25rem) * 1.5);
    width: 100px;
    flex-shrink: 0;
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
    &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction="bottom"] *) {
      display: block;
    }
  }
  .cn-drawer-header {
    gap: calc(var(--spacing, 0.25rem) * 0.5);
    padding: calc(var(--spacing, 0.25rem) * 4);
    &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction="bottom"] *) {
      text-align: center;
    }
    &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction="top"] *) {
      text-align: center;
    }
    @media (width >= 48rem) {
      gap: calc(var(--spacing, 0.25rem) * 1.5);
    }
    @media (width >= 48rem) {
      text-align: left;
    }
  }
  .cn-drawer-title {
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--foreground);
  }
  .cn-drawer-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
  }
  .cn-drawer-footer {
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-dropdown-menu-content {
    min-width: calc(var(--spacing, 0.25rem) * 32);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-dropdown-menu-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-dropdown-menu-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:not(*[data-variant="destructive"]) {
      &:focus {
        :is(& *) {
          color: var(--accent-foreground);
        }
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &[data-variant="destructive"] {
      color: var(--destructive);
    }
    &[data-variant="destructive"] {
      &:focus {
        background-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
        }
      }
    }
    &[data-variant="destructive"] {
      &:focus {
        color: var(--destructive);
      }
    }
    &:is(.dark *) {
      &[data-variant="destructive"] {
        &:focus {
          background-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
          }
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &[data-variant="destructive"] {
      :is(& > *) {
        &:is(svg) {
          color: var(--destructive);
        }
      }
    }
  }
  .cn-dropdown-menu-checkbox-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:focus {
      :is(& *) {
        color: var(--accent-foreground);
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-dropdown-menu-radio-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:focus {
      :is(& *) {
        color: var(--accent-foreground);
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-dropdown-menu-item-indicator {
    position: absolute;
    right: calc(var(--spacing, 0.25rem) * 2);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cn-dropdown-menu-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--muted-foreground);
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cn-dropdown-menu-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * -1);
    margin-block: calc(var(--spacing, 0.25rem) * 1);
    height: 1px;
    background-color: var(--border);
  }
  .cn-dropdown-menu-shortcut {
    margin-left: auto;
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-tracking: var(--tracking-widest, 0.1em);
    letter-spacing: var(--tracking-widest, 0.1em);
    color: var(--muted-foreground);
    &:is(:where(.group\/dropdown-menu-item):focus *) {
      color: var(--accent-foreground);
    }
  }
  .cn-dropdown-menu-sub-trigger {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:not(*[data-variant="destructive"]) {
      &:focus {
        :is(& *) {
          color: var(--accent-foreground);
        }
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      background-color: var(--accent);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      color: var(--accent-foreground);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-dropdown-menu-sub-content {
    min-width: 96px;
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-lg);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-dropdown-menu-subcontent {
    --tw-shadow: var(--shadow-lg);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-empty {
    gap: calc(var(--spacing, 0.25rem) * 4);
    border-radius: var(--radius);
    --tw-border-style: dashed;
    border-style: dashed;
    padding: calc(var(--spacing, 0.25rem) * 12);
  }
  .cn-empty-header {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-empty-media {
    margin-bottom: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-empty-media-default {
    background-color: transparent;
  }
  .cn-empty-media-icon {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 10);
    height: calc(var(--spacing, 0.25rem) * 10);
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius);
    background-color: var(--muted);
    color: var(--foreground);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 6);
      height: calc(var(--spacing, 0.25rem) * 6);
    }
  }
  .cn-empty-title {
    font-size: var(--text-lg, 1.125rem);
    line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    --tw-tracking: var(--tracking-tight, -0.025em);
    letter-spacing: var(--tracking-tight, -0.025em);
  }
  .cn-empty-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--leading-relaxed, 1.625);
  }
  .cn-empty-content {
    gap: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-field-set {
    gap: calc(var(--spacing, 0.25rem) * 6);
    &:has(>[data-slot=checkbox-group]) {
      gap: calc(var(--spacing, 0.25rem) * 3);
    }
    &:has(>[data-slot=radio-group]) {
      gap: calc(var(--spacing, 0.25rem) * 3);
    }
  }
  .cn-field-legend {
    margin-bottom: calc(var(--spacing, 0.25rem) * 3);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &[data-variant="label"] {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    &[data-variant="legend"] {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    }
  }
  .cn-field-group {
    gap: calc(var(--spacing, 0.25rem) * 7);
    &[data-slot="checkbox-group"] {
      gap: calc(var(--spacing, 0.25rem) * 3);
    }
    :is(& > *) {
      &[data-slot="field-group"] {
        gap: calc(var(--spacing, 0.25rem) * 4);
      }
    }
  }
  .cn-field {
    gap: calc(var(--spacing, 0.25rem) * 3);
    &[data-invalid="true"] {
      color: var(--destructive);
    }
  }
  .cn-field-content {
    gap: calc(var(--spacing, 0.25rem) * 1);
  }
  .cn-field-label {
    gap: calc(var(--spacing, 0.25rem) * 2);
    &:is(:where(.group\/field)[data-disabled="true"] *) {
      opacity: 50%;
    }
    &:has(*:where([data-state="checked"]), *:where([data-checked]:not([data-checked="false"]))) {
      border-color: var(--primary);
      @supports (color: color-mix(in lab, red, red)) {
        border-color: color-mix(in oklab, var(--primary) 30%, transparent);
      }
    }
    &:has(*:where([data-state="checked"]), *:where([data-checked]:not([data-checked="false"]))) {
      background-color: var(--primary);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--primary) 5%, transparent);
      }
    }
    &:has(>[data-slot=field]) {
      border-radius: calc(var(--radius) - 2px);
    }
    &:has(>[data-slot=field]) {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    :is(& > *) {
      &[data-slot="field"] {
        padding: calc(var(--spacing, 0.25rem) * 3);
      }
    }
    &:is(.dark *) {
      &:has(*:where([data-state="checked"]), *:where([data-checked]:not([data-checked="false"]))) {
        border-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--primary) 20%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &:has(*:where([data-state="checked"]), *:where([data-checked]:not([data-checked="false"]))) {
        background-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--primary) 10%, transparent);
        }
      }
    }
  }
  .cn-field-title {
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:is(:where(.group\/field)[data-disabled="true"] *) {
      opacity: 50%;
    }
  }
  .cn-field-description {
    text-align: left;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    [data-variant=legend]+& {
      margin-top: calc(var(--spacing, 0.25rem) * -1.5);
    }
  }
  .cn-field-separator {
    margin-block: calc(var(--spacing, 0.25rem) * -2);
    height: calc(var(--spacing, 0.25rem) * 5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:is(:where(.group\/field-group)[data-variant="outline"] *) {
      margin-bottom: calc(var(--spacing, 0.25rem) * -2);
    }
  }
  .cn-field-separator-content {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    color: var(--muted-foreground);
  }
  .cn-field-error {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--destructive);
  }
  .cn-hover-card-content {
    width: calc(var(--spacing, 0.25rem) * 64);
    border-radius: var(--radius);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-hover-card-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-input {
    height: calc(var(--spacing, 0.25rem) * 9);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &::file-selector-button {
      height: calc(var(--spacing, 0.25rem) * 7);
    }
    &::file-selector-button {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    &::file-selector-button {
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
    }
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    @media (width >= 48rem) {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-input-otp {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-input-otp-group {
    border-radius: calc(var(--radius) - 2px);
    &:has(*[aria-invalid="true"]) {
      border-color: var(--destructive);
    }
    &:has(*[aria-invalid="true"]) {
      --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);
    }
    &:has(*[aria-invalid="true"]) {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      &:has(*[aria-invalid="true"]) {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-input-otp-slot {
    width: calc(var(--spacing, 0.25rem) * 9);
    height: calc(var(--spacing, 0.25rem) * 9);
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
    border-color: var(--input);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-outline-style: none;
    outline-style: none;
    &:first-child {
      border-top-left-radius: calc(var(--radius) - 2px);
      border-bottom-left-radius: calc(var(--radius) - 2px);
    }
    &:first-child {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    &:last-child {
      border-top-right-radius: calc(var(--radius) - 2px);
      border-bottom-right-radius: calc(var(--radius) - 2px);
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[data-active="true"] {
      border-color: var(--ring);
    }
    &[data-active="true"] {
      --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);
    }
    &[data-active="true"] {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[data-active="true"] {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
      }
    }
    &[data-active="true"] {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
        }
      }
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &[data-active="true"] {
        &[aria-invalid="true"] {
          --tw-ring-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
          }
        }
      }
    }
  }
  .cn-input-otp-caret-line {
    height: calc(var(--spacing, 0.25rem) * 4);
    width: 1px;
    animation: caret-blink 1.25s ease-out infinite;
    background-color: var(--foreground);
    --tw-duration: 1000ms;
    transition-duration: 1000ms;
  }
  .cn-input-otp-separator {
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-item {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:is(a) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
        }
      }
    }
  }
  .cn-item-variant-default {
    border-color: transparent;
  }
  .cn-item-variant-outline {
    border-color: var(--border);
  }
  .cn-item-variant-muted {
    border-color: transparent;
    background-color: var(--muted);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
  }
  .cn-item-size-default {
    gap: calc(var(--spacing, 0.25rem) * 3.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 3.5);
  }
  .cn-item-size-sm {
    gap: calc(var(--spacing, 0.25rem) * 2.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 2.5);
  }
  .cn-item-size-xs {
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    :where(*[data-slot="dropdown-menu-content"]) & {
      padding: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-item-media {
    gap: calc(var(--spacing, 0.25rem) * 2);
    &:is(:where(.group\/item):has(*[data-slot="item-description"]) *) {
      --tw-translate-y: calc(var(--spacing, 0.25rem) * 0.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &:is(:where(.group\/item):has(*[data-slot="item-description"]) *) {
      align-self: flex-start;
    }
  }
  .cn-item-media-variant-default {
    background-color: transparent;
  }
  .cn-item-media-variant-icon {
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-item-media-variant-image {
    width: calc(var(--spacing, 0.25rem) * 10);
    height: calc(var(--spacing, 0.25rem) * 10);
    overflow: hidden;
    border-radius: calc(var(--radius) - 4px);
    &:is(:where(.group\/item)[data-size="sm"] *) {
      width: calc(var(--spacing, 0.25rem) * 8);
      height: calc(var(--spacing, 0.25rem) * 8);
    }
    &:is(:where(.group\/item)[data-size="xs"] *) {
      width: calc(var(--spacing, 0.25rem) * 6);
      height: calc(var(--spacing, 0.25rem) * 6);
    }
    & img {
      width: 100%;
      height: 100%;
    }
    & img {
      object-fit: cover;
    }
  }
  .cn-item-content {
    gap: calc(var(--spacing, 0.25rem) * 1);
    &:is(:where(.group\/item)[data-size="xs"] *) {
      gap: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-item-title {
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-leading: var(--leading-snug, 1.375);
    line-height: var(--leading-snug, 1.375);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    text-underline-offset: 4px;
  }
  .cn-item-description {
    text-align: left;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-leading: var(--leading-normal, 1.5);
    line-height: var(--leading-normal, 1.5);
    color: var(--muted-foreground);
    &:is(:where(.group\/item)[data-size="xs"] *) {
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    }
  }
  .cn-item-actions {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-item-header {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-item-footer {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-item-group {
    gap: calc(var(--spacing, 0.25rem) * 4);
    &:has(*[data-size="sm"]) {
      gap: calc(var(--spacing, 0.25rem) * 2.5);
    }
    &:has(*[data-size="xs"]) {
      gap: calc(var(--spacing, 0.25rem) * 2);
    }
  }
  .cn-item-separator {
    margin-block: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-kbd {
    height: calc(var(--spacing, 0.25rem) * 5);
    width: fit-content;
    min-width: calc(var(--spacing, 0.25rem) * 5);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) - 4px);
    background-color: var(--muted);
    padding-inline: calc(var(--spacing, 0.25rem) * 1);
    font-family: var(--bejamas-font-family, ui-sans-serif, system-ui, sans-serif);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--muted-foreground);
    :where(*[data-slot="tooltip-content"]) & {
      background-color: var(--background);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--background) 20%, transparent);
      }
    }
    :where(*[data-slot="tooltip-content"]) & {
      color: var(--background);
    }
    &:is(.dark *) {
      :where(*[data-slot="tooltip-content"]) & {
        background-color: var(--background);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--background) 10%, transparent);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 3);
      height: calc(var(--spacing, 0.25rem) * 3);
    }
  }
  .cn-kbd-group {
    gap: calc(var(--spacing, 0.25rem) * 1);
  }
  .cn-label {
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-leading: 1;
    line-height: 1;
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:is(:where(.group)[data-disabled="true"] *) {
      opacity: 50%;
    }
    &:is(:where(.peer):disabled ~ *) {
      opacity: 50%;
    }
  }
  .cn-menubar {
    height: calc(var(--spacing, 0.25rem) * 9);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    background-color: var(--background);
    padding: calc(var(--spacing, 0.25rem) * 1);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-menubar-trigger {
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &[aria-expanded="true"] {
      background-color: var(--muted);
    }
  }
  .cn-menubar-content {
    min-width: calc(var(--spacing, 0.25rem) * 36);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
  }
  .cn-menubar-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-menubar-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:not(*[data-variant="destructive"]) {
      &:focus {
        :is(& *) {
          color: var(--accent-foreground);
        }
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &[data-variant="destructive"] {
      color: var(--destructive);
    }
    &[data-variant="destructive"] {
      &:focus {
        background-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
        }
      }
    }
    &[data-variant="destructive"] {
      &:focus {
        color: var(--destructive);
      }
    }
    &:is(.dark *) {
      &[data-variant="destructive"] {
        &:focus {
          background-color: var(--destructive);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
          }
        }
      }
    }
    &:where([data-disabled="true"]), &:where([data-disabled]:not([data-disabled="false"])) {
      opacity: 50%;
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &[data-variant="destructive"] {
      :is(& > *) {
        &:is(svg) {
          color: var(--destructive) !important;
        }
      }
    }
  }
  .cn-menubar-checkbox-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 2);
    padding-left: calc(var(--spacing, 0.25rem) * 8);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:focus {
      :is(& *) {
        color: var(--accent-foreground);
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cn-menubar-checkbox-item-indicator {
    left: calc(var(--spacing, 0.25rem) * 2);
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-menubar-radio-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 2);
    padding-left: calc(var(--spacing, 0.25rem) * 8);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:focus {
      :is(& *) {
        color: var(--accent-foreground);
      }
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &:where([data-disabled="true"]), &:where([data-disabled]:not([data-disabled="false"])) {
      opacity: 50%;
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-menubar-radio-item-indicator {
    left: calc(var(--spacing, 0.25rem) * 2);
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-menubar-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cn-menubar-separator {
    background-color: var(--border);
  }
  .cn-menubar-shortcut {
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-tracking: var(--tracking-widest, 0.1em);
    letter-spacing: var(--tracking-widest, 0.1em);
    color: var(--muted-foreground);
    &:is(:where(.group\/menubar-item):focus *) {
      color: var(--accent-foreground);
    }
  }
  .cn-menubar-sub-trigger {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &[data-inset] {
      padding-left: calc(var(--spacing, 0.25rem) * 8);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      background-color: var(--accent);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      color: var(--accent-foreground);
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-menubar-sub-content {
    min-width: calc(var(--spacing, 0.25rem) * 32);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 1);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-lg);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-navigation-menu {
    max-width: max-content;
  }
  .cn-navigation-menu-list {
    gap: calc(var(--spacing, 0.25rem) * 0);
  }
  .cn-navigation-menu-trigger {
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--background);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:focus {
      background-color: var(--muted);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &:focus-visible {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
    &:disabled {
      opacity: 50%;
    }
    &[data-popup-open] {
      background-color: var(--muted);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
    &[data-popup-open] {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
        }
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      background-color: var(--muted);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
        }
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:focus {
        background-color: var(--muted);
      }
    }
  }
  .cn-navigation-menu-trigger-icon {
    position: relative;
    top: 1px;
    margin-left: calc(var(--spacing, 0.25rem) * 1);
    width: calc(var(--spacing, 0.25rem) * 3);
    height: calc(var(--spacing, 0.25rem) * 3);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    &:is(:where(.group\/navigation-menu-trigger)[data-popup-open] *) {
      rotate: 180deg;
    }
    &:is(:is(:where(.group\/navigation-menu-trigger):where([data-state="open"]), :where(.group\/navigation-menu-trigger):where([data-open]:not([data-open="false"]))) *) {
      rotate: 180deg;
    }
  }
  .cn-navigation-menu-content {
    padding: calc(var(--spacing, 0.25rem) * 2);
    padding-right: calc(var(--spacing, 0.25rem) * 2.5);
    --tw-ease: cubic-bezier(0.22,1,0.36,1);
    transition-timing-function: cubic-bezier(0.22,1,0.36,1);
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      border-radius: calc(var(--radius) - 2px);
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      background-color: var(--popover);
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      color: var(--popover-foreground);
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      --tw-shadow: var(--shadow);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      --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);
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      --tw-ring-color: var(--foreground);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      --tw-duration: 300ms;
      transition-duration: 300ms;
    }
    &[data-motion="from-end"] {
      --tw-enter-translate-x: calc(52*var(--spacing));
    }
    &[data-motion="from-end"] {
      --tw-enter-translate-x: calc(52*var(--spacing));
    }
    &[data-motion="from-start"] {
      --tw-enter-translate-x: calc(52*var(--spacing)*-1);
    }
    &[data-motion="from-start"] {
      --tw-enter-translate-x: calc(52*var(--spacing)*-1);
    }
    &[data-motion="to-end"] {
      --tw-exit-translate-x: calc(52*var(--spacing));
    }
    &[data-motion="to-end"] {
      --tw-exit-translate-x: calc(52*var(--spacing));
    }
    &[data-motion="to-start"] {
      --tw-exit-translate-x: calc(52*var(--spacing)*-1);
    }
    &[data-motion="to-start"] {
      --tw-exit-translate-x: calc(52*var(--spacing)*-1);
    }
    &[data-motion^="from-"] {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &[data-motion^="from-"] {
      --tw-enter-opacity: 0;
    }
    &[data-motion^="from-"] {
      --tw-enter-opacity: 0;
    }
    &[data-motion^="to-"] {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &[data-motion^="to-"] {
      --tw-exit-opacity: 0;
    }
    &[data-motion^="to-"] {
      --tw-exit-opacity: 0;
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-opacity: calc(0/100);
        --tw-enter-opacity: 0;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-opacity: calc(0/100);
        --tw-enter-opacity: 0;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-scale: calc(95*1%);
        --tw-enter-scale: .95;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-scale: calc(95*1%);
        --tw-enter-scale: .95;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-opacity: calc(0/100);
        --tw-exit-opacity: 0;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-opacity: calc(0/100);
        --tw-exit-opacity: 0;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-scale: calc(95*1%);
        --tw-exit-scale: .95;
      }
    }
    &:is(:where(.group\/navigation-menu)[data-viewport="false"] *) {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-scale: calc(95*1%);
        --tw-exit-scale: .95;
      }
    }
  }
  .cn-navigation-menu-viewport {
    border-radius: var(--radius);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(90*1%);
      --tw-enter-scale: .9;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(90*1%);
      --tw-enter-scale: .9;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(90*1%);
      --tw-exit-scale: .9;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(90*1%);
      --tw-exit-scale: .9;
    }
  }
  .cn-navigation-menu-link {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(var(--radius) - 4px);
    padding: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-outline-style: none;
    outline-style: none;
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:focus {
      background-color: var(--muted);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &:focus-visible {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
    &[data-active="true"] {
      background-color: var(--muted);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
      }
    }
    &[data-active="true"] {
      &:hover {
        @media (hover: hover) {
          background-color: var(--muted);
        }
      }
    }
    &[data-active="true"] {
      &:focus {
        background-color: var(--muted);
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-navigation-menu-indicator {
    border-radius: calc(var(--radius) - 2px);
    &[data-state="hidden"] {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &[data-state="hidden"] {
      --tw-exit-opacity: 0;
    }
    &[data-state="hidden"] {
      --tw-exit-opacity: 0;
    }
    &[data-state="visible"] {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &[data-state="visible"] {
      --tw-enter-opacity: 0;
    }
    &[data-state="visible"] {
      --tw-enter-opacity: 0;
    }
  }
  .cn-navigation-menu-indicator-surface {
    background-color: var(--muted);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--muted) 60%, transparent);
    }
    --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);
    --tw-ring-color: var(--border);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--border) 40%, transparent);
    }
  }
  .cn-navigation-menu-indicator-arrow {
    display: none;
    border-top-left-radius: calc(var(--radius) - 4px);
    background-color: var(--border);
    --tw-shadow: var(--shadow-md);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  [data-slot="navigation-menu-list"]:has( > [data-slot="navigation-menu-indicator"] ) .cn-navigation-menu-trigger {
    position: relative;
    z-index: 1;
    background-color: transparent;
    &:hover {
      @media (hover: hover) {
        background-color: transparent;
      }
    }
    &:focus {
      background-color: transparent;
    }
    &[data-popup-open] {
      background-color: transparent;
    }
    &[data-popup-open] {
      &:hover {
        @media (hover: hover) {
          background-color: transparent;
        }
      }
    }
    &[data-popup-open] {
      &:focus {
        background-color: transparent;
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      background-color: transparent;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:hover {
        @media (hover: hover) {
          background-color: transparent;
        }
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:focus {
        background-color: transparent;
      }
    }
  }
  .cn-navigation-menu-positioner {
    transition-property: top,left,right,bottom;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 300ms;
    transition-duration: 300ms;
    --tw-ease: cubic-bezier(0.22,1,0.36,1);
    transition-timing-function: cubic-bezier(0.22,1,0.36,1);
    &[data-side="bottom"] {
      &::before {
        content: var(--tw-content);
        top: -10px;
      }
    }
    &[data-side="bottom"] {
      &::before {
        content: var(--tw-content);
        right: calc(var(--spacing, 0.25rem) * 0);
      }
    }
    &[data-side="bottom"] {
      &::before {
        content: var(--tw-content);
        left: calc(var(--spacing, 0.25rem) * 0);
      }
    }
  }
  .cn-navigation-menu-popup {
    border-radius: var(--radius);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-ease: cubic-bezier(0.22,1,0.36,1);
    transition-timing-function: cubic-bezier(0.22,1,0.36,1);
    --tw-outline-style: none;
    outline-style: none;
    &[data-ending-style] {
      --tw-scale-x: 90%;
      --tw-scale-y: 90%;
      --tw-scale-z: 90%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    &[data-ending-style] {
      opacity: 0%;
    }
    &[data-ending-style] {
      --tw-duration: 150ms;
      transition-duration: 150ms;
    }
    &[data-starting-style] {
      --tw-scale-x: 90%;
      --tw-scale-y: 90%;
      --tw-scale-z: 90%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    &[data-starting-style] {
      opacity: 0%;
    }
  }
  .cn-native-select {
    height: calc(var(--spacing, 0.25rem) * 9);
    width: 100%;
    min-width: calc(var(--spacing, 0.25rem) * 0);
    appearance: none;
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    -webkit-user-select: none;
    user-select: none;
    & *::selection {
      background-color: var(--primary);
    }
    &::selection {
      background-color: var(--primary);
    }
    & *::selection {
      color: var(--primary-foreground);
    }
    &::selection {
      color: var(--primary-foreground);
    }
    &::placeholder {
      color: var(--muted-foreground);
    }
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[data-size="sm"] {
      height: calc(var(--spacing, 0.25rem) * 8);
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--input);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--input) 50%, transparent);
          }
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-native-select-icon {
    top: calc(1 / 2 * 100%);
    right: calc(var(--spacing, 0.25rem) * 2.5);
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    color: var(--muted-foreground);
  }
  .cn-pagination-content {
    gap: calc(var(--spacing, 0.25rem) * 1);
  }
  .cn-pagination-ellipsis {
    width: calc(var(--spacing, 0.25rem) * 9);
    height: calc(var(--spacing, 0.25rem) * 9);
    align-items: center;
    justify-content: center;
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-pagination-previous {
    padding-left: calc(var(--spacing, 0.25rem) * 2) !important;
  }
  .cn-pagination-next {
    padding-right: calc(var(--spacing, 0.25rem) * 2) !important;
  }
  .cn-popover-content {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 4);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    padding: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-popover-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-popover-header {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-popover-title {
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
  }
  .cn-popover-description {
    color: var(--muted-foreground);
  }
  .cn-progress {
    height: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
  }
  .cn-progress-track {
    height: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
  }
  .cn-progress-indicator {
    background-color: var(--primary);
  }
  .cn-progress-label {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
  }
  .cn-progress-value {
    margin-left: auto;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    --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,);
  }
  .cn-radio-group {
    display: grid;
    gap: calc(var(--spacing, 0.25rem) * 3);
  }
  .cn-radio-group-item {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    border-radius: calc(infinity * 1px);
    border-color: var(--input);
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[aria-invalid="true"] {
      &[aria-checked="true"] {
        border-color: var(--primary);
      }
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      border-color: var(--primary);
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      background-color: var(--primary);
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      color: var(--primary-foreground);
    }
    &:is(.dark *) {
      &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
        background-color: var(--primary);
      }
    }
  }
  .cn-radio-group-indicator {
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    align-items: center;
    justify-content: center;
  }
  .cn-radio-group-indicator-icon {
    position: absolute;
    top: calc(1 / 2 * 100%);
    left: calc(1 / 2 * 100%);
    width: calc(var(--spacing, 0.25rem) * 2);
    height: calc(var(--spacing, 0.25rem) * 2);
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: calc(infinity * 1px);
    background-color: var(--primary-foreground);
  }
  .cn-resizable-handle-icon {
    height: calc(var(--spacing, 0.25rem) * 6);
    width: calc(var(--spacing, 0.25rem) * 1);
    border-radius: var(--radius);
    background-color: var(--border);
  }
  .cn-scroll-area-scrollbar {
    &:where([data-orientation="horizontal"]) {
      height: calc(var(--spacing, 0.25rem) * 2.5);
    }
    &:where([data-orientation="horizontal"]) {
      flex-direction: column;
    }
    &:where([data-orientation="horizontal"]) {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
    }
    &:where([data-orientation="horizontal"]) {
      border-top-color: transparent;
    }
    &:where([data-orientation="vertical"]) {
      height: 100%;
    }
    &:where([data-orientation="vertical"]) {
      width: calc(var(--spacing, 0.25rem) * 2.5);
    }
    &:where([data-orientation="vertical"]) {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    &:where([data-orientation="vertical"]) {
      border-left-color: transparent;
    }
  }
  .cn-scroll-area-thumb {
    border-radius: calc(infinity * 1px);
  }
  .cn-select-trigger {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    padding-right: calc(var(--spacing, 0.25rem) * 2);
    padding-left: calc(var(--spacing, 0.25rem) * 2.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[data-placeholder] {
      color: var(--muted-foreground);
    }
    &[data-size="default"] {
      height: calc(var(--spacing, 0.25rem) * 9);
    }
    &[data-size="sm"] {
      height: calc(var(--spacing, 0.25rem) * 8);
    }
    :is(& > *) {
      &[data-slot="select-value"] {
        display: flex;
      }
    }
    :is(& > *) {
      &[data-slot="select-value"] {
        gap: calc(var(--spacing, 0.25rem) * 1.5);
      }
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--input);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--input) 50%, transparent);
          }
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-select-value {
    display: flex;
    flex: 1;
    text-align: left;
  }
  .cn-select-trigger-icon {
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    color: var(--muted-foreground);
  }
  .cn-select-content {
    min-width: calc(var(--spacing, 0.25rem) * 36);
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--popover);
    color: var(--popover-foreground);
    --tw-shadow: var(--shadow-md);
    --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);
    --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);
  }
  .cn-select-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    color: var(--muted-foreground);
  }
  .cn-select-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    padding-right: calc(var(--spacing, 0.25rem) * 8);
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:focus {
      background-color: var(--accent);
    }
    &:focus {
      color: var(--accent-foreground);
    }
    &:not(*[data-variant="destructive"]) {
      &:focus {
        :is(& *) {
          color: var(--accent-foreground);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    :is(& > *) {
      &:is(span) {
        &:last-child {
          display: flex;
        }
      }
    }
    :is(& > *) {
      &:is(span) {
        &:last-child {
          align-items: center;
        }
      }
    }
    :is(& > *) {
      &:is(span) {
        &:last-child {
          gap: calc(var(--spacing, 0.25rem) * 2);
        }
      }
    }
  }
  .cn-select-item-indicator {
    pointer-events: none;
    position: absolute;
    right: calc(var(--spacing, 0.25rem) * 2);
    display: flex;
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    align-items: center;
    justify-content: center;
  }
  .cn-select-group {
    scroll-margin-block: calc(var(--spacing, 0.25rem) * 1);
    padding: calc(var(--spacing, 0.25rem) * 1);
  }
  .cn-select-item-text {
    display: flex;
    flex: 1;
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-select-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * -1);
    margin-block: calc(var(--spacing, 0.25rem) * 1);
    height: 1px;
    background-color: var(--border);
  }
  .cn-select-scroll-up-button {
    z-index: 10;
    display: flex;
    cursor: default;
    align-items: center;
    justify-content: center;
    background-color: var(--popover);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-select-scroll-down-button {
    z-index: 10;
    display: flex;
    cursor: default;
    align-items: center;
    justify-content: center;
    background-color: var(--popover);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-separator {
    flex-shrink: 0;
    background-color: var(--border);
  }
  .cn-separator-horizontal {
    height: 1px;
    width: 100%;
  }
  .cn-separator-vertical {
    height: 100%;
    width: 1px;
  }
  .cn-sheet-overlay {
    background-color: color-mix(in srgb, #000 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-black, #000) 10%, transparent);
    }
    --tw-duration: 100ms;
    transition-duration: 100ms;
    &[data-ending-style] {
      opacity: 0%;
    }
    &[data-starting-style] {
      opacity: 0%;
    }
    @supports (backdrop-filter: var(--tw)) {
      --tw-backdrop-blur: blur(var(--blur-xs, 4px));
      -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,);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
  }
  .cn-sheet-content {
    position: fixed;
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing, 0.25rem) * 4);
    background-color: var(--background);
    background-clip: padding-box;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-shadow: var(--shadow-lg);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    --tw-ease: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
    transition-timing-function: var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));
    &[data-side="bottom"] {
      inset-inline: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="bottom"] {
      bottom: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="bottom"] {
      height: auto;
    }
    &[data-side="bottom"] {
      border-top-style: var(--tw-border-style);
      border-top-width: 1px;
    }
    &[data-side="left"] {
      inset-block: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="left"] {
      left: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="left"] {
      height: 100%;
    }
    &[data-side="left"] {
      width: calc(3 / 4 * 100%);
    }
    &[data-side="left"] {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }
    &[data-side="right"] {
      inset-block: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="right"] {
      right: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="right"] {
      height: 100%;
    }
    &[data-side="right"] {
      width: calc(3 / 4 * 100%);
    }
    &[data-side="right"] {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }
    &[data-side="top"] {
      inset-inline: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="top"] {
      top: calc(var(--spacing, 0.25rem) * 0);
    }
    &[data-side="top"] {
      height: auto;
    }
    &[data-side="top"] {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
    &[data-side="left"] {
      @media (width >= 40rem) {
        max-width: var(--container-sm, 24rem);
      }
    }
    &[data-side="right"] {
      @media (width >= 40rem) {
        max-width: var(--container-sm, 24rem);
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &[data-side="bottom"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-y: calc(10*var(--spacing));
        --tw-enter-translate-y: calc(.1*100%);
      }
    }
    &[data-side="bottom"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-y: calc(10*var(--spacing));
        --tw-enter-translate-y: calc(.1*100%);
      }
    }
    &[data-side="left"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-x: calc(10*var(--spacing)*-1);
        --tw-enter-translate-x: calc(.1*-100%);
      }
    }
    &[data-side="left"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-x: calc(10*var(--spacing)*-1);
        --tw-enter-translate-x: calc(.1*-100%);
      }
    }
    &[data-side="right"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-x: calc(10*var(--spacing));
        --tw-enter-translate-x: calc(.1*100%);
      }
    }
    &[data-side="right"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-x: calc(10*var(--spacing));
        --tw-enter-translate-x: calc(.1*100%);
      }
    }
    &[data-side="top"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-y: calc(10*var(--spacing)*-1);
        --tw-enter-translate-y: calc(.1*-100%);
      }
    }
    &[data-side="top"] {
      &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
        --tw-enter-translate-y: calc(10*var(--spacing)*-1);
        --tw-enter-translate-y: calc(.1*-100%);
      }
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &[data-side="bottom"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-y: calc(10*var(--spacing));
        --tw-exit-translate-y: calc(.1*100%);
      }
    }
    &[data-side="bottom"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-y: calc(10*var(--spacing));
        --tw-exit-translate-y: calc(.1*100%);
      }
    }
    &[data-side="left"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-x: calc(10*var(--spacing)*-1);
        --tw-exit-translate-x: calc(.1*-100%);
      }
    }
    &[data-side="left"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-x: calc(10*var(--spacing)*-1);
        --tw-exit-translate-x: calc(.1*-100%);
      }
    }
    &[data-side="right"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-x: calc(10*var(--spacing));
        --tw-exit-translate-x: calc(.1*100%);
      }
    }
    &[data-side="right"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-x: calc(10*var(--spacing));
        --tw-exit-translate-x: calc(.1*100%);
      }
    }
    &[data-side="top"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-y: calc(10*var(--spacing)*-1);
        --tw-exit-translate-y: calc(.1*-100%);
      }
    }
    &[data-side="top"] {
      &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
        --tw-exit-translate-y: calc(10*var(--spacing)*-1);
        --tw-exit-translate-y: calc(.1*-100%);
      }
    }
  }
  .cn-sheet-close {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 4);
    right: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-sheet-header {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-sheet-footer {
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-sheet-title {
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--foreground);
  }
  .cn-sheet-description {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
  }
  .cn-sidebar-gap {
    transition-property: width;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    --tw-ease: linear;
    transition-timing-function: linear;
  }
  .cn-sidebar-inner {
    background-color: var(--sidebar);
    &:is(:where(.group)[data-variant="floating"] *) {
      border-radius: var(--radius);
    }
    &:is(:where(.group)[data-variant="floating"] *) {
      --tw-shadow: var(--shadow-sm);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:is(:where(.group)[data-variant="floating"] *) {
      --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);
    }
    &:is(:where(.group)[data-variant="floating"] *) {
      --tw-ring-color: var(--sidebar-border);
    }
  }
  .cn-sidebar-rail {
    &:hover {
      @media (hover: hover) {
        &::after {
          content: var(--tw-content);
          background-color: var(--sidebar-border);
        }
      }
    }
  }
  .cn-sidebar-inset {
    background-color: var(--background);
    @media (width >= 48rem) {
      &:is(:where(.peer)[data-variant="inset"] ~ *) {
        margin: calc(var(--spacing, 0.25rem) * 2);
      }
    }
    @media (width >= 48rem) {
      &:is(:where(.peer)[data-variant="inset"] ~ *) {
        margin-left: calc(var(--spacing, 0.25rem) * 0);
      }
    }
    @media (width >= 48rem) {
      &:is(:where(.peer)[data-variant="inset"] ~ *) {
        border-radius: calc(var(--radius) + 4px);
      }
    }
    @media (width >= 48rem) {
      &:is(:where(.peer)[data-variant="inset"] ~ *) {
        --tw-shadow: var(--shadow-sm);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      }
    }
    @media (width >= 48rem) {
      &:is(:where(.peer)[data-variant="inset"] ~ *) {
        &:is(:where(.peer)[data-state="collapsed"] ~ *) {
          margin-left: calc(var(--spacing, 0.25rem) * 2);
        }
      }
    }
  }
  .cn-sidebar-input {
    height: calc(var(--spacing, 0.25rem) * 8);
    width: 100%;
    background-color: var(--background);
    --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);
  }
  .cn-sidebar-header {
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-sidebar-content {
    -ms-overflow-style: none;
    &::-webkit-scrollbar {
      display: none;
    }
    scrollbar-width: none;
    &::-webkit-scrollbar {
      display: none;
    }
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-sidebar-footer {
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-sidebar-separator {
    margin-inline: calc(var(--spacing, 0.25rem) * 2);
    background-color: var(--sidebar-border);
  }
  .cn-sidebar-group {
    padding: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-sidebar-menu {
    gap: calc(var(--spacing, 0.25rem) * 1);
  }
  .cn-sidebar-group-content {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-sidebar-group-label {
    height: calc(var(--spacing, 0.25rem) * 8);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--sidebar-foreground);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--sidebar-foreground) 70%, transparent);
    }
    --tw-ring-color: var(--sidebar-ring);
    transition-property: margin,opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    --tw-ease: linear;
    transition-timing-function: linear;
    &:is(:where(.group)[data-collapsible="icon"] *) {
      margin-top: calc(var(--spacing, 0.25rem) * -8);
    }
    &:is(:where(.group)[data-collapsible="icon"] *) {
      opacity: 0%;
    }
    &: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);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-sidebar-group-action {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 3.5);
    right: calc(var(--spacing, 0.25rem) * 3);
    width: calc(var(--spacing, 0.25rem) * 5);
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing, 0.25rem) * 0);
    color: var(--sidebar-foreground);
    --tw-ring-color: var(--sidebar-ring);
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &: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);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-sidebar-menu-button {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing, 0.25rem) * 2);
    text-align: left;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-ring-color: var(--sidebar-ring);
    transition-property: width,height,padding;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:is(:where(.group\/menu-item):has(*[data-sidebar="menu-action"]) *) {
      padding-right: calc(var(--spacing, 0.25rem) * 8);
    }
    &:is(:where(.group)[data-collapsible="icon"] *) {
      width: calc(var(--spacing, 0.25rem) * 8) !important;
      height: calc(var(--spacing, 0.25rem) * 8) !important;
    }
    &:is(:where(.group)[data-collapsible="icon"] *) {
      padding: calc(var(--spacing, 0.25rem) * 2) !important;
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &: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);
    }
    &:active {
      background-color: var(--sidebar-accent);
    }
    &:active {
      color: var(--sidebar-accent-foreground);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--sidebar-accent);
        }
      }
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      &:hover {
        @media (hover: hover) {
          color: var(--sidebar-accent-foreground);
        }
      }
    }
    &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
      background-color: var(--sidebar-accent);
    }
    &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
      --tw-font-weight: var(--font-weight-medium, 500);
      font-weight: var(--font-weight-medium, 500);
    }
    &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
      color: var(--sidebar-accent-foreground);
    }
  }
  .cn-sidebar-menu-button-variant-default {
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
  }
  .cn-sidebar-menu-button-variant-outline {
    background-color: var(--background);
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    box-shadow: 0 0 0 1px var(--sidebar-border);
    &:hover {
      box-shadow: 0 0 0 1px var(--sidebar-accent);
    }
  }
  .cn-sidebar-menu-button-size-default {
    height: calc(var(--spacing, 0.25rem) * 8);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-sidebar-menu-button-size-sm {
    height: calc(var(--spacing, 0.25rem) * 7);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
  }
  .cn-sidebar-menu-button-size-lg {
    height: calc(var(--spacing, 0.25rem) * 12);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:is(:where(.group)[data-collapsible="icon"] *) {
      padding: calc(var(--spacing, 0.25rem) * 0) !important;
    }
  }
  .cn-sidebar-menu-action {
    position: absolute;
    top: calc(var(--spacing, 0.25rem) * 1.5);
    right: calc(var(--spacing, 0.25rem) * 1);
    aspect-ratio: 1 / 1;
    width: calc(var(--spacing, 0.25rem) * 5);
    border-radius: calc(var(--radius) - 2px);
    padding: calc(var(--spacing, 0.25rem) * 0);
    color: var(--sidebar-foreground);
    --tw-ring-color: var(--sidebar-ring);
    &:is(:where(.peer\/menu-button):hover ~ *) {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &:is(:where(.peer\/menu-button)[data-size="default"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:is(:where(.peer\/menu-button)[data-size="lg"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 2.5);
    }
    &:is(:where(.peer\/menu-button)[data-size="sm"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 1);
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &: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);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-sidebar-menu-badge {
    pointer-events: none;
    position: absolute;
    right: calc(var(--spacing, 0.25rem) * 1);
    display: flex;
    height: calc(var(--spacing, 0.25rem) * 5);
    min-width: calc(var(--spacing, 0.25rem) * 5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--sidebar-foreground);
    &:is(:where(.peer\/menu-button):hover ~ *) {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &:is(:where(.peer\/menu-button)[data-size="default"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:is(:where(.peer\/menu-button)[data-size="lg"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 2.5);
    }
    &:is(:where(.peer\/menu-button)[data-size="sm"] ~ *) {
      top: calc(var(--spacing, 0.25rem) * 1);
    }
    &:is(:is(:where(.peer\/menu-button):where([data-state="active"]), :where(.peer\/menu-button):where([data-active]:not([data-active="false"]))) ~ *) {
      color: var(--sidebar-accent-foreground);
    }
  }
  .cn-sidebar-menu-skeleton {
    height: calc(var(--spacing, 0.25rem) * 8);
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-sidebar-menu-skeleton-icon {
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    border-radius: calc(var(--radius) - 2px);
  }
  .cn-sidebar-menu-skeleton-text {
    height: calc(var(--spacing, 0.25rem) * 4);
  }
  .cn-sidebar-menu-sub {
    margin-inline: calc(var(--spacing, 0.25rem) * 3.5);
    --tw-translate-x: 1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
    border-color: var(--sidebar-border);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 0.5);
    &:is(:where(.group)[data-collapsible="icon"] *) {
      display: none;
    }
  }
  .cn-sidebar-menu-sub-button {
    height: calc(var(--spacing, 0.25rem) * 7);
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    color: var(--sidebar-foreground);
    --tw-ring-color: var(--sidebar-ring);
    &:hover {
      @media (hover: hover) {
        background-color: var(--sidebar-accent);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--sidebar-accent-foreground);
      }
    }
    &: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);
    }
    &:active {
      background-color: var(--sidebar-accent);
    }
    &:active {
      color: var(--sidebar-accent-foreground);
    }
    &[data-size="md"] {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    &[data-size="sm"] {
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    }
    &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
      background-color: var(--sidebar-accent);
    }
    &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
      color: var(--sidebar-accent-foreground);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &>svg {
      color: var(--sidebar-accent-foreground);
    }
  }
  .cn-skeleton {
    border-radius: calc(var(--radius) - 2px);
    background-color: var(--muted);
  }
  .cn-slider {
    &:where([data-orientation="vertical"]) {
      min-height: calc(var(--spacing, 0.25rem) * 40);
    }
  }
  .cn-slider-track {
    border-radius: calc(infinity * 1px);
    background-color: var(--muted);
    &:where([data-orientation="horizontal"]) {
      height: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:where([data-orientation="horizontal"]) {
      width: 100%;
    }
    &:where([data-orientation="vertical"]) {
      height: 100%;
    }
    &:where([data-orientation="vertical"]) {
      width: calc(var(--spacing, 0.25rem) * 1.5);
    }
  }
  .cn-slider-range {
    background-color: var(--primary);
  }
  .cn-slider-thumb {
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--primary);
    background-color: var(--color-white, #fff);
    --tw-shadow: var(--shadow-sm);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: var(--ring);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: 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);
      }
    }
    &: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 {
      --tw-outline-style: none;
      outline-style: none;
      @media (forced-colors: active) {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
    }
  }
  .cn-toast {
    border-radius: calc(var(--radius) + 8px);
  }
  .cn-switch {
    flex-shrink: 0;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: transparent;
    --tw-shadow: var(--shadow-xs);
    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 {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[data-size="default"] {
      height: 18.4px;
    }
    &[data-size="default"] {
      width: 32px;
    }
    &[data-size="sm"] {
      height: 14px;
    }
    &[data-size="sm"] {
      width: 24px;
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
      background-color: var(--primary);
    }
    &:where([data-state="unchecked"]), &:where([data-unchecked]:not([data-unchecked="false"])) {
      background-color: var(--input);
    }
    &:is(.dark *) {
      &:where([data-state="unchecked"]), &:where([data-unchecked]:not([data-unchecked="false"])) {
        background-color: var(--input);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--input) 80%, transparent);
        }
      }
    }
  }
  .cn-switch-thumb {
    border-radius: calc(infinity * 1px);
    background-color: var(--background);
    &:is(:where(.group\/switch)[data-size="default"] *) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &:is(:where(.group\/switch)[data-size="sm"] *) {
      width: calc(var(--spacing, 0.25rem) * 3);
      height: calc(var(--spacing, 0.25rem) * 3);
    }
    &:is(:where(.group\/switch)[data-size="default"] *) {
      &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
        --tw-translate-x: calc(100% - 2px);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    &:is(:where(.group\/switch)[data-size="sm"] *) {
      &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
        --tw-translate-x: calc(100% - 2px);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    &:is(.dark *) {
      &:where([data-state="checked"]), &:where([data-checked]:not([data-checked="false"])) {
        background-color: var(--primary-foreground);
      }
    }
    &:is(:where(.group\/switch)[data-size="default"] *) {
      &:where([data-state="unchecked"]), &:where([data-unchecked]:not([data-unchecked="false"])) {
        --tw-translate-x: calc(var(--spacing, 0.25rem) * 0);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    &:is(:where(.group\/switch)[data-size="sm"] *) {
      &:where([data-state="unchecked"]), &:where([data-unchecked]:not([data-unchecked="false"])) {
        --tw-translate-x: calc(var(--spacing, 0.25rem) * 0);
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    &:is(.dark *) {
      &:where([data-state="unchecked"]), &:where([data-unchecked]:not([data-unchecked="false"])) {
        background-color: var(--foreground);
      }
    }
  }
  .cn-table-container {
    position: relative;
    width: 100%;
    overflow-x: auto;
  }
  .cn-table {
    width: 100%;
    caption-side: bottom;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-table-header {
    & tr {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
  }
  .cn-table-body {
    & tr:last-child {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
  }
  .cn-table-footer {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    background-color: var(--muted);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &>tr {
      &:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0px;
      }
    }
  }
  .cn-table-row {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--muted) 50%, transparent);
        }
      }
    }
    &[data-state="selected"] {
      background-color: var(--muted);
    }
  }
  .cn-table-head {
    height: calc(var(--spacing, 0.25rem) * 10);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    text-align: left;
    vertical-align: middle;
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    white-space: nowrap;
    color: var(--foreground);
    &:has([role=checkbox]) {
      padding-right: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-table-cell {
    padding: calc(var(--spacing, 0.25rem) * 2);
    vertical-align: middle;
    white-space: nowrap;
    &:has([role=checkbox]) {
      padding-right: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-table-caption {
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
  }
  .cn-tabs {
    gap: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-tabs-list-variant-indicator {
    border-radius: var(--radius);
    background-color: var(--muted);
    padding: 2px;
    --tabs-indicator-radius: calc(var(--radius) - 2px);
  }
  .cn-tabs-list-variant-default {
    border-radius: var(--radius);
    background-color: var(--muted);
    padding: 3px;
  }
  .cn-tabs-list-variant-line, .cn-tabs-list-variant-line-animated {
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: 0;
    background-color: transparent;
    padding: calc(var(--spacing, 0.25rem) * 0);
  }
  .cn-tabs-list-size-default {
    &:is(:where(.group\/tabs):where([data-orientation="horizontal"]) *) {
      height: calc(var(--spacing, 0.25rem) * 9);
    }
  }
  .cn-tabs-list-size-sm {
    &:is(:where(.group\/tabs):where([data-orientation="horizontal"]) *) {
      height: calc(var(--spacing, 0.25rem) * 8);
    }
  }
  .cn-tabs-list-size-lg {
    &:is(:where(.group\/tabs):where([data-orientation="horizontal"]) *) {
      height: calc(var(--spacing, 0.25rem) * 10);
    }
  }
  .cn-tabs-trigger {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: transparent;
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &:is(:where(.group\/tabs-list)[data-variant="default"] *) {
      &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
        --tw-shadow: var(--shadow-sm);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      }
    }
    &:is(:where(.group\/tabs-list)[data-variant="line"] *) {
      &:where([data-state="active"]), &:where([data-active]:not([data-active="false"])) {
        --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);
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-tabs-content {
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-textarea {
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:focus-visible {
      border-color: var(--ring);
    }
    &: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 {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    @media (width >= 48rem) {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        border-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
        }
      }
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-toggle {
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) - 2px);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        color: var(--foreground);
      }
    }
    &:focus-visible {
      border-color: var(--ring);
    }
    &:focus-visible {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &[aria-invalid="true"] {
      border-color: var(--destructive);
    }
    &[aria-invalid="true"] {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &[aria-pressed="true"] {
      background-color: var(--muted);
    }
    &:is(.dark *) {
      &[aria-invalid="true"] {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-toggle-variant-default {
    background-color: transparent;
  }
  .cn-toggle-variant-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    background-color: transparent;
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
  }
  .cn-toggle-size-default {
    height: calc(var(--spacing, 0.25rem) * 9);
    min-width: calc(var(--spacing, 0.25rem) * 9);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
  }
  .cn-toggle-size-sm {
    height: calc(var(--spacing, 0.25rem) * 8);
    min-width: calc(var(--spacing, 0.25rem) * 8);
    padding-inline: calc(var(--spacing, 0.25rem) * 1.5);
  }
  .cn-toggle-size-lg {
    height: calc(var(--spacing, 0.25rem) * 10);
    min-width: calc(var(--spacing, 0.25rem) * 10);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
  }
  .cn-toggle-group {
    border-radius: calc(var(--radius) - 2px);
    &[data-spacing="0"] {
      &[data-variant="outline"] {
        --tw-shadow: var(--shadow-xs);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
      }
    }
  }
  .cn-toggle-group-item {
    &:is(:where(.group\/toggle-group)[data-spacing="0"] *) {
      border-radius: 0;
    }
    &:is(:where(.group\/toggle-group)[data-spacing="0"] *) {
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
    }
    &:is(:where(.group\/toggle-group)[data-spacing="0"] *) {
      --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);
    }
    &:is(:where(.group\/toggle-group):where([data-orientation="horizontal"]) *) {
      &[data-spacing="0"] {
        &:first-child {
          border-top-left-radius: calc(var(--radius) - 2px);
          border-bottom-left-radius: calc(var(--radius) - 2px);
        }
      }
    }
    &:is(:where(.group\/toggle-group):where([data-orientation="vertical"]) *) {
      &[data-spacing="0"] {
        &:first-child {
          border-top-left-radius: calc(var(--radius) - 2px);
          border-top-right-radius: calc(var(--radius) - 2px);
        }
      }
    }
    &:is(:where(.group\/toggle-group):where([data-orientation="horizontal"]) *) {
      &[data-spacing="0"] {
        &:last-child {
          border-top-right-radius: calc(var(--radius) - 2px);
          border-bottom-right-radius: calc(var(--radius) - 2px);
        }
      }
    }
    &:is(:where(.group\/toggle-group):where([data-orientation="vertical"]) *) {
      &[data-spacing="0"] {
        &:last-child {
          border-bottom-right-radius: calc(var(--radius) - 2px);
          border-bottom-left-radius: calc(var(--radius) - 2px);
        }
      }
    }
    &[data-state="on"] {
      background-color: var(--muted);
    }
  }
  .cn-tooltip-content {
    pointer-events: none;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: calc(var(--radius) - 2px);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    &:has(*[data-slot="kbd"]) {
      padding-right: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="bottom"] {
      --tw-enter-translate-y: calc(2*var(--spacing)*-1);
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="left"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="right"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    &[data-side="top"] {
      --tw-enter-translate-y: calc(2*var(--spacing));
    }
    :is(& *) {
      &[data-slot="kbd"] {
        position: relative;
      }
    }
    :is(& *) {
      &[data-slot="kbd"] {
        isolation: isolate;
      }
    }
    :is(& *) {
      &[data-slot="kbd"] {
        z-index: 50;
      }
    }
    :is(& *) {
      &[data-slot="kbd"] {
        border-radius: calc(var(--radius) - 4px);
      }
    }
    &[data-state="delayed-open"] {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &[data-state="delayed-open"] {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &[data-state="delayed-open"] {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &[data-state="delayed-open"] {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &[data-state="delayed-open"] {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      pointer-events: auto;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-opacity: calc(0/100);
      --tw-enter-opacity: 0;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="open"]), &:where([data-open]:not([data-open="false"])) {
      --tw-enter-scale: calc(95*1%);
      --tw-enter-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      pointer-events: none;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-opacity: calc(0/100);
      --tw-exit-opacity: 0;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
    &:where([data-state="closed"]), &:where([data-closed]:not([data-closed="false"])) {
      --tw-exit-scale: calc(95*1%);
      --tw-exit-scale: .95;
    }
  }
  .cn-tooltip-content-logical {
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-end"] {
      --tw-enter-translate-x: calc(2*var(--spacing)*-1);
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
    &[data-side="inline-start"] {
      --tw-enter-translate-x: calc(2*var(--spacing));
    }
  }
  .cn-tooltip-arrow {
    width: calc(var(--spacing, 0.25rem) * 2.5);
    height: calc(var(--spacing, 0.25rem) * 2.5);
    rotate: 45deg;
    border-radius: 2px;
    &[data-side="bottom"] {
      top: calc(var(--spacing, 0.25rem) * -1);
    }
    &[data-side="left"] {
      right: calc(var(--spacing, 0.25rem) * -1);
    }
    &[data-side="left"] {
      --tw-translate-x: -1.5px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &[data-side="right"] {
      left: calc(var(--spacing, 0.25rem) * -1);
    }
    &[data-side="right"] {
      --tw-translate-x: 1.5px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &[data-side="top"] {
      bottom: calc(var(--spacing, 0.25rem) * -1);
    }
  }
  .cn-tooltip-arrow-logical {
    &[data-side="inline-end"] {
      left: calc(var(--spacing, 0.25rem) * -1);
    }
    &[data-side="inline-end"] {
      --tw-translate-x: 1.5px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &[data-side="inline-start"] {
      right: calc(var(--spacing, 0.25rem) * -1);
    }
    &[data-side="inline-start"] {
      --tw-translate-x: -1.5px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .cn-input-group {
    height: calc(var(--spacing, 0.25rem) * 9);
    border-radius: calc(var(--radius) - 2px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--input);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    :where(*[data-slot="combobox-content"]) & {
      &:focus-within {
        border-color: inherit;
      }
    }
    :where(*[data-slot="combobox-content"]) & {
      &:focus-within {
        --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);
      }
    }
    &:has(*:is([data-slot=input-group-control]:focus-visible)) {
      border-color: var(--ring);
    }
    &:has(*:is([data-slot=input-group-control]: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);
    }
    &:has(*:is([data-slot=input-group-control]:focus-visible)) {
      --tw-ring-color: var(--ring);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
      }
    }
    &:has(*:is([data-slot][aria-invalid=true])) {
      border-color: var(--destructive);
    }
    &:has(*:is([data-slot][aria-invalid=true])) {
      --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);
    }
    &:has(*:is([data-slot][aria-invalid=true])) {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:has(>[data-align=block-end]) {
      height: auto;
    }
    &:has(>[data-align=block-end]) {
      flex-direction: column;
    }
    &:has(>[data-align=block-start]) {
      height: auto;
    }
    &:has(>[data-align=block-start]) {
      flex-direction: column;
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:has(*:is([data-slot][aria-invalid=true])) {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
    &:has(>[data-align=block-end]) {
      &>input {
        padding-top: calc(var(--spacing, 0.25rem) * 3);
      }
    }
    &:has(>[data-align=block-start]) {
      &>input {
        padding-bottom: calc(var(--spacing, 0.25rem) * 3);
      }
    }
    &:has(>[data-align=inline-end]) {
      &>input {
        padding-right: calc(var(--spacing, 0.25rem) * 1.5);
      }
    }
    &:has(>[data-align=inline-start]) {
      &>input {
        padding-left: calc(var(--spacing, 0.25rem) * 1.5);
      }
    }
  }
  .cn-input-group-addon {
    height: auto;
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--muted-foreground);
    &:is(:where(.group\/input-group)[data-disabled="true"] *) {
      opacity: 50%;
    }
    &>kbd {
      border-radius: calc(var(--radius) - 5px);
    }
    &>svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-input-group-addon-align-inline-start {
    padding-left: calc(var(--spacing, 0.25rem) * 2);
    &:has(>button) {
      margin-left: calc(var(--spacing, 0.25rem) * -1);
    }
    &:has(>kbd) {
      margin-left: -0.15rem;
    }
  }
  .cn-input-group-addon-align-inline-end {
    padding-right: calc(var(--spacing, 0.25rem) * 2);
    &:has(>button) {
      margin-right: calc(var(--spacing, 0.25rem) * -1);
    }
    &:has(>kbd) {
      margin-right: -0.15rem;
    }
  }
  .cn-input-group-addon-align-block-start {
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-top: calc(var(--spacing, 0.25rem) * 2);
    &:is(:where(.group\/input-group):has(>input) *) {
      padding-top: calc(var(--spacing, 0.25rem) * 2);
    }
    &:is(.border-b) {
      padding-bottom: calc(var(--spacing, 0.25rem) * 2);
    }
  }
  .cn-input-group-addon-align-block-end {
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-bottom: calc(var(--spacing, 0.25rem) * 2);
    &:is(:where(.group\/input-group):has(>input) *) {
      padding-bottom: calc(var(--spacing, 0.25rem) * 2);
    }
    &:is(.border-t) {
      padding-top: calc(var(--spacing, 0.25rem) * 2);
    }
  }
  .cn-input-group-button {
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-input-group-button-size-xs {
    height: calc(var(--spacing, 0.25rem) * 6);
    gap: calc(var(--spacing, 0.25rem) * 1);
    border-radius: calc(var(--radius) - 5px);
    padding-inline: calc(var(--spacing, 0.25rem) * 1.5);
    &>svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 3.5);
      height: calc(var(--spacing, 0.25rem) * 3.5);
    }
  }
  .cn-input-group-button-size-icon-xs {
    width: calc(var(--spacing, 0.25rem) * 6);
    height: calc(var(--spacing, 0.25rem) * 6);
    border-radius: calc(var(--radius) - 5px);
    padding: calc(var(--spacing, 0.25rem) * 0);
    &:has(>svg) {
      padding: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-input-group-button-size-icon-sm {
    width: calc(var(--spacing, 0.25rem) * 8);
    height: calc(var(--spacing, 0.25rem) * 8);
    padding: calc(var(--spacing, 0.25rem) * 0);
    &:has(>svg) {
      padding: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-input-group-text {
    gap: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    & svg:not([class*='size-']) {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
  }
  .cn-input-group-input {
    border-radius: 0;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    --tw-shadow: 0 0 #0000;
    --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 {
      --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);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &:is(.dark *) {
      background-color: transparent;
    }
  }
  .cn-input-group-textarea {
    border-radius: 0;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    --tw-shadow: 0 0 #0000;
    --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 {
      --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);
    }
    &[aria-invalid="true"] {
      --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);
    }
    &:is(.dark *) {
      background-color: transparent;
    }
  }
  .cn-button {
    border-radius: var(--radius);
    border-color: transparent;
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    --tw-duration: 150ms;
    transition-duration: 150ms;
    --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
    &:active {
      --tw-scale-x: 98%;
      --tw-scale-y: 98%;
      --tw-scale-z: 98%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .cn-button-variant-default {
    --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);
    &:hover {
      @media (hover: hover) {
        background-color: var(--primary);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--primary) 90%, transparent);
        }
      }
    }
  }
  .cn-button-variant-destructive {
    color: var(--color-white, #fff);
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    &:hover {
      @media (hover: hover) {
        background-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
        }
      }
    }
    &:focus-visible {
      --tw-ring-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
      }
    }
    &:is(.dark *) {
      background-color: var(--destructive);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
      }
    }
    &:is(.dark *) {
      &:focus-visible {
        --tw-ring-color: var(--destructive);
        @supports (color: color-mix(in lab, red, red)) {
          --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
        }
      }
    }
  }
  .cn-button-variant-outline {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--background);
    --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);
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
      }
    }
    &:hover {
      @media (hover: hover) {
        color: var(--foreground);
      }
    }
    &[aria-expanded="true"] {
      background-color: var(--muted);
    }
    &[aria-expanded="true"] {
      color: var(--foreground);
    }
    &:is(.dark *) {
      border-color: var(--input);
    }
    &:is(.dark *) {
      background-color: var(--input);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--input) 30%, transparent);
      }
    }
    &:is(.dark *) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--input);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--input) 50%, transparent);
          }
        }
      }
    }
  }
  .cn-button-variant-secondary {
    &:hover {
      @media (hover: hover) {
        background-color: var(--secondary);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
        }
      }
    }
  }
  .cn-button-variant-ghost {
    --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);
    &:hover {
      @media (hover: hover) {
        background-color: var(--secondary);
      }
    }
  }
  .cn-button-variant-link {
    padding: calc(var(--spacing, 0.25rem) * 0);
    color: var(--accent);
  }
  .cn-button-size-default {
    height: calc(var(--spacing, 0.25rem) * 9);
    gap: calc(var(--spacing, 0.25rem) * 2);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:has(*:is(.badge:last-child)) {
      padding-right: calc(var(--spacing, 0.25rem) * 1.5);
    }
    &:has(>svg) {
      padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    }
  }
  .cn-button-size-sm {
    height: calc(var(--spacing, 0.25rem) * 8);
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    border-radius: var(--radius);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-xs, 0.75rem);
    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    &:has(>svg) {
      padding-inline: calc(var(--spacing, 0.25rem) * 2);
    }
  }
  .cn-button-size-lg {
    height: calc(var(--spacing, 0.25rem) * 10);
    border-radius: var(--radius);
    padding-inline: calc(var(--spacing, 0.25rem) * 5);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    &:has(*:is(.badge:last-child)) {
      padding-right: calc(var(--spacing, 0.25rem) * 3);
    }
    &:has(>svg) {
      padding-inline: calc(var(--spacing, 0.25rem) * 4);
    }
    & .badge:last-child {
      margin-left: calc(var(--spacing, 0.25rem) * 1.5);
    }
  }
  .cn-card {
    border-radius: calc(var(--radius) + 4px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--card);
    color: var(--card-foreground);
    --tw-shadow: var(--shadow-lg);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-card-header {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .cn-card-content {
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .cn-card-footer {
    padding-inline: calc(var(--spacing, 0.25rem) * 6);
  }
  .cn-input {
    border-radius: var(--radius);
  }
  .cn-input[data-size="sm"] {
    height: calc(var(--spacing, 0.25rem) * 8);
    padding-inline: calc(var(--spacing, 0.25rem) * 2.5);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    @media (width >= 48rem) {
      font-size: var(--text-xs, 0.75rem);
      line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
    }
  }
  .cn-input[data-size="default"] {
    height: calc(var(--spacing, 0.25rem) * 9);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 1);
    @media (width >= 48rem) {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
  }
  .cn-input[data-size="lg"] {
    height: calc(var(--spacing, 0.25rem) * 10);
    padding-inline: calc(var(--spacing, 0.25rem) * 3.5);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    @media (width >= 48rem) {
      font-size: var(--text-base, 1rem);
      line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    }
  }
  .cn-textarea {
    border-radius: calc(var(--radius) - 2px);
    background-color: transparent;
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-base, 1rem);
    line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
    --tw-shadow: var(--shadow-xs);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    @media (width >= 48rem) {
      font-size: var(--text-sm, 0.875rem);
      line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
  }
  .cn-select-trigger, .cn-native-select, .cn-combobox-trigger {
    border-radius: var(--radius);
  }
  .cn-select-trigger {
    gap: calc(var(--spacing, 0.25rem) * 1.5);
    padding-inline: calc(var(--spacing, 0.25rem) * 3);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-select-trigger-icon {
    margin-right: calc(var(--spacing, 0.25rem) * -0.75);
    width: calc(var(--spacing, 0.25rem) * 4);
    height: calc(var(--spacing, 0.25rem) * 4);
    color: var(--muted-foreground);
  }
  .cn-dropdown-menu-content, .cn-popover-content, .cn-tooltip-content, .cn-select-content, .cn-combobox-content, .cn-hover-card-content {
    border-radius: var(--radius);
    --tw-shadow: var(--shadow-md);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .cn-dropdown-menu-item {
    gap: calc(var(--spacing, 0.25rem) * 2);
    border-radius: calc(var(--radius) - 4px);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
  }
  .cn-dropdown-menu-label {
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    padding-block: calc(var(--spacing, 0.25rem) * 1.5);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
  }
  .cn-dropdown-menu-shortcut {
    margin-left: auto;
  }
  .cn-alert {
    display: grid;
    align-items: flex-start;
    row-gap: calc(var(--spacing, 0.25rem) * 0.5);
    border-radius: calc(var(--radius) + 4px);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--border);
    background-color: var(--card);
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 3);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    &:has(>svg) {
      grid-template-columns: calc(var(--spacing) * 4) 1fr;
    }
    &:has(>svg) {
      column-gap: calc(var(--spacing, 0.25rem) * 3);
    }
    &>svg {
      width: calc(var(--spacing, 0.25rem) * 4);
      height: calc(var(--spacing, 0.25rem) * 4);
    }
    &>svg {
      --tw-translate-y: calc(var(--spacing, 0.25rem) * 0.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    &>svg {
      color: currentcolor;
    }
  }
  .cn-alert-variant-default {
    color: var(--card-foreground);
  }
  .cn-alert-title {
    grid-column-start: 2;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    min-height: calc(var(--spacing, 0.25rem) * 4);
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    --tw-tracking: var(--tracking-tight, -0.025em);
    letter-spacing: var(--tracking-tight, -0.025em);
  }
  .cn-alert-description {
    grid-column-start: 2;
    display: grid;
    justify-items: start;
    gap: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
    & p {
      --tw-leading: var(--leading-relaxed, 1.625);
      line-height: var(--leading-relaxed, 1.625);
    }
  }
  .cn-table-header {
    & tr {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
  }
  .cn-table-footer {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    background-color: var(--muted);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    &>tr {
      &:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0px;
      }
    }
  }
  .cn-table-row {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
    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, cubic-bezier(0.4, 0, 0.2, 1)));
    transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
    &:hover {
      @media (hover: hover) {
        background-color: var(--muted);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--muted) 50%, transparent);
        }
      }
    }
    &[data-state="selected"] {
      background-color: var(--muted);
    }
  }
  .cn-table-head {
    height: calc(var(--spacing, 0.25rem) * 10);
    padding-inline: calc(var(--spacing, 0.25rem) * 2);
    text-align: left;
    vertical-align: middle;
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    white-space: nowrap;
    color: var(--foreground);
    &:has([role=checkbox]) {
      padding-right: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-table-cell {
    padding: calc(var(--spacing, 0.25rem) * 2);
    vertical-align: middle;
    white-space: nowrap;
    &:has([role=checkbox]) {
      padding-right: calc(var(--spacing, 0.25rem) * 0);
    }
  }
  .cn-table-caption {
    margin-top: calc(var(--spacing, 0.25rem) * 4);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--muted-foreground);
  }
  .cn-item {
    border-radius: var(--radius);
  }
  .cn-tabs-list-variant-indicator, .cn-tabs-list-variant-default {
    border-radius: var(--radius);
  }
  .cn-tabs-trigger, .cn-toggle {
    border-radius: calc(var(--radius) - 2px);
  }
  .cn-toggle-group {
    border-radius: calc(var(--radius) - 2px);
  }
  .cn-toggle-group-item {
    border-radius: 0;
    &:is(:where(.group\/toggle-group)[data-orientation="horizontal"] *) {
      &:first-child {
        border-start-start-radius: calc(var(--radius) - 2px);
        border-end-start-radius: calc(var(--radius) - 2px);
      }
    }
    &:is(:where(.group\/toggle-group)[data-orientation="vertical"] *) {
      &:first-child {
        border-top-left-radius: calc(var(--radius) - 2px);
        border-top-right-radius: calc(var(--radius) - 2px);
      }
    }
    &:is(:where(.group\/toggle-group)[data-orientation="horizontal"] *) {
      &:last-child {
        border-start-end-radius: calc(var(--radius) - 2px);
        border-end-end-radius: calc(var(--radius) - 2px);
      }
    }
    &:is(:where(.group\/toggle-group)[data-orientation="vertical"] *) {
      &:last-child {
        border-bottom-right-radius: calc(var(--radius) - 2px);
        border-bottom-left-radius: calc(var(--radius) - 2px);
      }
    }
  }
  .cn-badge {
    border-radius: calc(infinity * 1px);
  }
  .cn-menu-translucent {
    position: relative;
    background-color: var(--popover);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--popover) 70%, transparent);
    }
    &::before {
      content: var(--tw-content);
      pointer-events: none;
    }
    &::before {
      content: var(--tw-content);
      position: absolute;
    }
    &::before {
      content: var(--tw-content);
      inset: calc(var(--spacing, 0.25rem) * 0);
    }
    &::before {
      content: var(--tw-content);
      z-index: calc(1 * -1);
    }
    &::before {
      content: var(--tw-content);
      border-radius: inherit;
    }
    &::before {
      content: var(--tw-content);
      --tw-backdrop-blur: blur(var(--blur-2xl, 40px));
      -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,);
    }
    &::before {
      content: var(--tw-content);
      --tw-backdrop-saturate: saturate(150%);
      -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,);
    }
    :is(& *) {
      &[data-slot$="-item"] {
        &:focus {
          background-color: var(--foreground);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--foreground) 10%, transparent);
          }
        }
      }
    }
    :is(& *) {
      &[data-slot$="-item"] {
        &[data-highlighted] {
          background-color: var(--foreground);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--foreground) 10%, transparent);
          }
        }
      }
    }
    :is(& *) {
      &[data-slot$="-separator"] {
        background-color: var(--foreground);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--foreground) 5%, transparent);
        }
      }
    }
    :is(& *) {
      &[data-slot$="-trigger"] {
        &:focus {
          background-color: var(--foreground);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--foreground) 10%, transparent);
          }
        }
      }
    }
    :is(& *) {
      &[data-slot$="-trigger"] {
        &[aria-expanded="true"] {
          background-color: var(--foreground) !important;
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--foreground) 10%, transparent) !important;
          }
        }
      }
    }
    :is(& *) {
      &[data-variant="destructive"] {
        :is(& *) {
          color: var(--accent-foreground) !important;
        }
      }
    }
    :is(& *) {
      &[data-variant="destructive"] {
        color: var(--accent-foreground) !important;
      }
    }
    :is(& *) {
      &[data-variant="destructive"] {
        &:focus {
          background-color: var(--foreground) !important;
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--foreground) 10%, transparent) !important;
          }
        }
      }
    }
  }
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  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: 0px;
}
@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-content {
  syntax: "*";
  initial-value: "";
  inherits: false;
}
@property --tw-duration {
  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-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-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@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-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;
}
@keyframes enter {
  from {
    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));
    filter: blur(var(--tw-enter-blur,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));
    filter: blur(var(--tw-exit-blur,0));
  }
}
@keyframes accordion-down {
  from {
    height: 0;
  }
  to {
    height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))));
  }
}
@keyframes accordion-up {
  from {
    height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))));
  }
  to {
    height: 0;
  }
}
@keyframes caret-blink {
  0%,70%,100% {
    opacity: 1;
  }
  20%,50% {
    opacity: 0;
  }
}
@keyframes enter {
  from {
    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));
    filter: blur(var(--tw-enter-blur,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));
    filter: blur(var(--tw-exit-blur,0));
  }
}
@keyframes accordion-down {
  from {
    height: 0;
  }
  to {
    height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))));
  }
}
@keyframes accordion-up {
  from {
    height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))));
  }
  to {
    height: 0;
  }
}
@keyframes caret-blink {
  0%,70%,100% {
    opacity: 1;
  }
  20%,50% {
    opacity: 0;
  }
}
@keyframes accordion-down {
  from {
    height: 0;
  }
  to {
    height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) );
  }
}
@keyframes accordion-up {
  from {
    height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) );
  }
  to {
    height: 0;
  }
}
@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-animation-delay: 0s;
      --tw-animation-direction: normal;
      --tw-animation-duration: initial;
      --tw-animation-fill-mode: none;
      --tw-animation-iteration-count: 1;
      --tw-enter-blur: 0;
      --tw-enter-opacity: 1;
      --tw-enter-rotate: 0;
      --tw-enter-scale: 1;
      --tw-enter-translate-x: 0;
      --tw-enter-translate-y: 0;
      --tw-exit-blur: 0;
      --tw-exit-opacity: 1;
      --tw-exit-rotate: 0;
      --tw-exit-scale: 1;
      --tw-exit-translate-x: 0;
      --tw-exit-translate-y: 0;
      --tw-border-style: solid;
      --tw-font-weight: 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-content: "";
      --tw-duration: 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-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-leading: initial;
      --tw-tracking: initial;
      --tw-outline-style: solid;
      --tw-ease: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
    }
  }
}
