/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
@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-border-style: solid;
            --tw-content: "";
            --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-space-x-reverse: 0;
            --tw-leading: initial;
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-duration: initial;
            --tw-ease: initial;
            --tw-font-weight: initial;
            --tw-ordinal: initial;
            --tw-slashed-zero: initial;
            --tw-numeric-figure: initial;
            --tw-numeric-spacing: initial;
            --tw-numeric-fraction: initial;
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-scale-z: 1;
            --tw-tracking: initial;
            --tw-outline-style: solid;
            --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
        }
    }
}

@layer theme {
    :root, :host {
        --font-sans: "Geist Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        --color-black: #000;
        --color-white: #fff;
        --spacing: .25rem;
        --container-xs: 20rem;
        --container-sm: 24rem;
        --container-md: 28rem;
        --container-lg: 32rem;
        --text-xs: .75rem;
        --text-xs--line-height: calc(1 / .75);
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25 / .875);
        --text-base: 1rem;
        --text-base--line-height: calc(1.5 / 1);
        --text-lg: 1.125rem;
        --text-lg--line-height: calc(1.75 / 1.125);
        --font-weight-normal: 400;
        --font-weight-medium: 500;
        --font-weight-semibold: 600;
        --tracking-tight: -.025em;
        --tracking-widest: .1em;
        --leading-snug: 1.375;
        --leading-normal: 1.5;
        --leading-relaxed: 1.625;
        --radius-sm: calc(var(--radius) - 4px);
        --radius-md: calc(var(--radius) - 2px);
        --radius-lg: var(--radius);
        --radius-xl: calc(var(--radius) + 4px);
        --radius-2xl: 1rem;
        --radius-4xl: 2rem;
        --ease-out: cubic-bezier(0, 0, .2, 1);
        --ease-in-out: cubic-bezier(.4, 0, .2, 1);
        --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
        --blur-xs: 4px;
        --aspect-video: 16 / 9;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-font-family: var(--font-sans);
        --default-mono-font-family: var(--font-mono);
        --color-background: var(--background);
        --color-foreground: var(--foreground);
        --color-card: var(--card);
        --color-card-foreground: var(--card-foreground);
        --color-popover: var(--popover);
        --color-popover-foreground: var(--popover-foreground);
        --color-primary: var(--primary);
        --color-primary-foreground: var(--primary-foreground);
        --color-secondary: var(--secondary);
        --color-secondary-foreground: var(--secondary-foreground);
        --color-muted: var(--muted);
        --color-muted-foreground: var(--muted-foreground);
        --color-accent: var(--accent);
        --color-accent-foreground: var(--accent-foreground);
        --color-destructive: var(--destructive);
        --color-border: var(--border);
        --color-input: var(--input);
        --color-ring: var(--ring);
        --color-sidebar: var(--sidebar);
        --color-sidebar-foreground: var(--sidebar-foreground);
        --color-sidebar-accent: var(--sidebar-accent);
        --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
        --color-sidebar-border: var(--sidebar-border);
        --color-sidebar-ring: var(--sidebar-ring)
    }
}

@layer base {
    *, :after, :before, ::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html, :host {
        -webkit-text-size-adjust: 100%;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings,normal);
        font-variation-settings: var(--default-font-variation-settings,normal);
        -webkit-tap-highlight-color: transparent
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr:where([title]) {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }

    h1, h2, h3, h4, h5, h6 {
        font-size: inherit;
        font-weight: inherit
    }

    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }

    b, strong {
        font-weight: bolder
    }

    code, kbd, samp, pre {
        font-family: var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings,normal);
        font-variation-settings: var(--default-mono-font-variation-settings,normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub, sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol, ul, menu {
        list-style: none
    }

    img, svg, video, canvas, audio, iframe, embed, object {
        vertical-align: middle;
        display: block
    }

    img, video {
        max-width: 100%;
        height: auto
    }

    button, input, select, optgroup, textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    :where(select:is([multiple],[size])) optgroup {
        font-weight: bolder
    }

        :where(select:is([multiple],[size])) optgroup option {
            padding-inline-start: 20px
        }

    ::file-selector-button {
        margin-inline-end: 4px
    }

    ::placeholder {
        opacity: 1
    }

    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color: currentColor
        }

        @supports (color:color-mix(in lab, red, red)) {
            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }
        }
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-block: 0
    }

    ::-webkit-datetime-edit-year-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-month-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-day-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-hour-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-minute-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-second-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-millisecond-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-meridiem-field {
        padding-block: 0
    }

    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }

    :-moz-ui-invalid {
        box-shadow: none
    }

    button, input:where([type=button],[type=reset],[type=submit]) {
        appearance: button
    }

    ::file-selector-button {
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]:where(:not([hidden=until-found])) {
        display: none !important
    }

    * {
        border-color: var(--color-border);
        outline-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        * {
            outline-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    html {
        scroll-behavior: smooth
    }

    body {
        overscroll-behavior: none;
        background-color: var(--color-background);
        color: var(--color-foreground)
    }
}

@layer components {
    .accordion {
        flex-direction: column;
        width: 100%;
        display: flex
    }

        .accordion > details > summary {
            cursor: pointer;
            border-style: var(--tw-border-style);
            width: 100%;
            transition-property: all;
            transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
            transition-duration: var(--tw-duration,var(--default-transition-duration));
            --tw-outline-style: none;
            border-width: 1px;
            border-color: #0000;
            outline-style: none;
            flex: 1;
            justify-content: space-between;
            align-items: flex-start;
            list-style-type: none;
            display: flex;
            position: relative
        }

            .accordion > details > summary > svg:last-child {
                pointer-events: none;
                transition-property: transform,translate,scale,rotate;
                transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
                transition-duration: var(--tw-duration,var(--default-transition-duration));
                flex-shrink: 0
            }

        .accordion > details[open] > summary > svg:last-child {
            rotate: 180deg
        }

        .accordion > details[aria-disabled=true] > summary, .accordion > details > summary[aria-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .accordion > details > :not(summary) {
            overflow: hidden
        }

    .alert {
        width: 100%;
        position: relative
    }

        .alert:has(>footer) {
            padding-inline-end: 4.5rem
        }

        .alert > :is(h2,h3,h4,h5,h6,strong,[data-title]) {
            min-height: calc(var(--spacing) * 4)
        }

        .alert > section {
            justify-items: start;
            gap: var(--spacing);
            display: grid
        }

            .alert > section :where(p,ul,ol) {
                margin: 0
            }

                .alert > section :where(p,ul,ol):not(:last-child) {
                    margin-bottom: calc(var(--spacing) * 4)
                }

            .alert > section ul {
                list-style-type: disc;
                list-style-position: inside
            }

            .alert > section ol {
                list-style-type: decimal;
                list-style-position: inside
            }

        .alert > footer {
            position: absolute
        }

    .avatar {
        appearance: none;
        border-style: var(--tw-border-style);
        vertical-align: middle;
        --tw-outline-style: none;
        -webkit-user-select: none;
        user-select: none;
        background-color: #0000;
        border-width: 0;
        outline-style: none;
        flex-shrink: 0;
        padding: 0;
        display: inline-flex;
        position: relative
    }

        .avatar:after {
            content: var(--tw-content);
            content: var(--tw-content);
            content: var(--tw-content);
            border-radius: inherit;
            content: var(--tw-content);
            border-style: var(--tw-border-style);
            content: var(--tw-content);
            border-width: 1px;
            border-color: var(--color-border);
            content: var(--tw-content);
            mix-blend-mode: darken;
            position: absolute;
            inset: 0
        }

        .avatar: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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .avatar:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .avatar:is(html.dark *):after {
        content: var(--tw-content);
        mix-blend-mode: lighten
    }

    .avatar > img {
        aspect-ratio: 1;
        border-radius: inherit;
        object-fit: cover;
        width: 100%;
        height: 100%;
        position: absolute;
        inset: 0
    }

    .avatar > span:not(.avatar-badge) {
        border-radius: inherit;
        width: 100%;
        height: 100%;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        justify-content: center;
        align-items: center;
        display: flex
    }

    .avatar[data-size=sm] > span:not(.avatar-badge) {
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height))
    }

    .avatar > .avatar-badge {
        z-index: 10;
        background-blend-mode: color;
        --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);
        -webkit-user-select: none;
        user-select: none;
        inset-inline-end: calc(var(--spacing) * 0);
        border-radius: 3.40282e38px;
        justify-content: center;
        align-items: center;
        display: inline-flex;
        position: absolute;
        bottom: 0
    }

    .avatar[data-size=sm] > .avatar-badge {
        width: calc(var(--spacing) * 2);
        height: calc(var(--spacing) * 2)
    }

        .avatar[data-size=sm] > .avatar-badge > svg {
            display: none
        }

    .avatar > .avatar-badge {
        width: calc(var(--spacing) * 2.5);
        height: calc(var(--spacing) * 2.5)
    }

        .avatar > .avatar-badge > svg {
            width: calc(var(--spacing) * 2);
            height: calc(var(--spacing) * 2)
        }

    .avatar[data-size=lg] > .avatar-badge {
        width: calc(var(--spacing) * 3);
        height: calc(var(--spacing) * 3)
    }

        .avatar[data-size=lg] > .avatar-badge > svg {
            width: calc(var(--spacing) * 2);
            height: calc(var(--spacing) * 2)
        }

    .avatar-group {
        display: flex
    }

    :where(.avatar-group>:not(:last-child)) {
        --tw-space-x-reverse: 0;
        margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
        margin-inline-end: calc(calc(var(--spacing) * -2) * calc(1 - var(--tw-space-x-reverse)))
    }

    .avatar-group > .avatar, .avatar-group > [data-count] {
        --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);
        --tw-ring-color: var(--color-background)
    }

    .avatar-group > [data-count] {
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex;
        position: relative
    }

    .badge {
        white-space: nowrap;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: fit-content;
        display: inline-flex;
        overflow: hidden
    }

        .badge:focus-visible {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .badge:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .badge[aria-invalid=true] {
        border-color: var(--color-destructive);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .badge[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .badge:is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .badge:is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .badge > svg {
        pointer-events: none
    }

    .breadcrumb > ol {
        overflow-wrap: break-word;
        flex-wrap: wrap;
        align-items: center;
        margin: 0;
        padding: 0;
        list-style-type: none;
        display: flex
    }

    .breadcrumb li {
        align-items: center;
        display: inline-flex
    }

    .breadcrumb a {
        border-radius: var(--radius-sm);
        --tw-outline-style: none;
        outline-style: none
    }

        .breadcrumb a: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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .breadcrumb a:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .breadcrumb [aria-current=page] {
        cursor: default
    }

    .breadcrumb li[aria-hidden=true] {
        -webkit-user-select: none;
        user-select: none
    }

    .breadcrumb li > span[aria-hidden=true] {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .breadcrumb [data-rtl-flip]:where(:dir(rtl),[dir=rtl],[dir=rtl] *) {
        rotate: 180deg
    }

    .btn {
        white-space: nowrap;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-outline-style: none;
        -webkit-user-select: none;
        user-select: none;
        outline-style: none;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

        .btn:disabled {
            pointer-events: none;
            opacity: .5
        }

        .btn svg {
            pointer-events: none;
            flex-shrink: 0
        }

    .button-group {
        isolation: isolate;
        align-items: stretch;
        width: fit-content;
        display: inline-flex
    }

        .button-group:has(>:is(.dropdown-menu,.popover,.select)>[data-popover][aria-hidden=false]) {
            z-index: 50;
            position: relative
        }

        .button-group > .input {
            flex: 1
        }

        .button-group > :focus-visible, .button-group > :is(.dropdown-menu,.popover,.select) > button:focus-visible {
            z-index: 10;
            position: relative
        }

        .button-group > hr[role=separator] {
            border-style: var(--tw-border-style);
            border-width: 0;
            flex-shrink: 0;
            align-self: stretch;
            width: 1px;
            height: auto;
            margin-block: 1px;
            margin-inline: 0;
            position: relative
        }

        .button-group:not([data-orientation=vertical]) > :not(:first-child), .button-group:not([data-orientation=vertical]) > :is(.dropdown-menu,.popover,.select):not(:first-child) > button {
            border-inline-start-style: var(--tw-border-style);
            border-inline-start-width: 0;
            border-start-start-radius: 0;
            border-end-start-radius: 0
        }

        .button-group:not([data-orientation=vertical]) > :not(:last-child), .button-group:not([data-orientation=vertical]) > :is(.dropdown-menu,.popover,.select):not(:last-child) > button {
            border-start-end-radius: 0;
            border-end-end-radius: 0
        }

        .button-group[data-orientation=vertical] {
            flex-direction: column
        }

            .button-group[data-orientation=vertical] > hr[role=separator] {
                width: auto;
                height: 1px;
                margin-block: 0;
                margin-inline: 1px
            }

            .button-group[data-orientation=vertical] > :not(:first-child), .button-group[data-orientation=vertical] > :is(.dropdown-menu,.popover,.select):not(:first-child) > button {
                border-top-style: var(--tw-border-style);
                border-top-width: 0;
                border-top-left-radius: 0;
                border-top-right-radius: 0
            }

            .button-group[data-orientation=vertical] > :not(:last-child), .button-group[data-orientation=vertical] > :is(.dropdown-menu,.popover,.select):not(:last-child) > button {
                border-bottom-right-radius: 0;
                border-bottom-left-radius: 0
            }

        .button-group > :is(span,label,output) {
            align-items: center;
            display: flex
        }

            .button-group > :is(span,label,output) svg {
                pointer-events: none
            }

    .card {
        flex-direction: column;
        display: flex
    }

        .card > header {
            grid-auto-rows: min-content;
            align-items: flex-start;
            display: grid;
            container: card-header/inline-size
        }

            .card > header:has(>[data-slot=card-action],>.card-action) {
                grid-template-columns: 1fr auto
            }

            .card > header:has(>p) {
                grid-template-rows: auto auto
            }

            .card > header > :is(h2,h3,[data-title],.card-title) {
                --tw-leading: 1;
                line-height: 1
            }

            .card > header > :is([data-slot=card-action],.card-action) {
                grid-row: 1/span 2;
                grid-column-start: 2;
                place-self: flex-start flex-end
            }

            .card > header > menu.card-action {
                margin: 0;
                padding: 0;
                list-style-type: none
            }

        .card > footer {
            align-items: center;
            display: flex
        }

    .chart {
        aspect-ratio: var(--aspect-video);
        width: 100%;
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        justify-content: center;
        display: flex;
        position: relative
    }

        .chart > canvas {
            width: 100%;
            height: 100%;
            display: block
        }

    .chart-tooltip {
        pointer-events: none;
        z-index: 50;
        min-width: calc(var(--spacing) * 32);
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        --tw-translate-y: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        transition-property: left,top,opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .15s;
        --tw-ease: var(--ease-out);
        transition-duration: .15s;
        transition-timing-function: var(--ease-out);
        align-items: flex-start;
        display: grid;
        position: fixed
    }

        .chart-tooltip[hidden] {
            opacity: 0
        }

    .chart-tooltip-items {
        gap: calc(var(--spacing) * 1.5);
        display: grid
    }

    .chart-tooltip-item {
        align-items: center;
        gap: calc(var(--spacing) * 2);
        flex-wrap: wrap;
        width: 100%;
        display: flex
    }

    .chart-tooltip-indicator {
        width: calc(var(--spacing) * 2.5);
        height: calc(var(--spacing) * 2.5);
        background-color: var(--chart-indicator-color);
        border-radius: 2px;
        flex-shrink: 0
    }

    .chart-legend-indicator {
        width: calc(var(--spacing) * 2);
        height: calc(var(--spacing) * 2);
        background-color: var(--chart-indicator-color);
        border-radius: 2px;
        flex-shrink: 0
    }

    .chart-tooltip-label {
        --tw-leading: 1;
        color: var(--color-muted-foreground);
        line-height: 1
    }

    .chart-tooltip-value {
        font-family: var(--font-mono);
        --tw-leading: 1;
        --tw-font-weight: var(--font-weight-medium);
        line-height: 1;
        font-weight: var(--font-weight-medium);
        --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,);
        margin-inline-start: auto
    }

    .chart-legend {
        justify-content: center;
        align-items: center;
        gap: calc(var(--spacing) * 4);
        padding-top: calc(var(--spacing) * 3);
        flex-wrap: wrap;
        display: flex
    }

    .chart-legend-item {
        align-items: center;
        gap: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        display: flex
    }

        .chart-legend-item[aria-pressed=false] {
            opacity: .7
        }

    details::details-content {
        opacity: 0;
        block-size: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete;
        display: block
    }

    details[open]::details-content {
        block-size: auto;
        block-size: calc-size(auto, size);
        opacity: 1
    }

    details summary {
        cursor: pointer;
        align-items: center;
        display: inline-flex
    }

    details > summary::-webkit-details-marker {
        display: none
    }

    .command-dialog {
        color: inherit;
        opacity: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete;
        background-color: #0000;
        max-width: none;
        max-height: none;
        padding: 0;
        inset-block: 0
    }

        .command-dialog:is([open],:popover-open), .command-dialog:is([open],:popover-open)::backdrop {
            opacity: 1
        }

            .command-dialog:is([open],:popover-open) > .command {
                --tw-scale-x: 100%;
                --tw-scale-y: 100%;
                --tw-scale-z: 100%;
                scale: var(--tw-scale-x) var(--tw-scale-y)
            }

    @starting-style {
        .command-dialog:is([open],:popover-open), .command-dialog:is([open],:popover-open)::backdrop {
            opacity: 0
        }

            .command-dialog:is([open],:popover-open) > .command {
                --tw-scale-x: 95%;
                --tw-scale-y: 95%;
                --tw-scale-z: 95%;
                scale: var(--tw-scale-x) var(--tw-scale-y)
            }
    }

    .command-dialog::backdrop {
        opacity: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete
    }

    .command-dialog > .command {
        z-index: 50;
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        --tw-translate-y: 0;
        width: 100%;
        max-width: calc(100% - 2rem);
        max-height: min(640px,100% - 2rem);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        --tw-scale-x: 95%;
        --tw-scale-y: 95%;
        --tw-scale-z: 95%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        flex-direction: column;
        display: flex;
        position: fixed;
        top: 33.3333%;
        left: 50%;
        overflow: hidden
    }

    @media (min-width:40rem) {
        .command-dialog > .command {
            max-width: var(--container-sm)
        }
    }

    .command-dialog > .command > :is(button,form[method=dialog]) {
        position: absolute
    }

    .command-dialog > .command > :is(button,form[method=dialog]>button) {
        opacity: .7;
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    @media (hover:hover) {
        .command-dialog > .command > :is(button,form[method=dialog]>button):hover {
            opacity: 1
        }
    }

    .command-dialog > .command > :is(button,form[method=dialog]>button):focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .command-dialog > .command > :is(button,form[method=dialog]>button):focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .command-dialog > .command > :is(button,form[method=dialog]>button):disabled, .command-dialog > .command > :is(button,form[method=dialog]>button) svg {
        pointer-events: none
    }

    .command-dialog > .command > :is(button,form[method=dialog]>button) svg {
        flex-shrink: 0
    }

    .command-dialog > .command > :is(button,form[method=dialog]>button) > svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .command {
        flex-direction: column;
        width: 100%;
        display: flex;
        overflow: hidden
    }

        .command > header {
            align-items: center;
            display: flex
        }

            .command > header svg {
                flex-shrink: 0
            }

            .command > header input {
                --tw-outline-style: none;
                background-color: #0000;
                outline-style: none;
                width: 100%
            }

    @media (forced-colors:active) {
        .command > header input {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .command > header input:disabled {
        cursor: not-allowed;
        opacity: .5
    }

    .command [role=menu] {
        --tw-outline-style: none;
        outline-style: none;
        overflow: hidden auto
    }

    @media (forced-colors:active) {
        .command [role=menu] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .command [role=menu] {
        scrollbar-width: none
    }

        .command [role=menu]::-webkit-scrollbar {
            display: none
        }

    .command [role=menuitem] {
        cursor: default;
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        width: 100%;
        display: flex;
        position: relative
    }

    @media (forced-colors:active) {
        .command [role=menuitem] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .command [role=menuitem] {
        -webkit-user-select: none;
        user-select: none
    }

        .command [role=menuitem]:disabled, .command [role=menuitem][aria-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .command [role=menuitem][aria-hidden=true] {
            display: none
        }

        .command [role=menuitem][data-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .command [role=menuitem] svg {
            pointer-events: none;
            flex-shrink: 0
        }

        .command [role=menuitem].active, .command [role=menuitem][data-selected=true] {
            background-color: var(--color-muted);
            color: var(--color-foreground)
        }

    .command [role=group] {
        overflow: hidden
    }

        .command [role=group]:not(:has([role=menuitem]:not([aria-hidden=true]))) {
            display: none
        }

    .command [role=heading] {
        display: flex
    }

    .command [role=separator] {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .command [data-shortcut] {
        margin-inline-start: auto
    }

    .command [data-indicator] {
        opacity: 0;
        margin-inline-start: auto
    }

    .command [role=menuitem][data-checked=true] [data-indicator], .command [role=menuitem][aria-selected=true] [data-indicator], .command [role=menuitem][data-selected=true] [data-indicator] {
        opacity: 1
    }

    .command [role=menuitem]:has([data-shortcut]) [data-indicator] {
        display: none
    }

    .command [role=menu]:not(:has([role=menuitem]:not([aria-hidden=true]))):before {
        text-overflow: ellipsis;
        white-space: nowrap;
        justify-content: center;
        align-items: center;
        display: flex;
        overflow: hidden
    }

    .command [role=menu][data-empty]:not(:has([role=menuitem]:not([aria-hidden=true]))):before {
        --tw-content: attr(data-empty);
        content: var(--tw-content)
    }

    .command [role=menu]:not([data-empty]):not(:has([role=menuitem]:not([aria-hidden=true]))):before {
        --tw-content: "No results found";
        content: var(--tw-content)
    }

    .command:not([data-command-initialized]) [role=menuitem]:not([aria-disabled=true]):not(:disabled):hover {
        background-color: var(--color-muted);
        color: var(--color-foreground)
    }

    .command:has(>header input:not(:placeholder-shown)) [role=separator] {
        display: none
    }

    .combobox {
        flex-direction: column;
        width: fit-content;
        display: inline-flex;
        position: relative
    }

        .combobox > input[role=combobox] {
            --tw-outline-style: none;
            outline-style: none;
            width: 100%;
            min-width: 0
        }

    @media (forced-colors:active) {
        .combobox > input[role=combobox] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .combobox > input[role=combobox]::placeholder {
        color: var(--color-muted-foreground)
    }

    .combobox > input[role=combobox]:disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: .5
    }

    .combobox .input-group input[role=combobox], .combobox [data-popover] input[role=combobox] {
        --tw-outline-style: none;
        outline-style: none;
        min-width: 0
    }

    @media (forced-colors:active) {
        .combobox .input-group input[role=combobox], .combobox [data-popover] input[role=combobox] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    :is(.combobox .input-group input[role=combobox],.combobox [data-popover] input[role=combobox])::placeholder {
        color: var(--color-muted-foreground)
    }

    :is(.combobox .input-group input[role=combobox],.combobox [data-popover] input[role=combobox]):disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: .5
    }

    .combobox > svg, .combobox-trigger-icon {
        pointer-events: none;
        flex-shrink: 0;
        position: absolute
    }

    .combobox:has(>.combobox-chips) > .combobox-trigger-icon {
        display: none
    }

    .combobox [data-clear] {
        width: calc(var(--spacing) * 6);
        height: calc(var(--spacing) * 6);
        cursor: default;
        appearance: none;
        border-style: var(--tw-border-style);
        color: currentColor;
        background-color: #0000;
        border-width: 0;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        padding: 0;
        display: inline-flex
    }

        .combobox [data-clear]:disabled {
            pointer-events: none;
            opacity: .5
        }

        .combobox [data-clear][hidden], .combobox .input-group:has([data-clear]:not([hidden])) button[aria-haspopup=listbox] {
            display: none
        }

    .combobox [data-popover] {
        isolation: isolate;
        min-width: max(100%,9rem);
        overflow: hidden
    }

    .combobox [role=listbox] {
        --tw-outline-style: none;
        outline-style: none;
        overflow: hidden auto
    }

    @media (forced-colors:active) {
        .combobox [role=listbox] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .combobox [role=listbox] [role=group]:not(:has([role=option]:not([aria-hidden=true]))) {
        display: none
    }

    .combobox [role=listbox]:not(:has([data-value]:not([aria-hidden=true]))):before {
        text-overflow: ellipsis;
        white-space: nowrap;
        justify-content: center;
        align-items: center;
        display: flex;
        overflow: hidden
    }

    .combobox [role=listbox][data-empty]:not(:has([data-value]:not([aria-hidden=true]))):before {
        --tw-content: attr(data-empty);
        content: var(--tw-content)
    }

    .combobox [role=listbox]:not([data-empty]):not(:has([data-value]:not([aria-hidden=true]))):before {
        --tw-content: "No results found";
        content: var(--tw-content)
    }

    .combobox [role=option] {
        cursor: default;
        text-overflow: ellipsis;
        white-space: nowrap;
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        width: 100%;
        display: flex;
        position: relative;
        overflow: hidden
    }

    @media (forced-colors:active) {
        .combobox [role=option] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .combobox [role=option] {
        -webkit-user-select: none;
        user-select: none
    }

        .combobox [role=option]:disabled, .combobox [role=option][aria-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .combobox [role=option][aria-hidden=true] {
            display: none
        }

        .combobox [role=option] svg {
            pointer-events: none;
            flex-shrink: 0
        }

        .combobox [role=option][aria-selected=true] {
            background-image: var(--check-icon);
            background-position: right .5rem center;
            background-repeat: no-repeat;
            background-size: .875rem
        }

            .combobox [role=option][aria-selected=true]:dir(rtl) {
                background-position: .5rem
            }

    .combobox [role=separator] {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .combobox [role=option].active, .combobox [role=option]:focus-visible, .combobox:not([data-combobox-initialized]) [role=option]:not([aria-disabled=true]):not(:disabled):hover {
        background-color: var(--color-accent);
        color: var(--color-accent-foreground)
    }

    .combobox-chips {
        flex-wrap: wrap;
        align-items: center;
        width: 100%;
        min-width: 0;
        display: flex
    }

        .combobox-chips > input[role=combobox] {
            min-width: calc(var(--spacing) * 16);
            --tw-outline-style: none;
            background-color: #0000;
            outline-style: none;
            flex: 1
        }

    @media (forced-colors:active) {
        .combobox-chips > input[role=combobox] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .combobox-chips > input[role=combobox]::placeholder {
        color: var(--color-muted-foreground)
    }

    .combobox-chips > input[role=combobox]:disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: .5
    }

    .combobox-chip {
        white-space: nowrap;
        flex-shrink: 0;
        align-items: center;
        width: fit-content;
        display: inline-flex
    }

    .combobox-chip-remove {
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    .dialog, .alert-dialog {
        color: inherit;
        opacity: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete;
        background-color: #0000;
        padding: 0
    }

    :is(.dialog,.alert-dialog)::backdrop {
        opacity: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete
    }

    .dialog, .alert-dialog {
        max-width: none;
        max-height: none
    }

    :is(.dialog,.alert-dialog):is([open],:popover-open), :is(.dialog,.alert-dialog):is([open],:popover-open)::backdrop {
        opacity: 1
    }

        :is(.dialog,.alert-dialog):is([open],:popover-open) > * {
            --tw-scale-x: 100%;
            --tw-scale-y: 100%;
            --tw-scale-z: 100%;
            scale: var(--tw-scale-x) var(--tw-scale-y)
        }

    @starting-style {
        :is(.dialog,.alert-dialog):is([open],:popover-open), :is(.dialog,.alert-dialog):is([open],:popover-open)::backdrop {
            opacity: 0
        }

            :is(.dialog,.alert-dialog):is([open],:popover-open) > * {
                --tw-scale-x: 95%;
                --tw-scale-y: 95%;
                --tw-scale-z: 95%;
                scale: var(--tw-scale-x) var(--tw-scale-y)
            }
    }

    :is(.dialog,.alert-dialog) > * {
        z-index: 50;
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
        width: 100%;
        max-height: calc(100% - 2rem);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        --tw-scale-x: 95%;
        --tw-scale-y: 95%;
        --tw-scale-z: 95%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
        --tw-outline-style: none;
        outline-style: none;
        flex-direction: column;
        display: flex;
        position: fixed;
        top: 50%;
        left: 50%
    }

    @media (forced-colors:active) {
        :is(.dialog,.alert-dialog) > * {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    :is(.dialog,.alert-dialog) > * {
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .dialog > * > header {
        flex-direction: column;
        display: flex
    }

    .dialog > * > section {
        flex: 1
    }

    .dialog > * > footer {
        flex-direction: column-reverse;
        display: flex
    }

    @media (min-width:40rem) {
        .dialog > * > footer {
            flex-direction: row;
            justify-content: flex-end
        }
    }

    .dialog > * > :is(button,form[method=dialog]) {
        position: absolute
    }

    .dialog > * > :is(button,form[method=dialog]>button) {
        opacity: .7;
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    @media (hover:hover) {
        .dialog > * > :is(button,form[method=dialog]>button):hover {
            opacity: 1
        }
    }

    .dialog > * > :is(button,form[method=dialog]>button):focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .dialog > * > :is(button,form[method=dialog]>button):focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .dialog > * > :is(button,form[method=dialog]>button):disabled, .dialog > * > :is(button,form[method=dialog]>button) svg {
        pointer-events: none
    }

    .dialog > * > :is(button,form[method=dialog]>button) svg {
        flex-shrink: 0
    }

    .dialog > * > :is(button,form[method=dialog]>button) > svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .alert-dialog > * > header {
        text-align: center;
        grid-template-rows: auto 1fr;
        place-items: center;
        display: grid
    }

    @media (min-width:40rem) {
        .alert-dialog > * > header {
            text-align: start;
            place-items: start
        }
    }

    .alert-dialog > * > header:has(>figure) {
        grid-template-rows: auto auto 1fr
    }

    @media (min-width:40rem) {
        .alert-dialog > * > header:has(>figure) {
            grid-template-rows: auto 1fr
        }
    }

    .alert-dialog > * > header > figure {
        flex-shrink: 0;
        margin: 0
    }

    @media (min-width:40rem) {
        .alert-dialog > * > header > figure {
            grid-row: span 2/span 2
        }
    }

    .alert-dialog > * > header > figure svg {
        pointer-events: none;
        flex-shrink: 0
    }

    .alert-dialog > * > header > figure:has(img) {
        overflow: hidden
    }

        .alert-dialog > * > header > figure:has(img) img {
            object-fit: cover;
            width: 100%;
            height: 100%
        }

    @media (min-width:40rem) {
        .alert-dialog > * > header:has(>figure) > :is(h2,p) {
            grid-column-start: 2
        }
    }

    .alert-dialog > * > footer {
        flex-direction: column-reverse;
        display: flex
    }

    @media (min-width:40rem) {
        .alert-dialog > * > footer {
            flex-direction: row;
            justify-content: flex-end
        }

        .alert-dialog[data-size=sm] > * > header, .alert-dialog > [data-size=sm] > header {
            text-align: center;
            place-items: center
        }

            .alert-dialog[data-size=sm] > * > header:has(>figure), .alert-dialog > [data-size=sm] > header:has(>figure) {
                grid-template-rows: auto auto 1fr
            }

                .alert-dialog[data-size=sm] > * > header:has(>figure) > :is(h2,p), .alert-dialog > [data-size=sm] > header:has(>figure) > :is(h2,p) {
                    grid-column-start: auto
                }
    }

    .alert-dialog[data-size=sm] > * > footer, .alert-dialog > [data-size=sm] > footer {
        grid-template-columns: repeat(2,minmax(0,1fr));
        display: grid
    }

    @media (min-width:40rem) {
        .alert-dialog[data-size=sm] > * > footer, .alert-dialog > [data-size=sm] > footer {
            grid-template-columns: repeat(2,minmax(0,1fr));
            display: grid
        }
    }

    .drawer {
        width: auto;
        max-width: none;
        height: auto;
        max-height: none;
        color: inherit;
        opacity: 0;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-behavior: allow-discrete;
        --tw-duration: .5s;
        --tw-ease: cubic-bezier(.32,.72,0,1);
        background-color: #0000;
        margin: 0;
        padding: 0;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(.32,.72,0,1);
        position: fixed;
        inset: 0;
        overflow: visible
    }

        .drawer::backdrop {
            opacity: 0;
            transition-property: all;
            transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
            transition-duration: var(--tw-duration,var(--default-transition-duration));
            transition-behavior: allow-discrete;
            --tw-duration: .5s;
            --tw-ease: cubic-bezier(.32,.72,0,1);
            transition-duration: .5s;
            transition-timing-function: cubic-bezier(.32,.72,0,1)
        }

        .drawer > * {
            z-index: 50;
            --tw-outline-style: none;
            outline-style: none;
            flex-direction: column;
            height: auto;
            display: flex;
            position: fixed
        }

    @media (forced-colors:active) {
        .drawer > * {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .drawer > * {
        transition-property: transform,translate,scale,rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .5s;
        --tw-ease: cubic-bezier(.32,.72,0,1);
        will-change: transform;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(.32,.72,0,1)
    }

    .drawer:not([data-side]) > *, .drawer[data-side=bottom] > * {
        margin-top: calc(var(--spacing) * 24);
        --tw-translate-y: 100%;
        max-height: 80vh;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        inset-inline: 0;
        bottom: 0
    }

    .drawer[data-side=top] > * {
        margin-bottom: calc(var(--spacing) * 24);
        --tw-translate-y: -100%;
        max-height: 80vh;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        inset-inline: 0;
        top: 0
    }

    .drawer[data-side=left] > * {
        width: 75%;
        max-width: var(--container-sm);
        --tw-translate-x: -100%;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        inset-block: 0;
        left: 0
    }

    .drawer[data-side=right] > * {
        width: 75%;
        max-width: var(--container-sm);
        --tw-translate-x: 100%;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        inset-block: 0;
        right: 0
    }

    .drawer[data-closing], .drawer[data-closing]::backdrop {
        opacity: 0
    }

        .drawer[data-closing]:not([data-side]) > *, .drawer[data-closing][data-side=bottom] > * {
            --tw-translate-y: 100%;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

        .drawer[data-closing][data-side=top] > * {
            --tw-translate-y: -100%;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

        .drawer[data-closing][data-side=left] > * {
            --tw-translate-x: -100%;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

        .drawer[data-closing][data-side=right] > * {
            --tw-translate-x: 100%;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

    .drawer:is([open],:popover-open):not([data-closing]), .drawer:is([open],:popover-open):not([data-closing])::backdrop {
        opacity: 1
    }

        .drawer:is([open],:popover-open):not([data-closing]) > * {
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

    @starting-style {
        .drawer:is([open],:popover-open):not([data-closing]), .drawer:is([open],:popover-open):not([data-closing])::backdrop {
            opacity: 0
        }

            .drawer:is([open],:popover-open):not([data-closing]):not([data-side]) > *, .drawer:is([open],:popover-open):not([data-closing])[data-side=bottom] > * {
                --tw-translate-y: 100%;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            .drawer:is([open],:popover-open):not([data-closing])[data-side=top] > * {
                --tw-translate-y: -100%;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            .drawer:is([open],:popover-open):not([data-closing])[data-side=left] > * {
                --tw-translate-x: -100%;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            .drawer:is([open],:popover-open):not([data-closing])[data-side=right] > * {
                --tw-translate-x: 100%;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }
    }

    .drawer > * > header {
        flex-direction: column;
        display: flex
    }

    .drawer > * > section {
        flex: 1;
        min-height: 0;
        overflow-y: auto
    }

    .drawer > * > footer {
        flex-direction: column;
        margin-top: auto;
        display: flex
    }

    .dropdown-menu {
        display: inline-flex;
        position: relative
    }

        .dropdown-menu > [data-popover] {
            min-width: anchor-size(width)
        }

        .dropdown-menu [role=menu] {
            --tw-outline-style: none;
            outline-style: none
        }

    @media (forced-colors:active) {
        .dropdown-menu [role=menu] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) {
        cursor: default;
        text-overflow: ellipsis;
        white-space: nowrap;
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        width: 100%;
        display: flex;
        position: relative;
        overflow: hidden
    }

    @media (forced-colors:active) {
        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) {
        -webkit-user-select: none;
        user-select: none
    }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]):disabled, .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio])[aria-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio])[aria-hidden=true] {
            display: none
        }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) svg {
            pointer-events: none;
            flex-shrink: 0
        }

    .dropdown-menu [role=menu] [role=heading] {
        display: flex
    }

    .dropdown-menu [role=separator] {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .dropdown-menu :is([data-shortcut],kbd:last-child,.kbd:last-child) {
        text-align: end;
        flex-shrink: 0;
        margin-inline-start: auto
    }

    .dropdown-menu [data-shortcut], .dropdown-menu :is(kbd:last-child,.kbd:last-child):not([data-shortcut]) {
        padding-inline-start: calc(var(--spacing) * 8)
    }

    .dropdown-menu [data-indicator] {
        pointer-events: none;
        visibility: hidden
    }

    .dropdown-menu :is([role=menuitemcheckbox],[role=menuitemradio])[aria-checked=true] [data-indicator] {
        visibility: visible
    }

    .dropdown-menu [data-rtl-flip]:where(:dir(rtl),[dir=rtl],[dir=rtl] *) {
        rotate: 180deg
    }

    .dropdown-menu:not([data-dropdown-menu-initialized]) :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]):not([aria-disabled=true]):not(:disabled):hover {
        background-color: var(--color-accent);
        color: var(--color-accent-foreground)
    }

    .empty {
        text-align: center;
        text-wrap: balance;
        flex-direction: column;
        flex: 1;
        justify-content: center;
        align-items: center;
        width: 100%;
        min-width: 0;
        display: flex
    }

        .empty > header {
            max-width: var(--container-sm);
            flex-direction: column;
            align-items: center;
            display: flex
        }

        .empty figure {
            flex-shrink: 0;
            justify-content: center;
            align-items: center;
            display: flex
        }

            .empty figure svg {
                pointer-events: none;
                flex-shrink: 0
            }

            .empty figure:has(img) {
                overflow: hidden
            }

                .empty figure:has(img) img {
                    object-fit: cover;
                    width: 100%;
                    height: 100%
                }

        .empty > :is(section,footer) {
            width: 100%;
            max-width: var(--container-sm);
            text-wrap: balance;
            flex-direction: column;
            align-items: center;
            min-width: 0;
            display: flex
        }

        .empty > header > p > a {
            text-underline-offset: 4px;
            text-decoration-line: underline
        }

            .empty > header > p > a:hover {
                color: var(--color-primary)
            }

    .fieldset {
        flex-direction: column;
        display: flex
    }

        .fieldset > :is([role=group],[role=radiogroup]):not(.field), .field > :is(fieldset,[role=group],[role=radiogroup]):not(.field) {
            flex-direction: column;
            width: 100%;
            display: flex;
            container: field-group/inline-size
        }

    .field {
        flex-direction: column;
        width: 100%;
        display: flex
    }

        .field > * {
            width: 100%
        }

        .field > .sr-only {
            width: auto
        }

        .field[data-orientation=horizontal] {
            flex-direction: row;
            align-items: center
        }

            .field[data-orientation=horizontal]:has(>section) {
                align-items: flex-start
            }

            .field[data-orientation=horizontal] p {
                text-wrap: balance
            }

            .field[data-orientation=horizontal] > * {
                width: auto
            }

            .field[data-orientation=horizontal]:has(>section) > [type=checkbox], .field[data-orientation=horizontal]:has(>section) [type=radio] {
                margin-top: 1px
            }

            .field[data-orientation=horizontal] > label {
                flex: auto
            }

            .field[data-orientation=horizontal]:has(>section) > section {
                flex: 1
            }

        .field[data-orientation=responsive] {
            flex-direction: column
        }

    @container field-group (min-width:28rem) {
        .field[data-orientation=responsive] {
            flex-direction: row;
            align-items: center
        }

            .field[data-orientation=responsive]:has(>section) {
                align-items: flex-start
            }

            .field[data-orientation=responsive] > * {
                width: auto
            }

            .field[data-orientation=responsive]:has(>section) > [type=checkbox], .field[data-orientation=responsive]:has(>section) [type=radio] {
                margin-top: 1px
            }

            .field[data-orientation=responsive] > label {
                flex: auto
            }
    }

    .field section {
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug);
        flex-direction: column;
        flex: 1;
        display: flex
    }

    .field h2, .field h3 {
        align-items: center;
        width: fit-content;
        display: flex
    }

    .field [role=alert] {
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal)
    }

        .field [role=alert] ul {
            gap: var(--spacing);
            flex-direction: column;
            margin-inline-start: calc(var(--spacing) * 4);
            list-style-type: disc;
            display: flex
        }

    .field > label, .field > section > label, label:has(>.field) {
        width: fit-content
    }

        .field > label:has(>.field), .field > label:has(input[type=radio]), .field > label:has(input[type=checkbox]), .field > label:has(input[role=switch]), label:has(>.field) {
            width: 100%
        }

        .field > label:has(>.field), label:has(>.field) {
            flex-direction: column
        }

    .fieldset legend + p, .field > p, .field section > p {
        --tw-leading: var(--leading-normal);
        line-height: var(--leading-normal);
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal)
    }

    :is(.fieldset legend+p,.field>p,.field section>p) > a {
        text-underline-offset: 4px;
        text-decoration-line: underline
    }

        :is(.fieldset legend+p,.field>p,.field section>p) > a:hover {
            color: var(--color-primary)
        }

    :is(.field>p,.field section>p):last-child {
        margin-top: 0
    }

    :is(.field>p,.field section>p):nth-last-child(2) {
        margin-top: calc(var(--spacing) * -1)
    }

    .field-separator {
        position: relative
    }

        .field-separator > hr[role=separator] {
            inset-inline: 0;
            position: absolute;
            top: 50%
        }

        .field-separator > span {
            background-color: var(--color-background);
            width: fit-content;
            margin-inline: auto;
            display: block;
            position: relative
        }

    .field > input[type=checkbox]:not([role=switch]), .input[type=checkbox]:not([role=switch]) {
        appearance: none;
        --tw-outline-style: none;
        outline-style: none;
        flex-shrink: 0;
        position: relative
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):disabled {
        cursor: not-allowed;
        opacity: .5
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):checked:after {
        --tw-content: "";
        content: var(--tw-content);
        -webkit-mask-image: var(--check-icon);
        -webkit-mask-image: var(--check-icon);
        mask-image: var(--check-icon);
        background-color: currentColor;
        display: block;
        -webkit-mask-position: 50%;
        mask-position: 50%;
        -webkit-mask-size: .875rem;
        mask-size: .875rem;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat
    }

    .field > input[type=text]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=email], .field > input[type=password], .field > input[type=number], .field > input[type=file], .field > input[type=tel], .field > input[type=url], .field > input[type=search]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=date], .field > input[type=datetime-local], .field > input[type=month], .field > input[type=week], .field > input[type=time], .input[type=text], .input[type=email], .input[type=password], .input[type=number], .input[type=file], .input[type=tel], .input[type=url], .input[type=search], .input[type=date], .input[type=datetime-local], .input[type=month], .input[type=week], .input[type=time], .input:not([type]) {
        --tw-outline-style: none;
        outline-style: none;
        width: 100%;
        min-width: 0
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        display: inline-flex
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        background-color: #0000
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        color: var(--color-foreground)
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::placeholder {
        color: var(--color-muted-foreground)
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: .5
    }

    .item-group {
        flex-direction: column;
        width: 100%;
        display: flex
    }

        .item-group > hr {
            border-style: var(--tw-border-style);
            border-width: 0;
            border-top-style: var(--tw-border-style);
            border-top-width: 1px;
            flex-shrink: 0;
            width: 100%
        }

    .item {
        border-style: var(--tw-border-style);
        width: 100%;
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .1s;
        --tw-outline-style: none;
        border-width: 1px;
        outline-style: none;
        flex-wrap: wrap;
        align-items: center;
        transition-duration: .1s;
        display: flex
    }

        .item:focus-visible {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .item:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    @media (hover:hover) {
        a.item:hover {
            background-color: var(--color-muted)
        }
    }

    .item > figure {
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex
    }

        .item > figure svg {
            pointer-events: none
        }

        .item > figure:has(>img) {
            overflow: hidden
        }

            .item > figure:has(>img) img {
                object-fit: cover;
                width: 100%;
                height: 100%
            }

    .item > section {
        flex-direction: column;
        flex: 1;
        display: flex
    }

        .item > section + section {
            flex: none
        }

    .item > aside {
        align-items: center;
        display: flex
    }

    .item > :is(header,footer) {
        flex-basis: 100%;
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .item :is(h2,h3,h4) {
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        align-items: center;
        width: fit-content;
        display: flex;
        overflow: hidden
    }

    .item p {
        -webkit-line-clamp: 2;
        text-align: start;
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal);
        color: var(--color-muted-foreground);
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

        .item p > a {
            text-underline-offset: 4px;
            text-decoration-line: underline
        }

            .item p > a:hover {
                color: var(--color-primary)
            }

    .kbd {
        pointer-events: none;
        -webkit-user-select: none;
        user-select: none;
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    .field > label, .field > section > label, .label {
        -webkit-user-select: none;
        user-select: none;
        align-items: center;
        display: flex
    }

    :is(.field>label,.field>section>label,.label):is(:where(.peer):disabled~*), :is(.field>label,.field>section>label,.label):has(>:disabled), :is(.field>label,.field>section>label,.label):has(+:disabled) {
        pointer-events: none
    }

    .field > select, select.select {
        appearance: none;
        --tw-outline-style: none;
        -webkit-user-select: none;
        user-select: none;
        outline-style: none;
        min-width: 0
    }

    :is(.field>select,select.select):disabled {
        cursor: not-allowed;
        opacity: .5
    }

    :is(.field>select,select.select) option, :is(.field>select,select.select) optgroup {
        color: canvastext;
        background-color: canvas
    }

    [data-popover] {
        visibility: visible;
        z-index: 50;
        --tw-scale-x: 100%;
        --tw-scale-y: 100%;
        --tw-scale-z: 100%;
        width: max-content;
        min-width: 100%;
        scale: var(--tw-scale-x) var(--tw-scale-y);
        opacity: 1;
        --tw-outline-style: none;
        outline-style: none;
        position: absolute;
        overflow: hidden auto
    }

    @media (forced-colors:active) {
        [data-popover] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    [data-popover] {
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

        [data-popover][aria-hidden=true] {
            visibility: hidden;
            --tw-scale-x: 95%;
            --tw-scale-y: 95%;
            --tw-scale-z: 95%;
            scale: var(--tw-scale-x) var(--tw-scale-y);
            opacity: 0
        }

            [data-popover][aria-hidden=true]:not([data-side]), [data-popover][aria-hidden=true][data-side=bottom] {
                --tw-translate-y: calc(var(--spacing) * -2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            [data-popover][aria-hidden=true][data-side=top] {
                --tw-translate-y: calc(var(--spacing) * 2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            [data-popover][aria-hidden=true][data-side=left] {
                --tw-translate-x: calc(var(--spacing) * 2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            [data-popover][aria-hidden=true][data-side=right] {
                --tw-translate-x: calc(var(--spacing) * -2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

            [data-popover][aria-hidden=true][data-side=inline-start] {
                --tw-translate-x: calc(var(--spacing) * 2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

                [data-popover][aria-hidden=true][data-side=inline-start]:dir(rtl) {
                    --tw-translate-x: calc(var(--spacing) * -2);
                    translate: var(--tw-translate-x) var(--tw-translate-y)
                }

            [data-popover][aria-hidden=true][data-side=inline-end] {
                --tw-translate-x: calc(var(--spacing) * -2);
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

                [data-popover][aria-hidden=true][data-side=inline-end]:dir(rtl) {
                    --tw-translate-x: calc(var(--spacing) * 2);
                    translate: var(--tw-translate-x) var(--tw-translate-y)
                }

        [data-popover]:not([data-side]), [data-popover][data-side=bottom] {
            margin-top: var(--spacing);
            top: 100%
        }

        [data-popover][data-side=top] {
            margin-bottom: var(--spacing);
            bottom: 100%
        }

        [data-popover][data-side=left] {
            margin-inline-end: var(--spacing);
            inset-inline-end: 100%
        }

        [data-popover][data-side=right] {
            margin-inline-start: var(--spacing);
            inset-inline-start: 100%
        }

        [data-popover][data-side=inline-start] {
            margin-inline-end: var(--spacing);
            inset-inline-end: 100%
        }

        [data-popover][data-side=inline-end] {
            margin-inline-start: var(--spacing);
            inset-inline-start: 100%
        }

    :is([data-popover]:not([data-side]),[data-popover][data-side=bottom],[data-popover][data-side=top]):not([data-align]), :is([data-popover]:not([data-side]),[data-popover][data-side=bottom],[data-popover][data-side=top])[data-align=start] {
        inset-inline-start: calc(var(--spacing) * 0)
    }

    :is([data-popover]:not([data-side]),[data-popover][data-side=bottom],[data-popover][data-side=top])[data-align=end] {
        inset-inline-end: calc(var(--spacing) * 0)
    }

    :is([data-popover]:not([data-side]),[data-popover][data-side=bottom],[data-popover][data-side=top])[data-align=center] {
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        inset-inline-start: 50%
    }

    :is([data-popover][data-side=left],[data-popover][data-side=right],[data-popover][data-side=inline-start],[data-popover][data-side=inline-end]):not([data-align]), :is([data-popover][data-side=left],[data-popover][data-side=right],[data-popover][data-side=inline-start],[data-popover][data-side=inline-end])[data-align=start] {
        top: 0
    }

    :is([data-popover][data-side=left],[data-popover][data-side=right],[data-popover][data-side=inline-start],[data-popover][data-side=inline-end])[data-align=end] {
        bottom: 0
    }

    :is([data-popover][data-side=left],[data-popover][data-side=right],[data-popover][data-side=inline-start],[data-popover][data-side=inline-end])[data-align=center] {
        --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        top: 50%
    }

    .popover {
        display: inline-flex;
        position: relative
    }

    .progress {
        align-items: center;
        width: 100%;
        display: flex;
        overflow: hidden
    }

        .progress:dir(rtl) {
            flex-direction: row-reverse
        }

        .progress > span {
            height: 100%;
            transition-property: all;
            transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
            transition-duration: var(--tw-duration,var(--default-transition-duration))
        }

    .field > input[type=radio], .input[type=radio] {
        appearance: none;
        border-style: var(--tw-border-style);
        --tw-outline-style: none;
        border-width: 1px;
        outline-style: none;
        flex-shrink: 0;
        position: relative
    }

    :is(.field>input[type=radio],.input[type=radio]):disabled {
        cursor: not-allowed;
        opacity: .5
    }

    :is(.field>input[type=radio],.input[type=radio]):checked:before {
        --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);
        --tw-content: "";
        content: var(--tw-content);
        border-radius: 3.40282e38px;
        position: absolute;
        top: 50%;
        left: 50%
    }

    .field > input[type=range], .input[type=range] {
        appearance: none;
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        padding: 0;
        display: flex
    }

    :is(.field>input[type=range],.input[type=range]):disabled {
        pointer-events: none;
        opacity: .5
    }

    .field > input[type=range], .input[type=range] {
        --slider-value: 20%
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb {
        appearance: none;
        flex-shrink: 0;
        display: block
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-runnable-track {
        appearance: none;
        background: linear-gradient(to right, var(--primary) var(--slider-value), var(--muted) var(--slider-value));
        width: 100%
    }

    :is(.field>input[type=range],.input[type=range]):dir(rtl)::-webkit-slider-runnable-track {
        background: linear-gradient(to left, var(--primary) var(--slider-value), var(--muted) var(--slider-value))
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-thumb {
        appearance: none;
        flex-shrink: 0;
        display: block
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-track {
        appearance: none;
        background: linear-gradient(to right, var(--primary) var(--slider-value), var(--muted) var(--slider-value));
        width: 100%
    }

    :is(.field>input[type=range],.input[type=range]):dir(rtl)::-moz-range-track {
        background: linear-gradient(to left, var(--primary) var(--slider-value), var(--muted) var(--slider-value))
    }

    :is(.field>input[type=range],.input[type=range])::-ms-thumb {
        appearance: none;
        flex-shrink: 0;
        display: block
    }

    :is(.field>input[type=range],.input[type=range])::-ms-track {
        appearance: none;
        width: 100%
    }

    :is(.field>input[type=range],.input[type=range])::-ms-fill-lower {
        background-color: var(--color-primary)
    }

    :is(.field>input[type=range],.input[type=range])::-ms-fill-upper {
        background-color: var(--color-muted)
    }

    .select:not(select) {
        display: inline-flex;
        position: relative
    }

        .select:not(select) > button {
            --tw-font-weight: var(--font-weight-normal);
            width: fit-content;
            font-weight: var(--font-weight-normal);
            white-space: nowrap;
            --tw-outline-style: none;
            outline-style: none;
            justify-content: space-between;
            align-items: center;
            display: flex
        }

    @media (forced-colors:active) {
        .select:not(select) > button {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .select:not(select) > button:disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: .5
    }

    .select:not(select) > button svg {
        pointer-events: none;
        flex-shrink: 0
    }

    .select:not(select) > button > span {
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: start;
        flex: 1;
        display: flex;
        overflow: hidden
    }

    .select:not(select) > button > svg {
        flex-shrink: 0
    }

    .select:not(select) [data-popover] {
        isolation: isolate;
        min-width: max(100%,9rem);
        overflow-x: hidden
    }

    .select:not(select) [role=listbox] {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .select:not(select) [role=listbox] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .select:not(select) [role=listbox] [role=group]:not(:has([role=option]:not([aria-hidden=true]))) {
        display: none
    }

    .select:not(select) [role=listbox]:not(:has([data-value]:not([aria-hidden=true]))):before {
        text-overflow: ellipsis;
        white-space: nowrap;
        justify-content: center;
        align-items: center;
        display: flex;
        overflow: hidden
    }

    .select:not(select) [role=listbox][data-empty]:not(:has([data-value]:not([aria-hidden=true]))):before {
        --tw-content: attr(data-empty);
        content: var(--tw-content)
    }

    .select:not(select) [role=listbox]:not([data-empty]):not(:has([data-value]:not([aria-hidden=true]))):before {
        --tw-content: "No results found";
        content: var(--tw-content)
    }

    .select:not(select) [role=option] {
        cursor: default;
        text-overflow: ellipsis;
        white-space: nowrap;
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        width: 100%;
        display: flex;
        position: relative;
        overflow: hidden
    }

    @media (forced-colors:active) {
        .select:not(select) [role=option] {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .select:not(select) [role=option] {
        -webkit-user-select: none;
        user-select: none
    }

        .select:not(select) [role=option]:disabled, .select:not(select) [role=option][aria-disabled=true] {
            pointer-events: none;
            opacity: .5
        }

        .select:not(select) [role=option][aria-hidden=true] {
            display: none
        }

        .select:not(select) [role=option] svg {
            pointer-events: none;
            flex-shrink: 0
        }

        .select:not(select) [role=option][aria-selected=true] {
            background-image: var(--check-icon);
            background-position: right .5rem center;
            background-repeat: no-repeat;
            background-size: .875rem
        }

            .select:not(select) [role=option][aria-selected=true]:dir(rtl) {
                background-position: .5rem
            }

    .select:not(select) [role=separator] {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .select:not(select):not([data-select-initialized]) [role=option]:not([aria-disabled=true]):not(:disabled):hover, .select:not(select) [role=option].active {
        background-color: var(--color-accent);
        color: var(--color-accent-foreground)
    }

    @media not all and (min-width:48rem) {
        .sidebar:not([data-sidebar-initialized]) {
            display: none
        }

        .sidebar:not([aria-hidden]), .sidebar[aria-hidden=false] {
            z-index: 40;
            background-color: #00000080;
            position: fixed;
            inset: 0
        }

        @supports (color:color-mix(in lab, red, red)) {
            .sidebar:not([aria-hidden]), .sidebar[aria-hidden=false] {
                background-color: color-mix(in oklab, var(--color-black) 50%, transparent)
            }
        }
    }

    .sidebar nav {
        z-index: 50;
        width: var(--sidebar-mobile-width);
        transition-property: transform,translate,scale,rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .3s;
        --tw-ease: var(--ease-in-out);
        transition-duration: .3s;
        transition-timing-function: var(--ease-in-out);
        flex-direction: column;
        display: flex;
        position: fixed;
        inset-block: 0
    }

    @media (min-width:48rem) {
        .sidebar nav {
            width: var(--sidebar-width)
        }
    }

    .sidebar + * {
        transition-property: margin;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .3s;
        --tw-ease: var(--ease-in-out);
        transition-duration: .3s;
        transition-timing-function: var(--ease-in-out)
    }

    :is(.sidebar:not([data-side]),.sidebar[data-side=left]) nav {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px;
        left: 0
    }

    :is(.sidebar:not([data-side]),.sidebar[data-side=left]) + * {
        position: relative
    }

    @media (min-width:48rem) {
        :is(.sidebar:not([data-side]),.sidebar[data-side=left]) + * {
            margin-left: var(--sidebar-width)
        }
    }

    :is(.sidebar:not([data-side]),.sidebar[data-side=left])[aria-hidden=true] nav {
        --tw-translate-x: -100%;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    @media (min-width:48rem) {
        :is(.sidebar:not([data-side]),.sidebar[data-side=left])[aria-hidden=true] + * {
            margin-left: 0
        }
    }

    .sidebar[data-side=right] nav {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px;
        right: 0
    }

    .sidebar[data-side=right] + * {
        position: relative
    }

    @media (min-width:48rem) {
        .sidebar[data-side=right] + * {
            margin-right: var(--sidebar-width)
        }
    }

    .sidebar[data-side=right][aria-hidden=true] nav {
        --tw-translate-x: 100%;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    @media (min-width:48rem) {
        .sidebar[data-side=right][aria-hidden=true] + * {
            margin-right: 0
        }
    }

    .sidebar nav > header, .sidebar nav > footer {
        flex-direction: column;
        display: flex
    }

    .sidebar nav [role=separator] {
        width: auto
    }

    .sidebar nav > section {
        flex-direction: column;
        flex: 1;
        min-height: 0;
        display: flex;
        overflow-y: auto
    }

        .sidebar nav > section > [role=group] {
            flex-direction: column;
            width: 100%;
            min-width: 0;
            display: flex;
            position: relative
        }

        .sidebar nav > section h3 {
            --tw-outline-style: none;
            outline-style: none;
            flex-shrink: 0;
            align-items: center;
            display: flex
        }

    @media (forced-colors:active) {
        .sidebar nav > section h3 {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .sidebar nav > section h3 {
        transition-property: margin,opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .2s;
        --tw-ease: linear;
        transition-duration: .2s;
        transition-timing-function: linear
    }

        .sidebar nav > section h3 > svg {
            flex-shrink: 0
        }

    .sidebar nav > section ul {
        flex-direction: column;
        width: 100%;
        min-width: 0;
        display: flex
    }

        .sidebar nav > section ul li {
            position: relative
        }

            .sidebar nav > section ul li > a, .sidebar nav > section ul li > button, .sidebar nav > section ul li > details > summary {
                text-align: left;
                --tw-outline-style: none;
                outline-style: none;
                align-items: center;
                width: 100%;
                display: flex;
                overflow: hidden
            }

    @media (forced-colors:active) {
        .sidebar nav > section ul li > a, .sidebar nav > section ul li > button, .sidebar nav > section ul li > details > summary {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .sidebar nav > section ul li > a, .sidebar nav > section ul li > button, .sidebar nav > section ul li > details > summary {
        transition-property: width,height,padding;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    :is(.sidebar nav>section ul li>a,.sidebar nav>section ul li>button,.sidebar nav>section ul li>details>summary):disabled, :is(.sidebar nav>section ul li>a,.sidebar nav>section ul li>button,.sidebar nav>section ul li>details>summary)[aria-disabled=true] {
        pointer-events: none;
        opacity: .5
    }

    :is(.sidebar nav>section ul li>a,.sidebar nav>section ul li>button,.sidebar nav>section ul li>details>summary) > span:last-child {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    :is(.sidebar nav>section ul li>a,.sidebar nav>section ul li>button,.sidebar nav>section ul li>details>summary) > svg {
        flex-shrink: 0
    }

    .sidebar nav > section ul li > details:not([open]) > summary:after {
        rotate: -90deg
    }

        .sidebar nav > section ul li > details:not([open]) > summary:after:where() {
            rotate: 90deg
        }

    .sidebar nav > section ul li > details > summary:after {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5);
        transition-property: transform,translate,scale,rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-ease: linear;
        --tw-content: "";
        content: var(--tw-content);
        -webkit-mask-image: var(--chevron-down-icon);
        -webkit-mask-image: var(--chevron-down-icon);
        mask-image: var(--chevron-down-icon);
        background-color: currentColor;
        margin-inline-start: auto;
        transition-timing-function: linear;
        display: block;
        -webkit-mask-position: 50%;
        mask-position: 50%;
        -webkit-mask-size: 1rem;
        mask-size: 1rem;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat
    }

    .sidebar nav > section ul ul {
        flex-direction: column;
        min-width: 0;
        display: flex
    }

    .scrollbar {
        scrollbar-width: auto;
        scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track)
    }

        .scrollbar::-webkit-scrollbar {
            width: var(--scrollbar-width);
            height: var(--scrollbar-width)
        }

        .scrollbar::-webkit-scrollbar-track {
            background: var(--scrollbar-track)
        }

        .scrollbar::-webkit-scrollbar-thumb {
            background: var(--scrollbar-thumb);
            border-radius: var(--scrollbar-radius);
            background-clip: padding-box;
            border: 1px solid #0000
        }

        .scrollbar::-webkit-scrollbar-corner {
            background: var(--scrollbar-track)
        }

    .scrollbar-sm {
        scrollbar-width: thin;
        scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track)
    }

        .scrollbar-sm::-webkit-scrollbar {
            width: var(--scrollbar-sm-width);
            height: var(--scrollbar-sm-width)
        }

        .scrollbar-sm::-webkit-scrollbar-track {
            background: var(--scrollbar-track)
        }

        .scrollbar-sm::-webkit-scrollbar-thumb {
            background: var(--scrollbar-thumb);
            border-radius: var(--scrollbar-radius);
            background-clip: padding-box;
            border: 1px solid #0000
        }

        .scrollbar-sm::-webkit-scrollbar-corner {
            background: var(--scrollbar-track)
        }

    .skeleton {
        animation: var(--animate-pulse)
    }

    .field > input[type=checkbox][role=switch], .input[type=checkbox][role=switch] {
        appearance: none;
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-outline-style: none;
        outline-style: none;
        flex-shrink: 0;
        align-items: center;
        display: inline-flex
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):disabled {
        cursor: not-allowed;
        opacity: .5
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):before {
        content: var(--tw-content);
        pointer-events: none;
        content: var(--tw-content);
        content: var(--tw-content);
        --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);
        content: var(--tw-content);
        transition-property: transform,translate,scale,rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-content: "";
        content: var(--tw-content);
        display: block
    }

    .table {
        caption-side: bottom;
        width: 100%
    }

        .table tfoot {
            border-top-style: var(--tw-border-style);
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium);
            border-top-width: 1px
        }

        .table th {
            vertical-align: middle;
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium);
            white-space: nowrap
        }

            .table th > [role=checkbox] {
                --tw-translate-y: 2px;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

        .table td {
            vertical-align: middle;
            white-space: nowrap
        }

            .table td > [role=checkbox] {
                --tw-translate-y: 2px;
                translate: var(--tw-translate-x) var(--tw-translate-y)
            }

    .tabs {
        display: flex
    }

        .tabs:has(>[role=tablist][aria-orientation=horizontal]), .tabs:not(:has(>[role=tablist][aria-orientation=vertical])) {
            flex-direction: column
        }

        .tabs:has(>[role=tablist][aria-orientation=vertical]) {
            flex-direction: row
        }

        .tabs > [role=tablist] {
            width: fit-content;
            color: var(--color-muted-foreground);
            justify-content: center;
            align-items: center;
            display: inline-flex
        }

            .tabs > [role=tablist][aria-orientation=vertical] {
                flex-direction: column;
                height: fit-content
            }

            .tabs > [role=tablist] > [role=tab] {
                white-space: nowrap;
                transition-property: all;
                transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
                transition-duration: var(--tw-duration,var(--default-transition-duration));
                --tw-outline-style: none;
                outline-style: none;
                flex: 1;
                justify-content: center;
                align-items: center;
                display: inline-flex;
                position: relative
            }

                .tabs > [role=tablist] > [role=tab]:disabled, .tabs > [role=tablist] > [role=tab][aria-disabled=true] {
                    pointer-events: none;
                    opacity: .5
                }

                .tabs > [role=tablist] > [role=tab] svg {
                    pointer-events: none;
                    flex-shrink: 0
                }

        .tabs > [role=tabpanel] {
            --tw-outline-style: none;
            outline-style: none;
            flex: 1
        }

    .field > textarea, .textarea {
        field-sizing: content;
        min-height: calc(var(--spacing) * 16);
        --tw-outline-style: none;
        outline-style: none;
        width: 100%;
        display: flex
    }

    :is(.field>textarea,.textarea)::placeholder {
        color: var(--color-muted-foreground)
    }

    :is(.field>textarea,.textarea):disabled {
        cursor: not-allowed;
        opacity: .5
    }

    .input-group {
        --tw-outline-style: none;
        outline-style: none;
        align-items: center;
        width: 100%;
        min-width: 0;
        display: flex;
        position: relative
    }

        .input-group[data-orientation=vertical], .input-group:has(>[data-align=block-start]), .input-group:has(>[data-align=block-end]) {
            flex-direction: column;
            align-items: stretch;
            height: auto
        }

        .input-group > :is(input,textarea,select,[data-control]) {
            appearance: none;
            border-style: var(--tw-border-style);
            min-width: 0;
            color: var(--color-foreground);
            --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);
            --tw-outline-style: none;
            background-color: #0000;
            border-width: 0;
            border-radius: 0;
            outline-style: none;
            flex: 1;
            display: block
        }

            .input-group > :is(input,textarea,select,[data-control])::placeholder {
                color: var(--color-muted-foreground)
            }

            .input-group > :is(input,textarea,select,[data-control]):focus-visible, .input-group > :is(input,textarea,select,[data-control])[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)
            }

        .input-group > :is(input,select,[data-control]) {
            height: 100%
        }

        .input-group > [data-control] {
            width: 100%
        }

        .input-group:is([data-orientation=vertical],:has(>[data-align=block-start]),:has(>[data-align=block-end])) > :is(input,select,[data-control]) {
            flex: none;
            height: auto
        }

        .input-group[data-orientation=vertical]:has(>footer[data-align=end]) > :is(input,select,[data-control]), .input-group:has(>[data-align=block-end]) > :is(input,select,[data-control]) {
            padding-top: calc(var(--spacing) * 3)
        }

        .input-group[data-orientation=vertical]:has(>header[data-align=start]) > :is(input,select,[data-control]), .input-group:has(>[data-align=block-start]) > :is(input,select,[data-control]) {
            padding-bottom: calc(var(--spacing) * 3)
        }

        .input-group > textarea {
            field-sizing: content;
            min-height: calc(var(--spacing) * 20);
            resize: none;
            width: 100%
        }

        .input-group > :is(span,kbd,svg,[role=group],.popover,.dropdown-menu,button,footer,header,hr[role=separator]) {
            flex-shrink: 0
        }

        .input-group > :is(span,[role=group],footer,header) {
            align-items: center;
            display: inline-flex
        }

        .input-group > svg {
            pointer-events: none
        }

        .input-group > :is([data-align=start],[data-align=inline-start],[data-align=block-start]) {
            order: -9999
        }

        .input-group > :is([data-align=end],[data-align=inline-end],[data-align=block-end]) {
            order: 9999
        }

        .input-group > :is([data-align=block-start],[data-align=block-end]) {
            justify-content: flex-start;
            width: 100%
        }

        .input-group > button:is([data-align=start],[data-align=inline-start]) {
            margin-inline-start: var(--spacing)
        }

        .input-group > button:is([data-align=end],[data-align=inline-end]) {
            margin-inline-end: var(--spacing)
        }

    .toaster {
        pointer-events: none;
        z-index: 50;
        gap: calc(var(--spacing) * 4);
        width: 100%;
        padding: calc(var(--spacing) * 4);
        flex-direction: column-reverse;
        display: flex;
        position: fixed;
        bottom: 0
    }

    @media (min-width:40rem) {
        .toaster {
            max-width: calc(var(--spacing) * 90)
        }
    }

    .toaster:not([data-align]), .toaster[data-align=end] {
        right: 0
    }

    .toaster[data-align=start] {
        left: 0
    }

    .toaster[data-align=center] {
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        left: 50%
    }

    .toaster .toast {
        pointer-events: auto;
        width: 100%;
        transition-property: grid-template-rows,opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .3s;
        --tw-ease: var(--ease-in-out);
        transition-duration: .3s;
        transition-timing-function: var(--ease-in-out);
        grid-template-rows: 1fr;
        animation: .3s ease-in-out toast-up;
        display: grid
    }

        .toaster .toast .toast-content {
            align-items: center;
            gap: calc(var(--spacing) * 2.5);
            padding: calc(var(--spacing) * 3);
            font-size: 13px;
            display: flex;
            overflow: hidden
        }

            .toaster .toast .toast-content svg {
                width: calc(var(--spacing) * 4);
                height: calc(var(--spacing) * 4);
                flex-shrink: 0
            }

            .toaster .toast .toast-content section h2 {
                --tw-font-weight: var(--font-weight-medium);
                font-weight: var(--font-weight-medium);
                --tw-tracking: var(--tracking-tight);
                letter-spacing: var(--tracking-tight)
            }

            .toaster .toast .toast-content section p {
                word-break: break-all;
                color: var(--color-muted-foreground)
            }

            .toaster .toast .toast-content footer {
                gap: calc(var(--spacing) * 2);
                flex-direction: column;
                margin-inline-start: auto;
                display: flex
            }

                .toaster .toast .toast-content footer [data-toast-action], .toaster .toast .toast-content footer [data-toast-cancel] {
                    height: calc(var(--spacing) * 6);
                    padding-inline: calc(var(--spacing) * 2.5);
                    font-size: var(--text-xs);
                    line-height: var(--tw-leading,var(--text-xs--line-height))
                }

        .toaster .toast[aria-hidden=true] {
            border-style: var(--tw-border-style);
            opacity: 0;
            border-width: 0;
            grid-template-rows: 0fr;
            padding: 0;
            overflow: hidden
        }

            .toaster .toast[aria-hidden=true] .toast-content {
                border-style: var(--tw-border-style);
                border-width: 0
            }

    [data-tooltip] {
        position: relative
    }

        [data-tooltip]:before {
            pointer-events: none;
            visibility: hidden;
            z-index: 60;
            width: fit-content;
            max-width: var(--container-xs);
            transform-origin: var(--transform-origin);
            --tw-scale-x: 95%;
            --tw-scale-y: 95%;
            --tw-scale-z: 95%;
            scale: var(--tw-scale-x) var(--tw-scale-y);
            text-overflow: ellipsis;
            white-space: nowrap;
            opacity: 0;
            transition-property: all;
            transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
            transition-duration: var(--tw-duration,var(--default-transition-duration));
            --tw-content: attr(data-tooltip);
            content: var(--tw-content);
            position: absolute;
            overflow: hidden
        }

        [data-tooltip]:hover:before {
            visibility: visible;
            --tw-scale-x: 100%;
            --tw-scale-y: 100%;
            --tw-scale-z: 100%;
            scale: var(--tw-scale-x) var(--tw-scale-y);
            opacity: 1
        }

        [data-tooltip]:focus-visible:not(:hover):before {
            display: none
        }

    :is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top]):before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-bottom: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-y: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        bottom: 100%
    }

    @media (hover:hover) {
        :is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top]):hover:before {
            content: var(--tw-content);
            --tw-translate-y: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=bottom]:before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-top: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-y: calc(var(--spacing) * -2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        top: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=bottom]:hover:before {
            content: var(--tw-content);
            --tw-translate-y: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    :is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top],[data-tooltip][data-side=bottom])[data-align=start]:before {
        content: var(--tw-content);
        left: 0
    }

    :is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top],[data-tooltip][data-side=bottom])[data-align=end]:before {
        content: var(--tw-content);
        right: 0
    }

    :is(:is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top],[data-tooltip][data-side=bottom]):not([data-align]),:is([data-tooltip]:not([data-side]),[data-tooltip][data-side=top],[data-tooltip][data-side=bottom])[data-align=center]):before {
        content: var(--tw-content);
        content: var(--tw-content);
        --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        left: 50%
    }

    [data-tooltip][data-side=left]:before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-right: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        right: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=left]:hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=right]:before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-left: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * -2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        left: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=right]:hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=inline-start]:before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-right: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        right: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=inline-start]:hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=inline-start]:dir(rtl):before {
        content: var(--tw-content);
        content: var(--tw-content);
        content: var(--tw-content);
        content: var(--tw-content);
        margin-right: 0;
        margin-left: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * -2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        left: 100%;
        right: auto
    }

    @media (hover:hover) {
        [data-tooltip][data-side=inline-start]:dir(rtl):hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=inline-end]:before {
        content: var(--tw-content);
        content: var(--tw-content);
        margin-left: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * -2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        left: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=inline-end]:hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    [data-tooltip][data-side=inline-end]:dir(rtl):before {
        content: var(--tw-content);
        content: var(--tw-content);
        content: var(--tw-content);
        margin-right: calc(var(--spacing) * 1.5);
        content: var(--tw-content);
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing) * 2);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        margin-left: 0;
        left: auto;
        right: 100%
    }

    @media (hover:hover) {
        [data-tooltip][data-side=inline-end]:dir(rtl):hover:before {
            content: var(--tw-content);
            --tw-translate-x: 0;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }
    }

    :is([data-tooltip][data-side=left],[data-tooltip][data-side=right],[data-tooltip][data-side=inline-start],[data-tooltip][data-side=inline-end])[data-align=start]:before {
        content: var(--tw-content);
        top: 0
    }

    :is([data-tooltip][data-side=left],[data-tooltip][data-side=right],[data-tooltip][data-side=inline-start],[data-tooltip][data-side=inline-end])[data-align=end]:before {
        content: var(--tw-content);
        bottom: 0
    }

    :is(:is([data-tooltip][data-side=left],[data-tooltip][data-side=right],[data-tooltip][data-side=inline-start],[data-tooltip][data-side=inline-end]):not([data-align]),:is([data-tooltip][data-side=left],[data-tooltip][data-side=right],[data-tooltip][data-side=inline-start],[data-tooltip][data-side=inline-end])[data-align=center]):before {
        content: var(--tw-content);
        content: var(--tw-content);
        --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        top: 50%
    }

    .accordion > details:not(:last-child) {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }

    .accordion > details > summary {
        border-radius: var(--radius-md);
        padding-block: calc(var(--spacing) * 4);
        text-align: left;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    @media (hover:hover) {
        .accordion > details > summary:hover {
            text-decoration-line: underline
        }
    }

    .accordion > details > summary:focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .accordion > details > summary:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .accordion > details > summary > svg:last-child {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        color: var(--color-muted-foreground);
        margin-inline-start: auto
    }

    .accordion > details > :not(summary) {
        padding-top: 0;
        padding-bottom: calc(var(--spacing) * 4);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .btn {
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        background-clip: padding-box;
        border-width: 1px;
        border-color: #0000
    }

        .btn:focus-visible {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .btn:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .btn:active:not([aria-haspopup]) {
        --tw-translate-y: 1px;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .btn[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .btn:is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn:is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    .btn:is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn:is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .btn svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .btn:not([data-size]), .btn[data-size=default] {
        height: calc(var(--spacing) * 9);
        gap: calc(var(--spacing) * 1.5);
        padding-inline: calc(var(--spacing) * 2.5)
    }

    :is(.btn:not([data-size]),.btn[data-size=default]):has([data-icon=inline-end]) {
        padding-right: calc(var(--spacing) * 2)
    }

    :is(.btn:not([data-size]),.btn[data-size=default]):has([data-icon=inline-start]) {
        padding-left: calc(var(--spacing) * 2)
    }

    .btn[data-size=xs] {
        height: calc(var(--spacing) * 6);
        gap: var(--spacing);
        border-radius: min(var(--radius-md), 8px);
        padding-inline: calc(var(--spacing) * 2);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height))
    }

        .btn[data-size=xs]:has([data-icon=inline-end]) {
            padding-right: calc(var(--spacing) * 1.5)
        }

        .btn[data-size=xs]:has([data-icon=inline-start]) {
            padding-left: calc(var(--spacing) * 1.5)
        }

        .btn[data-size=xs] svg:not([class*=size-]) {
            width: calc(var(--spacing) * 3);
            height: calc(var(--spacing) * 3)
        }

    .btn[data-size=sm] {
        height: calc(var(--spacing) * 8);
        gap: var(--spacing);
        border-radius: min(var(--radius-md), 10px);
        padding-inline: calc(var(--spacing) * 2.5)
    }

        .btn[data-size=sm]:has([data-icon=inline-end]) {
            padding-right: calc(var(--spacing) * 1.5)
        }

        .btn[data-size=sm]:has([data-icon=inline-start]) {
            padding-left: calc(var(--spacing) * 1.5)
        }

    .btn[data-size=lg] {
        height: calc(var(--spacing) * 10);
        gap: calc(var(--spacing) * 1.5);
        padding-inline: calc(var(--spacing) * 2.5)
    }

        .btn[data-size=lg]:has([data-icon=inline-end]) {
            padding-right: calc(var(--spacing) * 2)
        }

        .btn[data-size=lg]:has([data-icon=inline-start]) {
            padding-left: calc(var(--spacing) * 2)
        }

    .btn[data-size=icon] {
        width: calc(var(--spacing) * 9);
        height: calc(var(--spacing) * 9)
    }

    .btn[data-size=icon-xs] {
        width: calc(var(--spacing) * 6);
        height: calc(var(--spacing) * 6);
        border-radius: min(var(--radius-md), 8px)
    }

        .btn[data-size=icon-xs] svg:not([class*=size-]) {
            width: calc(var(--spacing) * 3);
            height: calc(var(--spacing) * 3)
        }

    .btn[data-size=icon-sm] {
        width: calc(var(--spacing) * 8);
        height: calc(var(--spacing) * 8);
        border-radius: min(var(--radius-md), 10px)
    }

    .btn[data-size=icon-lg] {
        width: calc(var(--spacing) * 10);
        height: calc(var(--spacing) * 10)
    }

    .btn:not([data-variant]), .btn[data-variant=primary] {
        background-color: var(--color-primary);
        color: var(--color-primary-foreground)
    }

    @media (hover:hover) {
        :is(.btn:not([data-variant]),.btn[data-variant=primary]):hover {
            background-color: var(--color-primary)
        }

        @supports (color:color-mix(in lab, red, red)) {
            :is(.btn:not([data-variant]),.btn[data-variant=primary]):hover {
                background-color: color-mix(in oklab, var(--color-primary) 80%, transparent)
            }
        }
    }

    .btn[data-variant=secondary] {
        background-color: var(--color-secondary);
        color: var(--color-secondary-foreground)
    }

    @media (hover:hover) {
        .btn[data-variant=secondary]:hover {
            background-color: var(--secondary)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .btn[data-variant=secondary]:hover {
                background-color: color-mix(in oklch,var(--secondary),var(--foreground) 5%)
            }
        }
    }

    .btn[data-variant=secondary][aria-expanded=true] {
        background-color: var(--color-secondary);
        color: var(--color-secondary-foreground)
    }

    .btn[data-variant=outline] {
        border-color: var(--color-border);
        background-color: var(--color-background);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    @media (hover:hover) {
        .btn[data-variant=outline]:hover {
            background-color: var(--color-muted);
            color: var(--color-foreground)
        }
    }

    .btn[data-variant=outline][aria-expanded=true] {
        background-color: var(--color-muted);
        color: var(--color-foreground)
    }

    .btn[data-variant=outline]:is(html.dark *) {
        border-color: var(--color-input);
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=outline]:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    @media (hover:hover) {
        .btn[data-variant=outline]:is(html.dark *):hover {
            background-color: var(--color-input)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .btn[data-variant=outline]:is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-input) 50%, transparent)
            }
        }

        .btn[data-variant=ghost]:hover {
            background-color: var(--color-muted);
            color: var(--color-foreground)
        }
    }

    .btn[data-variant=ghost][aria-expanded=true] {
        background-color: var(--color-muted);
        color: var(--color-foreground)
    }

    @media (hover:hover) {
        .btn[data-variant=ghost]:is(html.dark *):hover {
            background-color: var(--color-muted)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .btn[data-variant=ghost]:is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-muted) 50%, transparent)
            }
        }
    }

    .btn[data-variant=link] {
        color: var(--color-primary);
        text-underline-offset: 4px
    }

    @media (hover:hover) {
        .btn[data-variant=link]:hover {
            text-decoration-line: underline
        }
    }

    .btn[data-variant=destructive] {
        background-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=destructive] {
            background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent)
        }
    }

    .btn[data-variant=destructive] {
        color: var(--color-destructive)
    }

    @media (hover:hover) {
        .btn[data-variant=destructive]:hover {
            background-color: var(--color-destructive)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .btn[data-variant=destructive]:hover {
                background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
            }
        }
    }

    .btn[data-variant=destructive]:focus-visible {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=destructive]:focus-visible {
            border-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .btn[data-variant=destructive]:focus-visible {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=destructive]:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .btn[data-variant=destructive]:is(html.dark *) {
        background-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=destructive]:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    @media (hover:hover) {
        .btn[data-variant=destructive]:is(html.dark *):hover {
            background-color: var(--color-destructive)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .btn[data-variant=destructive]:is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-destructive) 30%, transparent)
            }
        }
    }

    .btn[data-variant=destructive]:is(html.dark *):focus-visible {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .btn[data-variant=destructive]:is(html.dark *):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .button-group:has(>.button-group) {
        gap: calc(var(--spacing) * 2)
    }

    .button-group:not([data-orientation=vertical]) > :last-child, .button-group:not([data-orientation=vertical]) > :is(.dropdown-menu,.popover,.select):last-child > button {
        border-start-end-radius: var(--radius-md) !important;
        border-end-end-radius: var(--radius-md) !important
    }

    .button-group[data-orientation=vertical] > :last-child, .button-group[data-orientation=vertical] > :is(.dropdown-menu,.popover,.select):last-child > button {
        border-bottom-right-radius: var(--radius-md) !important;
        border-bottom-left-radius: var(--radius-md) !important
    }

    .button-group > :is(span,label,output) {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        background-color: var(--color-muted);
        padding-inline: calc(var(--spacing) * 2.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        border-width: 1px
    }

        .button-group > :is(span,label,output) svg:not([class*=size-]) {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

    .button-group > hr[role=separator] {
        background-color: var(--color-input)
    }

    .tabs {
        gap: calc(var(--spacing) * 2)
    }

        .tabs > [role=tablist] {
            height: calc(var(--spacing) * 9);
            border-radius: var(--radius-lg);
            padding: 3px
        }

            .tabs > [role=tablist]:not([data-variant=line]) {
                background-color: var(--color-muted)
            }

            .tabs > [role=tablist][data-variant=line] {
                gap: var(--spacing);
                background-color: #0000;
                border-radius: 0
            }

            .tabs > [role=tablist][aria-orientation=vertical] {
                height: fit-content
            }

            .tabs > [role=tablist] > [role=tab] {
                gap: calc(var(--spacing) * 1.5);
                border-radius: var(--radius-md);
                border-style: var(--tw-border-style);
                padding-inline: calc(var(--spacing) * 2);
                padding-block: var(--spacing);
                font-size: var(--text-sm);
                line-height: var(--tw-leading,var(--text-sm--line-height));
                --tw-font-weight: var(--font-weight-medium);
                font-weight: var(--font-weight-medium);
                color: var(--color-foreground);
                border-width: 1px;
                border-color: #0000
            }

    @supports (color:color-mix(in lab, red, red)) {
        .tabs > [role=tablist] > [role=tab] {
            color: color-mix(in oklab, var(--color-foreground) 60%, transparent)
        }
    }

    @media (hover:hover) {
        .tabs > [role=tablist] > [role=tab]:hover {
            color: var(--color-foreground)
        }
    }

    .tabs > [role=tablist] > [role=tab]:focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .tabs > [role=tablist] > [role=tab]:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .tabs > [role=tablist] > [role=tab]:focus-visible {
        outline-style: var(--tw-outline-style);
        outline-width: 1px;
        outline-color: var(--color-ring)
    }

    .tabs > [role=tablist] > [role=tab]:is(html.dark *) {
        color: var(--color-muted-foreground)
    }

    @media (hover:hover) {
        .tabs > [role=tablist] > [role=tab]:is(html.dark *):hover {
            color: var(--color-foreground)
        }
    }

    .tabs > [role=tablist] > [role=tab] svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .tabs > [role=tablist] > [role=tab]:after {
        content: var(--tw-content);
        content: var(--tw-content);
        background-color: var(--color-foreground);
        content: var(--tw-content);
        opacity: 0;
        content: var(--tw-content);
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        position: absolute
    }

    .tabs > [role=tablist][aria-orientation=vertical] > [role=tab] {
        justify-content: flex-start;
        width: 100%
    }

    .tabs > [role=tablist][data-variant=line][aria-orientation=horizontal] > [role=tab] {
        --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);
        background-color: #0000
    }

        .tabs > [role=tablist][data-variant=line][aria-orientation=horizontal] > [role=tab]:after {
            content: var(--tw-content);
            content: var(--tw-content);
            content: var(--tw-content);
            height: calc(var(--spacing) * .5);
            inset-inline: 0;
            bottom: -5px
        }

    .tabs > [role=tablist][data-variant=line][aria-orientation=vertical] > [role=tab] {
        --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);
        background-color: #0000
    }

        .tabs > [role=tablist][data-variant=line][aria-orientation=vertical] > [role=tab]:after {
            content: var(--tw-content);
            content: var(--tw-content);
            content: var(--tw-content);
            width: calc(var(--spacing) * .5);
            inset-block: 0;
            inset-inline-end: -4px
        }

    .tabs > [role=tablist]:not([data-variant=line]) > [role=tab][aria-selected=true] {
        background-color: var(--color-background);
        color: var(--color-foreground);
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

        .tabs > [role=tablist]:not([data-variant=line]) > [role=tab][aria-selected=true]:is(html.dark *) {
            border-color: var(--color-input);
            background-color: var(--color-input)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .tabs > [role=tablist]:not([data-variant=line]) > [role=tab][aria-selected=true]:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .tabs > [role=tablist]:not([data-variant=line]) > [role=tab][aria-selected=true]:is(html.dark *) {
        color: var(--color-foreground)
    }

    .tabs > [role=tablist][data-variant=line] > [role=tab][aria-selected=true] {
        color: var(--color-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);
        background-color: #0000
    }

        .tabs > [role=tablist][data-variant=line] > [role=tab][aria-selected=true]:after {
            content: var(--tw-content);
            opacity: 1
        }

        .tabs > [role=tablist][data-variant=line] > [role=tab][aria-selected=true]:is(html.dark *) {
            color: var(--color-foreground);
            background-color: #0000;
            border-color: #0000
        }

    .tabs > [role=tablist] > [role=tab]:has(>svg:first-child) {
        padding-inline-start: calc(var(--spacing) * 1.5)
    }

    .tabs > [role=tablist] > [role=tab]:has(>svg:last-child) {
        padding-inline-end: calc(var(--spacing) * 1.5)
    }

    .tabs > [role=tabpanel] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .field > textarea, .textarea {
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: calc(var(--spacing) * 2);
        font-size: var(--text-base);
        line-height: var(--tw-leading,var(--text-base--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000
    }

    :is(.field>textarea,.textarea):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>textarea,.textarea):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>textarea,.textarea)[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>textarea,.textarea)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    @media (min-width:48rem) {
        .field > textarea, .textarea {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }
    }

    :is(.field>textarea,.textarea):is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>textarea,.textarea):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    :is(.field>textarea,.textarea):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>textarea,.textarea):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>textarea,.textarea):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>textarea,.textarea):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .field > input[type=text]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=email], .field > input[type=password], .field > input[type=number], .field > input[type=file], .field > input[type=tel], .field > input[type=url], .field > input[type=search]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=date], .field > input[type=datetime-local], .field > input[type=month], .field > input[type=week], .field > input[type=time], .field > input:not([type]), .input[type=text], .input[type=email], .input[type=password], .input[type=number], .input[type=file], .input[type=tel], .input[type=url], .input[type=search], .input[type=date], .input[type=datetime-local], .input[type=month], .input[type=week], .input[type=time], .input:not([type]) {
        height: calc(var(--spacing) * 9);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: var(--spacing);
        font-size: var(--text-base);
        line-height: var(--tw-leading,var(--text-base--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        height: calc(var(--spacing) * 7)
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))::file-selector-button {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type]))[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    @media (min-width:48rem) {
        .field > input[type=text]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=email], .field > input[type=password], .field > input[type=number], .field > input[type=file], .field > input[type=tel], .field > input[type=url], .field > input[type=search]:not(:is(.command>header input,.dialog>*>header input)), .field > input[type=date], .field > input[type=datetime-local], .field > input[type=month], .field > input[type=week], .field > input[type=time], .field > input:not([type]), .input[type=text], .input[type=email], .input[type=password], .input[type=number], .input[type=file], .input[type=tel], .input[type=url], .input[type=search], .input[type=date], .input[type=datetime-local], .input[type=month], .input[type=week], .input[type=time], .input:not([type]) {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=text]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=email],.field>input[type=password],.field>input[type=number],.field>input[type=file],.field>input[type=tel],.field>input[type=url],.field>input[type=search]:not(:is(.command>header input,.dialog>*>header input)),.field>input[type=date],.field>input[type=datetime-local],.field>input[type=month],.field>input[type=week],.field>input[type=time],.field>input:not([type]),.input[type=text],.input[type=email],.input[type=password],.input[type=number],.input[type=file],.input[type=tel],.input[type=url],.input[type=search],.input[type=date],.input[type=datetime-local],.input[type=month],.input[type=week],.input[type=time],.input:not([type])):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .field > select, select.select {
        height: calc(var(--spacing) * 9);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        width: fit-content;
        padding-block: var(--spacing);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000;
        padding-inline-start: calc(var(--spacing) * 2.5);
        padding-inline-end: calc(var(--spacing) * 8)
    }

    :is(.field>select,select.select) ::selection {
        background-color: var(--color-primary)
    }

    :is(.field>select,select.select)::selection {
        background-color: var(--color-primary)
    }

    :is(.field>select,select.select) ::selection {
        color: var(--color-primary-foreground)
    }

    :is(.field>select,select.select)::selection {
        color: var(--color-primary-foreground)
    }

    :is(.field>select,select.select)::placeholder {
        color: var(--color-muted-foreground)
    }

    :is(.field>select,select.select):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>select,select.select):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>select,select.select)[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>select,select.select)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    :is(.field>select,select.select)[data-size=sm] {
        height: calc(var(--spacing) * 8)
    }

    :is(.field>select,select.select):is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>select,select.select):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    @media (hover:hover) {
        :is(.field>select,select.select):is(html.dark *):hover {
            background-color: var(--color-input)
        }

        @supports (color:color-mix(in lab, red, red)) {
            :is(.field>select,select.select):is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-input) 50%, transparent)
            }
        }
    }

    :is(.field>select,select.select):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>select,select.select):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>select,select.select):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>select,select.select):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .field > select, select.select {
        background-image: var(--chevron-down-icon-50);
        background-position: right .625rem center;
        background-repeat: no-repeat;
        background-size: 1rem
    }

    :is(.field>select,select.select):dir(rtl) {
        background-position: .625rem
    }

    .alert {
        gap: calc(var(--spacing) * .5);
        border-radius: var(--radius-lg);
        border-style: var(--tw-border-style);
        padding-inline: calc(var(--spacing) * 4);
        padding-block: calc(var(--spacing) * 3);
        text-align: start;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        border-width: 1px;
        display: grid
    }

        .alert:has(>svg) {
            column-gap: calc(var(--spacing) * 2.5);
            grid-template-columns: auto 1fr
        }

        .alert > svg {
            --tw-translate-y: calc(var(--spacing) * .5);
            translate: var(--tw-translate-x) var(--tw-translate-y);
            color: currentColor;
            grid-row: span 2/span 2
        }

            .alert > svg:not([class*=size-]) {
                width: calc(var(--spacing) * 4);
                height: calc(var(--spacing) * 4)
            }

    .alert {
        background-color: var(--color-card);
        color: var(--color-card-foreground)
    }

        .alert[data-variant=destructive] {
            background-color: var(--color-card);
            color: var(--color-destructive)
        }

            .alert[data-variant=destructive] > svg {
                color: currentColor
            }

            .alert > :is(h2,h3,h4,h5,h6,strong,[data-title]), .alert[data-variant=destructive] > :is(h2,h3,h4,h5,h6,strong,[data-title]) {
                --tw-font-weight: var(--font-weight-medium);
                font-weight: var(--font-weight-medium)
            }

        .alert:has(>svg) > :is(h2,h3,h4,h5,h6,strong,[data-title]) {
            grid-column-start: 2
        }

        .alert > section {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            text-wrap: balance;
            color: var(--color-muted-foreground)
        }

    @media (min-width:48rem) {
        .alert > section {
            text-wrap: pretty
        }
    }

    .alert > section p:not(:last-child) {
        margin-bottom: calc(var(--spacing) * 4)
    }

    .alert[data-variant=destructive] > section {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        text-wrap: balance;
        color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .alert[data-variant=destructive] > section {
            color: color-mix(in oklab, var(--color-destructive) 90%, transparent)
        }
    }

    @media (min-width:48rem) {
        .alert[data-variant=destructive] > section {
            text-wrap: pretty
        }
    }

    .alert[data-variant=destructive] > section p:not(:last-child) {
        margin-bottom: calc(var(--spacing) * 4)
    }

    .alert > footer, .alert[data-variant=destructive] > footer {
        inset-inline-end: calc(var(--spacing) * 3);
        top: calc(var(--spacing) * 2.5)
    }

    .avatar {
        border-radius: 3.40282e38px
    }

        .avatar:after {
            content: var(--tw-content);
            border-radius: inherit
        }

    .avatar {
        width: calc(var(--spacing) * 8);
        height: calc(var(--spacing) * 8)
    }

        .avatar[data-size=sm] {
            width: calc(var(--spacing) * 6);
            height: calc(var(--spacing) * 6)
        }

        .avatar[data-size=lg] {
            width: calc(var(--spacing) * 10);
            height: calc(var(--spacing) * 10)
        }

        .avatar > span:not(.avatar-badge) {
            border-radius: inherit;
            background-color: var(--color-muted);
            color: var(--color-muted-foreground)
        }

        .avatar > img {
            border-radius: inherit
        }

        .avatar > .avatar-badge {
            background-color: var(--color-primary);
            color: var(--color-primary-foreground);
            --tw-ring-color: var(--color-background)
        }

    .avatar-group > [data-count] {
        width: calc(var(--spacing) * 8);
        height: calc(var(--spacing) * 8);
        background-color: var(--color-muted);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-muted-foreground);
        border-radius: 3.40282e38px
    }

        .avatar-group > [data-count] > svg {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

    .avatar-group:has(>.avatar[data-size=sm]) > [data-count] {
        width: calc(var(--spacing) * 6);
        height: calc(var(--spacing) * 6)
    }

        .avatar-group:has(>.avatar[data-size=sm]) > [data-count] > svg {
            width: calc(var(--spacing) * 3);
            height: calc(var(--spacing) * 3)
        }

    .avatar-group:has(>.avatar[data-size=lg]) > [data-count] {
        width: calc(var(--spacing) * 10);
        height: calc(var(--spacing) * 10)
    }

        .avatar-group:has(>.avatar[data-size=lg]) > [data-count] > svg {
            width: calc(var(--spacing) * 5);
            height: calc(var(--spacing) * 5)
        }

    .badge {
        height: calc(var(--spacing) * 5);
        gap: var(--spacing);
        border-radius: var(--radius-4xl);
        border-style: var(--tw-border-style);
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * .5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        border-width: 1px;
        border-color: #0000
    }

        .badge > svg {
            width: calc(var(--spacing) * 3) !important;
            height: calc(var(--spacing) * 3) !important
        }

        .badge:not([data-variant]), .badge[data-variant=primary] {
            background-color: var(--color-primary);
            color: var(--color-primary-foreground)
        }

    @media (hover:hover) {
        :is(.badge:not([data-variant]),.badge[data-variant=primary]):is(a):hover {
            background-color: var(--color-primary)
        }

        @supports (color:color-mix(in lab, red, red)) {
            :is(.badge:not([data-variant]),.badge[data-variant=primary]):is(a):hover {
                background-color: color-mix(in oklab, var(--color-primary) 80%, transparent)
            }
        }
    }

    .badge[data-variant=secondary] {
        background-color: var(--color-secondary);
        color: var(--color-secondary-foreground)
    }

    @media (hover:hover) {
        .badge[data-variant=secondary]:is(a):hover {
            background-color: var(--color-secondary)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .badge[data-variant=secondary]:is(a):hover {
                background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent)
            }
        }
    }

    .badge[data-variant=outline] {
        border-color: var(--color-border);
        color: var(--color-foreground)
    }

    @media (hover:hover) {
        .badge[data-variant=outline]:is(a):hover {
            background-color: var(--color-muted);
            color: var(--color-muted-foreground)
        }
    }

    .badge[data-variant=destructive] {
        background-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .badge[data-variant=destructive] {
            background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent)
        }
    }

    .badge[data-variant=destructive] {
        color: var(--color-destructive)
    }

        .badge[data-variant=destructive]:focus-visible {
            --tw-ring-color: var(--color-destructive)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .badge[data-variant=destructive]:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .badge[data-variant=destructive]:is(html.dark *) {
        background-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .badge[data-variant=destructive]:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .badge[data-variant=destructive]:is(html.dark *):focus-visible {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .badge[data-variant=destructive]:is(html.dark *):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    @media (hover:hover) {
        .badge[data-variant=destructive]:is(a):hover {
            background-color: var(--color-destructive)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .badge[data-variant=destructive]:is(a):hover {
                background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
            }
        }

        .badge[data-variant=ghost]:hover {
            background-color: var(--color-muted);
            color: var(--color-muted-foreground)
        }

        .badge[data-variant=ghost]:is(html.dark *):hover {
            background-color: var(--color-muted)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .badge[data-variant=ghost]:is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-muted) 50%, transparent)
            }
        }
    }

    .badge[data-variant=link] {
        color: var(--color-primary);
        text-underline-offset: 4px
    }

    @media (hover:hover) {
        .badge[data-variant=link]:hover {
            text-decoration-line: underline
        }
    }

    .breadcrumb > ol {
        gap: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-muted-foreground)
    }

    @media (min-width:40rem) {
        .breadcrumb > ol {
            gap: calc(var(--spacing) * 2.5)
        }
    }

    .breadcrumb li {
        gap: calc(var(--spacing) * 1.5)
    }

    .breadcrumb a {
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    @media (hover:hover) {
        .breadcrumb a:hover {
            color: var(--color-foreground)
        }
    }

    .breadcrumb [aria-current=page] {
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal);
        color: var(--color-foreground)
    }

    .breadcrumb li[aria-hidden=true] > svg {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5)
    }

    .breadcrumb li > span[aria-hidden=true] {
        width: calc(var(--spacing) * 5);
        height: calc(var(--spacing) * 5)
    }

        .breadcrumb li > span[aria-hidden=true] > svg {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

    .command {
        background-color: var(--color-popover);
        padding: var(--spacing);
        color: var(--color-popover-foreground);
        border-radius: var(--radius-xl) !important
    }

    .command-dialog > .command {
        background-color: var(--color-popover);
        color: var(--color-popover-foreground);
        --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(--color-foreground);
        border-radius: var(--radius-xl) !important
    }

    @supports (color:color-mix(in lab, red, red)) {
        .command-dialog > .command {
            --tw-ring-color: color-mix(in oklab, var(--color-foreground) 10%, transparent)
        }
    }

    .command-dialog > .command {
        --tw-duration: .1s;
        transition-duration: .1s
    }

    .command > header {
        margin: var(--spacing);
        height: calc(var(--spacing) * 8);
        border-radius: var(--radius-lg);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        gap: 0;
        margin-bottom: 0
    }

    @supports (color:color-mix(in lab, red, red)) {
        .command > header {
            border-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .command > header {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .command > header {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .command > header {
        padding-inline: calc(var(--spacing) * 2)
    }

        .command > header svg {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4);
            opacity: .5
        }

        .command > header input {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            padding-inline-start: calc(var(--spacing) * 1.5)
        }

            .command > header input::placeholder {
                color: var(--color-muted-foreground)
            }

    .command [role=menu] {
        max-height: calc(var(--spacing) * 72);
        scroll-padding-block: var(--spacing)
    }

        .command [role=menu]:not(:has([role=menuitem]:not([aria-hidden=true]))):before {
            padding-block: calc(var(--spacing) * 6);
            text-align: center;
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }

    .command [role=group] {
        padding: var(--spacing);
        color: var(--color-foreground)
    }

    .command [role=heading] {
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-muted-foreground)
    }

    .command [role=separator] {
        margin-inline: calc(var(--spacing) * -1);
        background-color: var(--color-border);
        width: auto;
        height: 1px
    }

    .command [role=menuitem] {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-sm);
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    :where(.command-dialog) :is(.command [role=menuitem]) {
        border-radius: var(--radius-lg)
    }

    .command [role=menuitem] svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .command [role=menuitem].active {
        background-color: var(--color-muted);
        color: var(--color-foreground)
    }

        .command [role=menuitem].active svg {
            color: var(--color-foreground)
        }

    .command [data-shortcut] {
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-tracking: var(--tracking-widest);
        letter-spacing: var(--tracking-widest);
        color: var(--color-muted-foreground)
    }

    .command [role=menuitem].active [data-shortcut] {
        color: var(--color-foreground)
    }

    .combobox > input[role=combobox] {
        height: calc(var(--spacing) * 9);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        padding-block: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000;
        padding-inline-start: calc(var(--spacing) * 2.5);
        padding-inline-end: calc(var(--spacing) * 8)
    }

        .combobox > input[role=combobox]:focus-visible {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox > input[role=combobox]:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .combobox > input[role=combobox][aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox > input[role=combobox][aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .combobox > input[role=combobox]:is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox > input[role=combobox]:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .combobox > input[role=combobox]:is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox > input[role=combobox]:is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    .combobox > input[role=combobox]:is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox > input[role=combobox]:is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .combobox > svg, .combobox-trigger-icon {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        color: var(--color-muted-foreground);
        inset-inline-end: calc(var(--spacing) * 2.5);
        top: 50%
    }

    .combobox [data-popover] {
        max-height: calc(var(--spacing) * 72);
        border-radius: var(--radius-md);
        background-color: var(--color-popover);
        color: var(--color-popover-foreground);
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);
        --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(--color-foreground) 10%, transparent);
        --tw-duration: .1s;
        gap: 0;
        padding: 0;
        transition-duration: .1s
    }

    .combobox [role=listbox] {
        max-height: min(18rem, var(--available-height,18rem));
        scroll-padding-block: var(--spacing);
        padding: var(--spacing);
        overflow-y: auto
    }

        .combobox [role=listbox]:not(:has([data-value]:not([aria-hidden=true]))) {
            padding: 0
        }

            .combobox [role=listbox]:not(:has([data-value]:not([aria-hidden=true]))):before {
                padding-inline: calc(var(--spacing) * 3);
                padding-block: calc(var(--spacing) * 2);
                text-align: center;
                font-size: var(--text-sm);
                line-height: var(--tw-leading,var(--text-sm--line-height));
                color: var(--color-muted-foreground)
            }

    .combobox [role=heading] {
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        color: var(--color-muted-foreground)
    }

    .combobox [role=option] {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-sm);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        padding-inline-start: calc(var(--spacing) * 2);
        padding-inline-end: calc(var(--spacing) * 8)
    }

        .combobox [role=option] svg:not([class*=size-]) {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

        .combobox [role=option].active, .combobox [role=option]:focus-visible {
            background-color: var(--color-accent);
            color: var(--color-accent-foreground)
        }

    :is(.combobox [role=option].active,.combobox [role=option]:focus-visible) svg {
        color: var(--color-accent-foreground)
    }

    .combobox [role=group] {
        scroll-margin-block: var(--spacing);
        padding: var(--spacing)
    }

    .combobox [role=separator] {
        margin-inline: calc(var(--spacing) * -1);
        margin-block: var(--spacing);
        background-color: var(--color-border);
        height: 1px
    }

    .combobox-chips {
        min-height: calc(var(--spacing) * 9);
        gap: calc(var(--spacing) * 1.5);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        padding-inline: calc(var(--spacing) * 1.5);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000;
        background-clip: padding-box
    }

        .combobox-chips:focus-within {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox-chips:focus-within {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .combobox-chips:has([aria-invalid=true]) {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox-chips:has([aria-invalid=true]) {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .combobox-chips:is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox-chips:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .combobox-chips:is(html.dark *):has([aria-invalid=true]) {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox-chips:is(html.dark *):has([aria-invalid=true]) {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    .combobox-chips:is(html.dark *):has([aria-invalid=true]) {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox-chips:is(html.dark *):has([aria-invalid=true]) {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .combobox-chip {
        height: calc(var(--spacing) * 5.5);
        gap: var(--spacing);
        border-radius: var(--radius-sm);
        background-color: var(--color-muted);
        padding-inline: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-foreground)
    }

        .combobox-chip:has(>.combobox-chip-remove) {
            padding-inline-end: 0
        }

    .combobox-chip-remove {
        opacity: .5;
        margin-inline-start: calc(var(--spacing) * -1)
    }

    @media (hover:hover) {
        .combobox-chip-remove:hover {
            opacity: 1
        }
    }

    .combobox-chip-remove svg {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5)
    }

    .combobox [data-popover] > .input-group {
        margin: var(--spacing);
        height: calc(var(--spacing) * 8);
        border-color: var(--color-input);
        width: auto;
        margin-bottom: 0
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox [data-popover] > .input-group {
            border-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .combobox [data-popover] > .input-group {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .combobox [data-popover] > .input-group {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .combobox [data-popover] > .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)
    }

        .combobox [data-popover] > .input-group:focus-within {
            border-color: inherit;
            --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)
        }

    .combobox [data-popover] > input[role=combobox] {
        margin-bottom: var(--spacing);
        width: 100%
    }

    .select:not(select) > button {
        height: calc(var(--spacing) * 9);
        gap: calc(var(--spacing) * 1.5);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        padding-block: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        background-color: #0000;
        padding-inline-start: calc(var(--spacing) * 2.5);
        padding-inline-end: calc(var(--spacing) * 2)
    }

        .select:not(select) > button:focus-visible {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .select:not(select) > button:focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .select:not(select) > button[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .select:not(select) > button[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .select:not(select) > button[data-size=sm] {
        height: calc(var(--spacing) * 8)
    }

    .select:not(select) > button:is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .select:not(select) > button:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    @media (hover:hover) {
        .select:not(select) > button:is(html.dark *):hover {
            background-color: var(--color-input)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .select:not(select) > button:is(html.dark *):hover {
                background-color: color-mix(in oklab, var(--color-input) 50%, transparent)
            }
        }
    }

    .select:not(select) > button:is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .select:not(select) > button:is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    .select:not(select) > button:is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .select:not(select) > button:is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .select:not(select) > button svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .select:not(select) > button > span {
        gap: calc(var(--spacing) * 1.5)
    }

    .select:not(select) > button > svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        color: var(--color-muted-foreground)
    }

    .select:not(select) [data-popover] {
        border-radius: var(--radius-md);
        background-color: var(--color-popover);
        padding: var(--spacing);
        color: var(--color-popover-foreground);
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);
        --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(--color-foreground) 10%, transparent);
        --tw-duration: .1s;
        transition-duration: .1s
    }

    .select:not(select) [role=listbox] {
        scroll-padding-block: var(--spacing)
    }

        .select:not(select) [role=listbox]:not(:has([data-value]:not([aria-hidden=true]))):before {
            padding-block: calc(var(--spacing) * 6);
            text-align: center;
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }

    .select:not(select) [role=heading] {
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        color: var(--color-muted-foreground)
    }

    .select:not(select) [role=option] {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-sm);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        padding-inline-start: calc(var(--spacing) * 2);
        padding-inline-end: calc(var(--spacing) * 8)
    }

        .select:not(select) [role=option] svg:not([class*=size-]) {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

        .select:not(select) [role=option].active, .select:not(select) [role=option]:focus-visible {
            background-color: var(--color-muted);
            color: var(--color-foreground)
        }

    :is(.select:not(select) [role=option].active,.select:not(select) [role=option]:focus-visible) svg {
        color: var(--color-foreground)
    }

    .select:not(select) [role=group] {
        scroll-margin-block: var(--spacing);
        padding: var(--spacing)
    }

    .select:not(select) [role=separator] {
        margin-inline: calc(var(--spacing) * -1);
        margin-block: var(--spacing);
        background-color: var(--color-border);
        height: 1px
    }

    .dialog::backdrop, .alert-dialog::backdrop, .command-dialog::backdrop {
        background-color: #0000001a
    }

    @supports (color:color-mix(in lab, red, red)) {
        .dialog::backdrop, .alert-dialog::backdrop, .command-dialog::backdrop {
            background-color: color-mix(in oklab, var(--color-black) 10%, transparent)
        }
    }

    .dialog::backdrop, .alert-dialog::backdrop, .command-dialog::backdrop {
        --tw-backdrop-blur: blur(var(--blur-xs));
        -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,);
        --tw-duration: .1s;
        transition-duration: .1s
    }

    .alert-dialog > * {
        max-width: var(--container-xs);
        gap: calc(var(--spacing) * 6);
        border-radius: var(--radius-xl);
        background-color: var(--color-popover);
        padding: calc(var(--spacing) * 6);
        color: var(--color-popover-foreground);
        --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(--color-foreground)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .alert-dialog > * {
            --tw-ring-color: color-mix(in oklab, var(--color-foreground) 10%, transparent)
        }
    }

    .alert-dialog > * {
        --tw-duration: .1s;
        transition-duration: .1s
    }

    @media (min-width:40rem) {
        .alert-dialog > * {
            max-width: var(--container-lg)
        }

        .alert-dialog[data-size=sm] > *, .alert-dialog > [data-size=sm] {
            max-width: var(--container-xs)
        }
    }

    .dialog > * {
        gap: calc(var(--spacing) * 6);
        border-radius: var(--radius-xl);
        background-color: var(--color-popover);
        max-width: calc(100% - 2rem);
        padding: calc(var(--spacing) * 6);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-popover-foreground);
        --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(--color-foreground)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .dialog > * {
            --tw-ring-color: color-mix(in oklab, var(--color-foreground) 10%, transparent)
        }
    }

    .dialog > * {
        --tw-duration: .1s;
        transition-duration: .1s
    }

    @media (min-width:40rem) {
        .dialog > * {
            max-width: var(--container-md)
        }
    }

    .dialog > * > :is(button,form[method=dialog]) {
        inset-inline-end: calc(var(--spacing) * 4);
        top: calc(var(--spacing) * 4)
    }

    .dialog > * > header {
        gap: calc(var(--spacing) * 2)
    }

    .alert-dialog > * > header {
        column-gap: calc(var(--spacing) * 6);
        row-gap: calc(var(--spacing) * 1.5)
    }

        .alert-dialog > * > header > figure {
            margin-bottom: calc(var(--spacing) * 2);
            width: calc(var(--spacing) * 16);
            height: calc(var(--spacing) * 16);
            border-radius: var(--radius-md);
            background-color: var(--color-muted);
            justify-content: center;
            align-items: center;
            display: inline-flex
        }

            .alert-dialog > * > header > figure > svg:not([class*=size-]) {
                width: calc(var(--spacing) * 8);
                height: calc(var(--spacing) * 8)
            }

    .alert-dialog > * > footer, .dialog > * > footer {
        gap: calc(var(--spacing) * 2)
    }

    .dialog > * > header > h2, .dialog > * > [data-title] {
        --tw-leading: 1;
        --tw-font-weight: var(--font-weight-medium);
        line-height: 1;
        font-weight: var(--font-weight-medium)
    }

    .alert-dialog > * > header > h2, .alert-dialog > * > [data-title] {
        font-size: var(--text-lg);
        line-height: var(--tw-leading,var(--text-lg--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .dialog > * > header > p, .dialog > * > [data-description] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: var(--leading-normal);
        line-height: var(--leading-normal);
        color: var(--color-muted-foreground)
    }

    :is(.dialog>*>header>p,.dialog>*>[data-description]) a {
        text-underline-offset: 3px;
        text-decoration-line: underline
    }

        :is(.dialog>*>header>p,.dialog>*>[data-description]) a:hover {
            color: var(--color-foreground)
        }

    .alert-dialog > * > header > p, .alert-dialog > * > [data-description] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        text-wrap: balance;
        color: var(--color-muted-foreground)
    }

    @media (min-width:48rem) {
        .alert-dialog > * > header > p, .alert-dialog > * > [data-description] {
            text-wrap: pretty
        }
    }

    :is(.alert-dialog>*>header>p,.alert-dialog>*>[data-description]) a {
        text-underline-offset: 3px;
        text-decoration-line: underline
    }

        :is(.alert-dialog>*>header>p,.alert-dialog>*>[data-description]) a:hover {
            color: var(--color-foreground)
        }

    .drawer::backdrop {
        background-color: #0000001a
    }

    @supports (color:color-mix(in lab, red, red)) {
        .drawer::backdrop {
            background-color: color-mix(in oklab, var(--color-black) 10%, transparent)
        }
    }

    .drawer::backdrop {
        --tw-backdrop-blur: blur(var(--blur-xs));
        -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,)
    }

    .drawer > * {
        background-color: var(--color-popover);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-popover-foreground)
    }

    .drawer:not([data-side]) > *, .drawer[data-side=bottom] > * {
        border-top-left-radius: var(--radius-xl);
        border-top-right-radius: var(--radius-xl);
        border-top-style: var(--tw-border-style);
        border-top-width: 1px
    }

    .drawer[data-side=top] > * {
        border-bottom-right-radius: var(--radius-xl);
        border-bottom-left-radius: var(--radius-xl);
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }

    .drawer[data-side=left] > * {
        border-top-right-radius: var(--radius-xl);
        border-bottom-right-radius: var(--radius-xl);
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }

    .drawer[data-side=right] > * {
        border-top-left-radius: var(--radius-xl);
        border-bottom-left-radius: var(--radius-xl);
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .drawer > * > header {
        gap: calc(var(--spacing) * .5);
        padding: calc(var(--spacing) * 4);
        text-align: start
    }

    @media (min-width:48rem) {
        .drawer > * > header {
            gap: calc(var(--spacing) * 1.5)
        }
    }

    .drawer:not([data-side]) > * > header, .drawer[data-side=bottom] > * > header, .drawer[data-side=top] > * > header {
        text-align: center
    }

    .drawer > * > footer {
        gap: calc(var(--spacing) * 2);
        padding: calc(var(--spacing) * 4)
    }

    .drawer > * > header > h2, .drawer > * > [data-title] {
        font-size: var(--text-lg);
        line-height: var(--tw-leading,var(--text-lg--line-height));
        --tw-leading: 1;
        --tw-font-weight: var(--font-weight-semibold);
        line-height: 1;
        font-weight: var(--font-weight-semibold);
        --tw-tracking: var(--tracking-tight);
        letter-spacing: var(--tracking-tight)
    }

    .drawer > * > header > p, .drawer > * > [data-description] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-muted-foreground)
    }

    .dropdown-menu > [data-popover] {
        border-radius: var(--radius-md);
        background-color: var(--color-popover);
        padding: var(--spacing);
        color: var(--color-popover-foreground);
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);
        --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(--color-foreground) 10%, transparent);
        --tw-duration: .1s;
        gap: 0;
        transition-duration: .1s;
        overflow: hidden auto
    }

    .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-sm);
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]):focus-visible {
            background-color: var(--color-accent);
            color: var(--color-accent-foreground)
        }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]) svg:not([class*=size-]) {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

        .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]).active {
            background-color: var(--color-muted);
            color: var(--color-foreground)
        }

    .dropdown-menu [data-variant=destructive] {
        color: var(--color-destructive)
    }

        .dropdown-menu [data-variant=destructive]:is(:focus-visible,.active) {
            background-color: var(--color-destructive)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .dropdown-menu [data-variant=destructive]:is(:focus-visible,.active) {
            background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent)
        }
    }

    .dropdown-menu [data-variant=destructive]:is(:focus-visible,.active) {
        color: var(--color-destructive)
    }

        .dropdown-menu [data-variant=destructive]:is(:focus-visible,.active):is(html.dark *) {
            background-color: var(--color-destructive)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .dropdown-menu [data-variant=destructive]:is(:focus-visible,.active):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .dropdown-menu [data-variant=destructive] svg {
        color: var(--color-destructive)
    }

    .dropdown-menu :is([role=menuitemcheckbox],[role=menuitemradio]) {
        padding-block: calc(var(--spacing) * 1.5);
        padding-inline-start: calc(var(--spacing) * 2);
        padding-inline-end: calc(var(--spacing) * 8)
    }

    .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio])[data-inset], .dropdown-menu [role=heading][data-inset] {
        padding-inline-start: calc(var(--spacing) * 8)
    }

    .dropdown-menu [data-indicator] {
        justify-content: center;
        align-items: center;
        display: flex;
        position: absolute;
        inset-inline-end: calc(var(--spacing) * 2)
    }

    .dropdown-menu [role=heading] {
        padding-inline: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-muted-foreground)
    }

    .dropdown-menu [role=separator] {
        margin-inline: calc(var(--spacing) * -1);
        margin-block: var(--spacing);
        background-color: var(--color-border);
        height: 1px
    }

    .dropdown-menu :is([data-shortcut],kbd:last-child,.kbd:last-child) {
        font-family: var(--font-sans);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-tracking: var(--tracking-widest);
        letter-spacing: var(--tracking-widest);
        color: var(--color-muted-foreground)
    }

    .dropdown-menu :is([role=menuitem],[role=menuitemcheckbox],[role=menuitemradio]):is(:focus-visible,.active) :is([data-shortcut],kbd:last-child,.kbd:last-child) {
        color: var(--color-accent-foreground)
    }

    [data-popover] {
        gap: calc(var(--spacing) * 4);
        border-radius: var(--radius-md);
        background-color: var(--color-popover);
        padding: calc(var(--spacing) * 4);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-popover-foreground);
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);
        --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(--color-foreground) 10%, transparent);
        --tw-duration: .1s;
        flex-direction: column;
        transition-duration: .1s;
        display: flex
    }

    .popover > [data-popover] > header, .popover > [data-popover] > [data-header] {
        gap: var(--spacing);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        flex-direction: column;
        display: flex
    }

        .popover > [data-popover] > header > :is(h1,h2,h3,h4,h5,h6), .popover > [data-popover] > :is(h1,h2,h3,h4,h5,h6,[data-title]) {
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium)
        }

        .popover > [data-popover] > header > p, .popover > [data-popover] > [data-description] {
            color: var(--color-muted-foreground)
        }

    .card {
        border-radius: var(--radius-xl);
        background-color: var(--color-card);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-card-foreground);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        --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(--color-foreground) 10%, transparent);
        overflow: hidden
    }

        .card:has(>img:first-child) {
            padding-top: 0
        }

        .card > img:first-child {
            border-top-left-radius: var(--radius-xl);
            border-top-right-radius: var(--radius-xl)
        }

        .card > img:last-child {
            border-bottom-right-radius: var(--radius-xl);
            border-bottom-left-radius: var(--radius-xl)
        }

    .card {
        gap: calc(var(--spacing) * 6);
        padding-block: calc(var(--spacing) * 6)
    }

        .card[data-size=sm] {
            gap: calc(var(--spacing) * 4);
            padding-block: calc(var(--spacing) * 4)
        }

        .card > header {
            gap: var(--spacing);
            border-top-left-radius: var(--radius-xl);
            border-top-right-radius: var(--radius-xl);
            padding-inline: calc(var(--spacing) * 6)
        }

            .card > header.border-b {
                padding-bottom: calc(var(--spacing) * 6)
            }

        .card[data-size=sm] > header {
            padding-inline: calc(var(--spacing) * 4)
        }

            .card[data-size=sm] > header.border-b {
                padding-bottom: calc(var(--spacing) * 4)
            }

        .card > header > :is(h2,h3,[data-title],.card-title) {
            font-size: var(--text-base);
            line-height: var(--tw-leading,var(--text-base--line-height));
            --tw-leading: var(--leading-normal);
            line-height: var(--leading-normal);
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium)
        }

        .card[data-size=sm] > header > :is(h2,h3,[data-title],.card-title) {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }

        .card > header > :is(p,[data-description],.card-description) {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            color: var(--color-muted-foreground)
        }

        .card > section {
            padding-inline: calc(var(--spacing) * 6)
        }

        .card[data-size=sm] > section {
            padding-inline: calc(var(--spacing) * 4)
        }

        .card > footer {
            border-bottom-right-radius: var(--radius-xl);
            border-bottom-left-radius: var(--radius-xl);
            padding-inline: calc(var(--spacing) * 6)
        }

            .card > footer.border-t {
                padding-top: calc(var(--spacing) * 6)
            }

        .card[data-size=sm] > footer {
            padding-inline: calc(var(--spacing) * 4)
        }

            .card[data-size=sm] > footer.border-t {
                padding-top: calc(var(--spacing) * 4)
            }

    .chart {
        --chart-bar-radius: 6px
    }

    .chart-tooltip {
        gap: calc(var(--spacing) * 1.5);
        border-radius: var(--radius-lg);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-border)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .chart-tooltip {
            border-color: color-mix(in oklab, var(--color-border) 50%, transparent)
        }
    }

    .chart-tooltip {
        background-color: var(--color-background);
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        color: var(--color-foreground);
        --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .chart-tooltip-title {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .chart-legend-item {
        color: var(--color-foreground)
    }

        .chart-legend-item[aria-pressed=false] {
            color: var(--color-muted-foreground)
        }

    .field > input[type=checkbox]:not([role=switch]), .input[type=checkbox]:not([role=switch]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        border-radius: 4px;
        justify-content: center;
        align-items: center;
        display: flex
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):checked {
        border-color: var(--color-primary);
        background-color: var(--color-primary);
        color: var(--color-primary-foreground)
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :where([data-disabled=true]) :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])) {
        opacity: .5
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch]))[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch]))[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch]))[aria-invalid=true]:checked {
        border-color: var(--color-primary)
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *):checked {
        background-color: var(--color-primary)
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    :is(.field>input[type=checkbox]:not([role=switch]),.input[type=checkbox]:not([role=switch])):checked:after {
        width: calc(var(--spacing) * 3.5);
        height: calc(var(--spacing) * 3.5)
    }

    [role=radiogroup] {
        gap: calc(var(--spacing) * 3);
        display: grid
    }

    .field > input[type=radio], .input[type=radio] {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        border-color: var(--color-input);
        border-radius: 3.40282e38px;
        display: flex
    }

    :is(.field>input[type=radio],.input[type=radio]):checked {
        border-color: var(--color-primary);
        background-color: var(--color-primary);
        color: var(--color-primary-foreground)
    }

    :is(.field>input[type=radio],.input[type=radio]):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=radio],.input[type=radio]):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=radio],.input[type=radio])[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=radio],.input[type=radio])[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    :is(.field>input[type=radio],.input[type=radio])[aria-invalid=true]:checked {
        border-color: var(--color-primary)
    }

    :is(.field>input[type=radio],.input[type=radio]):is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=radio],.input[type=radio]):is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    :is(.field>input[type=radio],.input[type=radio]):is(html.dark *):checked {
        background-color: var(--color-primary)
    }

    :is(.field>input[type=radio],.input[type=radio]):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=radio],.input[type=radio]):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>input[type=radio],.input[type=radio]):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=radio],.input[type=radio]):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    :is(.field>input[type=radio],.input[type=radio]):checked:before {
        width: calc(var(--spacing) * 2);
        height: calc(var(--spacing) * 2);
        background-color: var(--color-primary-foreground)
    }

    .field > input[type=checkbox][role=switch], .input[type=checkbox][role=switch] {
        border-style: var(--tw-border-style);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        border-width: 1px;
        border-color: #0000;
        border-radius: 3.40282e38px
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):not(:checked) {
        background-color: var(--color-input)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):checked {
        background-color: var(--color-primary)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):focus-visible {
        border-color: var(--color-ring);
        --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);
        --tw-ring-color: var(--color-ring)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):focus-visible {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch])[aria-invalid=true] {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch])[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *):not(:checked) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *):not(:checked) {
            background-color: color-mix(in oklab, var(--color-input) 80%, transparent)
        }
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *)[aria-invalid=true] {
        border-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *)[aria-invalid=true] {
            border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent)
        }
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *)[aria-invalid=true] {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):is(html.dark *)[aria-invalid=true] {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):not([data-size=sm]) {
        width: 32px;
        height: 18.4px
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch])[data-size=sm] {
        width: 24px;
        height: 14px
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):before {
        background-color: var(--color-background);
        border-radius: 3.40282e38px
    }

    html.dark :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):not(:checked):before {
        background-color: var(--color-foreground)
    }

    html.dark :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):checked:before {
        background-color: var(--color-primary-foreground)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):not([data-size=sm]):before {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch])[data-size=sm]:before {
        width: calc(var(--spacing) * 3);
        height: calc(var(--spacing) * 3)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):checked:not([data-size=sm]):before, :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):checked[data-size=sm]:before {
        --tw-translate-x: calc(100% - 2px);
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):dir(rtl):checked:not([data-size=sm]):before {
        --tw-translate-x: calc(calc(100% - 2px) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):dir(rtl):checked[data-size=sm]:before {
        --tw-translate-x: calc(calc(100% - 2px) * -1);
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    :is(.field>input[type=checkbox][role=switch],.input[type=checkbox][role=switch]):not(:checked):before {
        --tw-translate-x: 0;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .fieldset {
        gap: calc(var(--spacing) * 6)
    }

        .fieldset:has(>[data-slot=checkbox-group]), .fieldset:has(>[data-slot=radio-group]) {
            gap: calc(var(--spacing) * 3)
        }

        .fieldset > legend {
            margin-bottom: calc(var(--spacing) * 3);
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium)
        }

            .fieldset > legend[data-variant=label] {
                font-size: var(--text-sm);
                line-height: var(--tw-leading,var(--text-sm--line-height))
            }

            .fieldset > legend[data-variant=legend] {
                font-size: var(--text-base);
                line-height: var(--tw-leading,var(--text-base--line-height))
            }

        .fieldset > :is([role=group],[role=radiogroup]):not(.field), .field > :is(fieldset,[role=group],[role=radiogroup]):not(.field) {
            gap: calc(var(--spacing) * 7)
        }

    :is(.fieldset>:is([role=group],[role=radiogroup]):not(.field),.field>:is(fieldset,[role=group],[role=radiogroup]):not(.field))[role=radiogroup], :is(.fieldset>:is([role=group],[role=radiogroup]):not(.field),.field>:is(fieldset,[role=group],[role=radiogroup]):not(.field)):has(>.field>input[type=checkbox]:not([role=switch])), :is(.fieldset>:is([role=group],[role=radiogroup]):not(.field),.field>:is(fieldset,[role=group],[role=radiogroup]):not(.field)):has(>.field>input[type=radio]), :is(.fieldset>:is([role=group],[role=radiogroup]):not(.field),.field>:is(fieldset,[role=group],[role=radiogroup]):not(.field))[data-slot=checkbox-group], :is(.fieldset>:is([role=group],[role=radiogroup]):not(.field),.field>:is(fieldset,[role=group],[role=radiogroup]):not(.field))[data-slot=radio-group] {
        gap: calc(var(--spacing) * 3)
    }

    :is(.fieldset,.field) > :is([role=group],[role=radiogroup]):not(.field) > :is([role=group],[role=radiogroup]):not(.field), .field > fieldset:not(.field) > :is([role=group],[role=radiogroup]):not(.field) {
        gap: calc(var(--spacing) * 4)
    }

    .field {
        gap: calc(var(--spacing) * 3)
    }

        .field[data-invalid], .field[data-invalid=true] {
            color: var(--color-destructive)
        }

        .field > section {
            gap: var(--spacing)
        }

            .field > label, .field > section > label, label:has(>.field) {
                gap: calc(var(--spacing) * 2);
                --tw-leading: var(--leading-snug);
                line-height: var(--leading-snug)
            }

    :where([data-disabled=true]) :is(.field>label,.field>section>label,label:has(>.field)) {
        opacity: .5
    }

    :is(.field>label,.field>section>label,label:has(>.field)):has(:checked) {
        border-color: var(--color-primary)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>label,.field>section>label,label:has(>.field)):has(:checked) {
            border-color: color-mix(in oklab, var(--color-primary) 30%, transparent)
        }
    }

    :is(.field>label,.field>section>label,label:has(>.field)):has(:checked) {
        background-color: var(--color-primary)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>label,.field>section>label,label:has(>.field)):has(:checked) {
            background-color: color-mix(in oklab, var(--color-primary) 5%, transparent)
        }
    }

    :is(.field>label,.field>section>label,label:has(>.field)):is(html.dark *):has(:checked) {
        border-color: var(--color-primary)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>label,.field>section>label,label:has(>.field)):is(html.dark *):has(:checked) {
            border-color: color-mix(in oklab, var(--color-primary) 20%, transparent)
        }
    }

    :is(.field>label,.field>section>label,label:has(>.field)):is(html.dark *):has(:checked) {
        background-color: var(--color-primary)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>label,.field>section>label,label:has(>.field)):is(html.dark *):has(:checked) {
            background-color: color-mix(in oklab, var(--color-primary) 10%, transparent)
        }
    }

    .field > label:has(input[type=radio]), .field > label:has(input[type=checkbox]), .field > label:has(input[role=switch]), .field > label:has(>.field), label:has(>.field) {
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .field > label:has(input[type=radio]), .field > label:has(input[type=checkbox]), .field > label:has(input[role=switch]), :is(.field>label,label:has(>.field)) > .field {
        padding: calc(var(--spacing) * 3)
    }

    .field h2, .field h3 {
        gap: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug);
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    :where([data-disabled=true]) :is(.field h2,.field h3) {
        opacity: .5
    }

    .fieldset legend + p, .field > p, .field section > p {
        text-align: start;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-muted-foreground)
    }

    [data-variant=legend] + :is(.fieldset legend+p,.field>p,.field section>p) {
        margin-top: calc(var(--spacing) * -1.5)
    }

    .fieldset > legend[data-variant=label] {
        margin-bottom: 0
    }

    .fieldset > legend:not([data-variant]) + p, .fieldset > legend[data-variant=legend] + p {
        margin-top: calc(var(--spacing) * -1.5)
    }

    .field-separator {
        margin-block: calc(var(--spacing) * -2);
        height: calc(var(--spacing) * 5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    :where([data-variant=outline]) .field-separator {
        margin-bottom: calc(var(--spacing) * -2)
    }

    .field-separator > span {
        padding-inline: calc(var(--spacing) * 2);
        color: var(--color-muted-foreground)
    }

    .field [role=alert] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-destructive)
    }

    .input-group {
        height: calc(var(--spacing) * 9);
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-input);
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

        .input-group:focus-within {
            border-color: var(--color-ring);
            --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);
            --tw-ring-color: var(--color-ring)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .input-group:focus-within {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    .input-group:has([aria-invalid=true]) {
        border-color: var(--color-destructive);
        --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);
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .input-group:has([aria-invalid=true]) {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent)
        }
    }

    .input-group:has(>textarea) {
        height: auto
    }

    .input-group:is(html.dark *) {
        background-color: var(--color-input)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .input-group:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-input) 30%, transparent)
        }
    }

    .input-group:is(html.dark *):has([aria-invalid=true]) {
        --tw-ring-color: var(--color-destructive)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .input-group:is(html.dark *):has([aria-invalid=true]) {
            --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent)
        }
    }

    .input-group:has(>:is(input,textarea,select,[data-control]):disabled) {
        opacity: .5
    }

    .input-group > :is(input,select,[data-control]) {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: var(--spacing);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .input-group:not([data-orientation=vertical]):has(>:is([data-align=start],[data-align=inline-start])) > :is(input,select,[data-control]) {
        padding-inline-start: calc(var(--spacing) * 1.5)
    }

    .input-group:not([data-orientation=vertical]):has(>:is([data-align=end],[data-align=inline-end])) > :is(input,select,[data-control]) {
        padding-inline-end: calc(var(--spacing) * 1.5)
    }

    .input-group > textarea {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .input-group > :is(span,[role=group],header,footer), .input-group > :is(svg,kbd,.popover,.dropdown-menu) {
        gap: calc(var(--spacing) * 2);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-muted-foreground);
        -webkit-user-select: none;
        user-select: none
    }

    :is(.input-group>:is(span,[role=group],header,footer),.input-group>:is(svg,kbd,.popover,.dropdown-menu)) > svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .input-group > :is([data-align=start],[data-align=inline-start]) {
        padding-inline-start: calc(var(--spacing) * 2)
    }

    .input-group > :is([data-align=end],[data-align=inline-end]) {
        padding-inline-end: calc(var(--spacing) * 2)
    }

    .input-group > :is([data-align=start],[data-align=inline-start]):has(>button) {
        margin-inline-start: calc(var(--spacing) * -1)
    }

    .input-group > :is([data-align=end],[data-align=inline-end]):has(>button) {
        margin-inline-end: calc(var(--spacing) * -1)
    }

    .input-group > :is([data-align=start],[data-align=inline-start]):has(>kbd) {
        margin-inline-start: calc(var(--spacing) * -.5)
    }

    .input-group > :is([data-align=end],[data-align=inline-end]):has(>kbd) {
        margin-inline-end: calc(var(--spacing) * -.5)
    }

    .input-group > [data-align=block-start] {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-top: calc(var(--spacing) * 2)
    }

    .input-group > [data-align=block-end] {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-bottom: calc(var(--spacing) * 2)
    }

    .input-group > [data-align=block-start].border-b {
        padding-bottom: calc(var(--spacing) * 2)
    }

    .input-group > [data-align=block-end].border-t {
        padding-top: calc(var(--spacing) * 2)
    }

    .input-group[data-orientation=vertical] > :is(header,footer,[role=group],[data-align]) {
        padding-inline: calc(var(--spacing) * 2.5)
    }

    .input-group[data-orientation=vertical] > :is(header[data-align=start],[data-align=block-start]) {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-top: calc(var(--spacing) * 2)
    }

    .input-group[data-orientation=vertical] > :is(footer[data-align=end],[data-align=block-end]) {
        padding-inline: calc(var(--spacing) * 2.5);
        padding-bottom: calc(var(--spacing) * 2)
    }

    .input-group[data-orientation=vertical]:has(>input) > :is(header[data-align=start],[data-align=block-start]) {
        padding-top: calc(var(--spacing) * 2)
    }

    .input-group[data-orientation=vertical]:has(>input) > :is(footer[data-align=end],[data-align=block-end]), .input-group[data-orientation=vertical] > :is(header[data-align=start],[data-align=block-start]).border-b {
        padding-bottom: calc(var(--spacing) * 2)
    }

    .input-group[data-orientation=vertical] > :is(footer[data-align=end],[data-align=block-end]).border-t {
        padding-top: calc(var(--spacing) * 2)
    }

    .input-group > :is(kbd,span>kbd,[role=group]>kbd,header>kbd,footer>kbd) {
        border-radius: calc(var(--radius) - 5px)
    }

    .input-group > :is(button,[role=group]>button,header>button,footer>button) {
        gap: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --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)
    }

        .input-group > :is(button,[role=group]>button,header>button,footer>button) > svg:not([class*=size-]) {
            width: calc(var(--spacing) * 3.5);
            height: calc(var(--spacing) * 3.5)
        }

        .input-group > :is(button,[role=group]>button,header>button,footer>button):has(>svg):not(:has(>:not(svg))) {
            width: calc(var(--spacing) * 6);
            height: calc(var(--spacing) * 6);
            border-radius: calc(var(--radius) - 5px);
            padding: 0
        }

    .empty {
        gap: calc(var(--spacing) * 4);
        border-radius: var(--radius-lg);
        --tw-border-style: dashed;
        padding: calc(var(--spacing) * 12);
        border-style: dashed
    }

        .empty > header {
            gap: calc(var(--spacing) * 2)
        }

        .empty figure {
            margin-bottom: calc(var(--spacing) * 2)
        }

            .empty figure:has(>svg:only-child) {
                width: calc(var(--spacing) * 10);
                height: calc(var(--spacing) * 10);
                border-radius: var(--radius-lg);
                background-color: var(--color-muted);
                color: var(--color-foreground);
                flex-shrink: 0;
                justify-content: center;
                align-items: center;
                display: flex
            }

                .empty figure:has(>svg:only-child) svg:not([class*=size-]) {
                    width: calc(var(--spacing) * 6);
                    height: calc(var(--spacing) * 6)
                }

        .empty :is(h2,h3,h4) {
            font-size: var(--text-lg);
            line-height: var(--tw-leading,var(--text-lg--line-height));
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium);
            --tw-tracking: var(--tracking-tight);
            letter-spacing: var(--tracking-tight)
        }

        .empty > header > p {
            font-size: var(--text-sm);
            line-height: var(--leading-relaxed);
            color: var(--color-muted-foreground)
        }

        .empty > :is(section,footer) {
            gap: calc(var(--spacing) * 4);
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height))
        }

    .item {
        border-radius: var(--radius-md);
        border-style: var(--tw-border-style);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        border-width: 1px
    }

        .item:not([data-variant]), .item[data-variant=default] {
            border-color: #0000
        }

        .item[data-variant=outline] {
            border-color: var(--color-border)
        }

        .item[data-variant=muted] {
            background-color: var(--color-muted);
            border-color: #0000
        }

    @supports (color:color-mix(in lab, red, red)) {
        .item[data-variant=muted] {
            background-color: color-mix(in oklab, var(--color-muted) 50%, transparent)
        }
    }

    .item:not([data-size]), .item[data-size=default] {
        gap: calc(var(--spacing) * 3.5);
        padding-inline: calc(var(--spacing) * 4);
        padding-block: calc(var(--spacing) * 3.5)
    }

    .item[data-size=sm] {
        gap: calc(var(--spacing) * 2.5);
        padding-inline: calc(var(--spacing) * 3);
        padding-block: calc(var(--spacing) * 2.5)
    }

    .item[data-size=xs] {
        gap: calc(var(--spacing) * 2);
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: calc(var(--spacing) * 2)
    }

    .item > figure {
        gap: calc(var(--spacing) * 2)
    }

    .item:has(p) > figure {
        --tw-translate-y: calc(var(--spacing) * .5);
        translate: var(--tw-translate-x) var(--tw-translate-y);
        align-self: flex-start
    }

    .item > figure:has(>svg:only-child) svg:not([class*=size-]) {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .item > figure:has(>img) {
        width: calc(var(--spacing) * 10);
        height: calc(var(--spacing) * 10);
        border-radius: var(--radius-sm);
        overflow: hidden
    }

    .item[data-size=sm] > figure:has(>img) {
        width: calc(var(--spacing) * 8);
        height: calc(var(--spacing) * 8)
    }

    .item[data-size=xs] > figure:has(>img) {
        width: calc(var(--spacing) * 6);
        height: calc(var(--spacing) * 6)
    }

    .item > section {
        gap: var(--spacing)
    }

    .item[data-size=xs] > section {
        gap: 0
    }

    .item :is(h2,h3,h4) {
        gap: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug);
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        text-underline-offset: 4px
    }

    .item p {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: var(--leading-normal);
        line-height: var(--leading-normal)
    }

    .item[data-size=xs] p {
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height))
    }

    .item > aside, .item > :is(header,footer) {
        gap: calc(var(--spacing) * 2)
    }

    .item-group {
        gap: calc(var(--spacing) * 4)
    }

        .item-group:has(>.item[data-size=sm]) {
            gap: calc(var(--spacing) * 2.5)
        }

        .item-group:has(>.item[data-size=xs]) {
            gap: calc(var(--spacing) * 2)
        }

        .item-group > hr {
            margin-block: calc(var(--spacing) * 2)
        }

    .kbd {
        height: calc(var(--spacing) * 5);
        width: fit-content;
        min-width: calc(var(--spacing) * 5);
        gap: var(--spacing);
        border-radius: var(--radius-sm);
        background-color: var(--color-muted);
        padding-inline: var(--spacing);
        font-family: var(--font-sans);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-muted-foreground)
    }

    :where([data-slot=tooltip-content]) .kbd {
        background-color: var(--color-background)
    }

    @supports (color:color-mix(in lab, red, red)) {
        :where([data-slot=tooltip-content]) .kbd {
            background-color: color-mix(in oklab, var(--color-background) 20%, transparent)
        }
    }

    :where([data-slot=tooltip-content]) .kbd {
        color: var(--color-background)
    }

        :where([data-slot=tooltip-content]) .kbd:is(html.dark *) {
            background-color: var(--color-background)
        }

    @supports (color:color-mix(in lab, red, red)) {
        :where([data-slot=tooltip-content]) .kbd:is(html.dark *) {
            background-color: color-mix(in oklab, var(--color-background) 10%, transparent)
        }
    }

    .kbd svg:not([class*=size-]) {
        width: calc(var(--spacing) * 3);
        height: calc(var(--spacing) * 3)
    }

    .field > label, .label {
        gap: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: 1;
        --tw-font-weight: var(--font-weight-medium);
        line-height: 1;
        font-weight: var(--font-weight-medium)
    }

    :is(.field>label,.label):is(:where(.peer):disabled~*), :where([data-disabled=true]) :is(.field>label,.label) {
        opacity: .5
    }

    .field > section > label {
        gap: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug);
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

        .field > section > label:is(:where(.peer):disabled~*), :where([data-disabled=true]) :is(.field>section>label) {
            opacity: .5
        }

    .sidebar nav {
        background-color: var(--color-sidebar);
        color: var(--color-sidebar-foreground)
    }

        .sidebar nav > header, .sidebar nav > footer {
            gap: calc(var(--spacing) * 2);
            padding: calc(var(--spacing) * 2)
        }

        .sidebar nav > section {
            gap: calc(var(--spacing) * 2)
        }

        .sidebar nav [role=separator] {
            margin-inline: calc(var(--spacing) * 2);
            border-color: var(--color-sidebar-border)
        }

        .sidebar nav > section > [role=group] {
            padding: calc(var(--spacing) * 2)
        }

        .sidebar nav h3 {
            height: calc(var(--spacing) * 8);
            border-radius: var(--radius-md);
            padding-inline: calc(var(--spacing) * 2);
            font-size: var(--text-xs);
            line-height: var(--tw-leading,var(--text-xs--line-height));
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium);
            color: var(--color-sidebar-foreground)
        }

    @supports (color:color-mix(in lab, red, red)) {
        .sidebar nav h3 {
            color: color-mix(in oklab, var(--color-sidebar-foreground) 70%, transparent)
        }
    }

    .sidebar nav h3 {
        --tw-ring-color: var(--color-sidebar-ring);
        transition-property: margin,opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        --tw-duration: .2s;
        --tw-ease: linear;
        transition-duration: .2s;
        transition-timing-function: linear
    }

        .sidebar nav h3: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)
        }

        .sidebar nav h3 > svg {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

    .sidebar nav > section > [role=group] > ul {
        gap: var(--spacing)
    }

    .sidebar nav > section > [role=group] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .sidebar nav li > :is(a,button), .sidebar nav li > details > summary {
        gap: calc(var(--spacing) * 2);
        border-radius: var(--radius-md);
        padding: calc(var(--spacing) * 2);
        text-align: left;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        --tw-ring-color: var(--color-sidebar-ring)
    }

    @media (hover:hover) {
        :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary):hover {
            background-color: var(--color-sidebar-accent);
            color: var(--color-sidebar-accent-foreground)
        }
    }

    :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary):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);
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary):focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary):active {
        background-color: var(--color-sidebar-accent);
        color: var(--color-sidebar-accent-foreground)
    }

    @media (hover:hover) {
        :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary)[data-open]:hover {
            background-color: var(--color-sidebar-accent);
            color: var(--color-sidebar-accent-foreground)
        }
    }

    :is(.sidebar nav li>:is(a,button),.sidebar nav li>details>summary) > svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        flex-shrink: 0
    }

    .sidebar nav li > :is(a,button):is([aria-current=page],[data-active=true]), .sidebar nav li > details > summary:is([aria-current=page],[data-active=true]) {
        background-color: var(--color-sidebar-accent);
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        color: var(--color-sidebar-accent-foreground)
    }

    @media (hover:hover) {
        :is(.sidebar nav li>:is(a,button):not([data-variant]),.sidebar nav li>details>summary:not([data-variant]),.sidebar nav li>:is(a,button)[data-variant=default],.sidebar nav li>details>summary[data-variant=default]):hover {
            background-color: var(--color-sidebar-accent);
            color: var(--color-sidebar-accent-foreground)
        }
    }

    .sidebar nav li > :is(a,button)[data-variant=outline], .sidebar nav li > details > summary[data-variant=outline] {
        background-color: var(--color-background);
        --tw-shadow: 0 0 0 1px var(--tw-shadow-color,var(--sidebar-border));
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    @media (hover:hover) {
        :is(.sidebar nav li>:is(a,button)[data-variant=outline],.sidebar nav li>details>summary[data-variant=outline]):hover {
            background-color: var(--color-sidebar-accent);
            color: var(--color-sidebar-accent-foreground);
            --tw-shadow: 0 0 0 1px var(--tw-shadow-color,var(--sidebar-accent));
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }
    }

    .sidebar nav li > :is(a,button):not([data-size]), .sidebar nav li > details > summary:not([data-size]), .sidebar nav li > :is(a,button)[data-size=default], .sidebar nav li > details > summary[data-size=default] {
        height: calc(var(--spacing) * 8);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .sidebar nav li > :is(a,button)[data-size=sm], .sidebar nav li > details > summary[data-size=sm] {
        height: calc(var(--spacing) * 7);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height))
    }

    .sidebar nav li > :is(a,button)[data-size=lg], .sidebar nav li > details > summary[data-size=lg] {
        height: calc(var(--spacing) * 12);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .sidebar nav li > details > summary:after {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .sidebar nav li > details::details-content {
        padding-inline: calc(var(--spacing) * 3.5)
    }

    .sidebar nav ul ul {
        --tw-translate-x: 1px;
        translate: var(--tw-translate-x) var(--tw-translate-y);
        gap: var(--spacing);
        border-inline-start-style: var(--tw-border-style);
        border-inline-start-width: 1px;
        border-color: var(--color-sidebar-border);
        padding-inline: calc(var(--spacing) * 2.5);
        padding-block: calc(var(--spacing) * .5)
    }

        .sidebar nav ul ul:where(:dir(rtl),[dir=rtl],[dir=rtl] *) {
            --tw-translate-x: -1px;
            translate: var(--tw-translate-x) var(--tw-translate-y)
        }

        .sidebar nav ul ul > li > :is(a,button), .sidebar nav ul ul > li > details > summary {
            height: calc(var(--spacing) * 7);
            gap: calc(var(--spacing) * 2);
            border-radius: var(--radius-md);
            padding-inline: calc(var(--spacing) * 2);
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            color: var(--color-sidebar-foreground);
            --tw-ring-color: var(--color-sidebar-ring)
        }

    @media (hover:hover) {
        :is(.sidebar nav ul ul>li>:is(a,button),.sidebar nav ul ul>li>details>summary):hover {
            background-color: var(--color-sidebar-accent);
            color: var(--color-sidebar-accent-foreground)
        }
    }

    :is(.sidebar nav ul ul>li>:is(a,button),.sidebar nav ul ul>li>details>summary):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)
    }

    :is(.sidebar nav ul ul>li>:is(a,button),.sidebar nav ul ul>li>details>summary):active {
        background-color: var(--color-sidebar-accent);
        color: var(--color-sidebar-accent-foreground)
    }

    :is(.sidebar nav ul ul>li>:is(a,button),.sidebar nav ul ul>li>details>summary) > svg {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4)
    }

    .progress {
        height: calc(var(--spacing) * 1.5);
        background-color: var(--color-muted);
        border-radius: 3.40282e38px
    }

        .progress > span {
            background-color: var(--color-primary)
        }

    .skeleton {
        border-radius: var(--radius-md);
        background-color: var(--color-muted)
    }

    .table-container {
        width: 100%;
        position: relative;
        overflow-x: auto
    }

    .table {
        caption-side: bottom;
        width: 100%;
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

        .table thead tr {
            border-bottom-style: var(--tw-border-style);
            border-bottom-width: 1px
        }

        .table tbody tr:last-child {
            border-style: var(--tw-border-style);
            border-width: 0
        }

        .table tfoot {
            border-top-style: var(--tw-border-style);
            background-color: var(--color-muted);
            border-top-width: 1px
        }

    @supports (color:color-mix(in lab, red, red)) {
        .table tfoot {
            background-color: color-mix(in oklab, var(--color-muted) 50%, transparent)
        }
    }

    .table tfoot {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

        .table tfoot > tr:last-child {
            border-bottom-style: var(--tw-border-style);
            border-bottom-width: 0
        }

    .table tr {
        border-bottom-style: var(--tw-border-style);
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        border-bottom-width: 1px
    }

    @media (hover:hover) {
        .table tr:hover {
            background-color: var(--color-muted)
        }

        @supports (color:color-mix(in lab, red, red)) {
            .table tr:hover {
                background-color: color-mix(in oklab, var(--color-muted) 50%, transparent)
            }
        }
    }

    .table tr[data-state=selected] {
        background-color: var(--color-muted)
    }

    .table th {
        height: calc(var(--spacing) * 10);
        padding-inline: calc(var(--spacing) * 2);
        text-align: start;
        vertical-align: middle;
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        white-space: nowrap;
        color: var(--color-foreground)
    }

        .table th:has([role=checkbox]) {
            padding-inline-end: 0
        }

    .table td {
        padding: calc(var(--spacing) * 2);
        vertical-align: middle;
        white-space: nowrap
    }

        .table td:has([role=checkbox]) {
            padding-inline-end: 0
        }

    .table caption {
        margin-top: calc(var(--spacing) * 4);
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        color: var(--color-muted-foreground)
    }

    [data-tooltip]:before {
        align-items: center;
        gap: calc(var(--spacing) * 1.5);
        border-radius: var(--radius-md);
        background-color: var(--color-foreground);
        padding-inline: calc(var(--spacing) * 3);
        padding-block: calc(var(--spacing) * 1.5);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        color: var(--color-background);
        display: inline-flex
    }

        [data-tooltip]:before:has() {
            padding-inline-end: calc(var(--spacing) * 1.5)
        }

    [data-tooltip][data-arrow]:after {
        z-index: 60;
        width: calc(var(--spacing) * 2.5);
        height: calc(var(--spacing) * 2.5);
        background-color: var(--color-foreground);
        border-radius: 2px;
        position: absolute;
        rotate: 45deg
    }

    .toast-content {
        border-radius: var(--radius-2xl);
        border-style: var(--tw-border-style);
        background-color: var(--color-popover);
        color: var(--color-popover-foreground);
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        border-width: 1px
    }

    .field > input[type=range], .input[type=range] {
        height: calc(var(--spacing) * 5);
        --slider-track-height: .375rem;
        --slider-thumb-size: 1rem
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-runnable-track {
        height: calc(var(--spacing) * 1.5);
        background-color: var(--color-muted);
        border-radius: 3.40282e38px
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-track {
        height: calc(var(--spacing) * 1.5);
        background-color: var(--color-muted);
        border-radius: 3.40282e38px
    }

    :is(.field>input[type=range],.input[type=range])::-ms-track {
        height: calc(var(--spacing) * 1.5);
        background-color: var(--color-muted);
        border-radius: 3.40282e38px
    }

    :is(.field>input[type=range],.input[type=range])::-ms-fill-lower {
        border-radius: inherit
    }

    :is(.field>input[type=range],.input[type=range])::-ms-fill-upper {
        border-radius: inherit
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb {
        margin-top: calc(calc((var(--slider-thumb-size) - var(--slider-track-height)) / 2) * -1);
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-primary);
        background-color: var(--color-white);
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        --tw-ring-color: var(--color-ring);
        border-radius: 3.40282e38px
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb {
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    @media (hover:hover) {
        :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb: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)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb: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)
    }

    :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb:focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        :is(.field>input[type=range],.input[type=range])::-webkit-slider-thumb:focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-thumb {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-primary);
        background-color: var(--color-white);
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        --tw-ring-color: var(--color-ring);
        border-radius: 3.40282e38px
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=range],.input[type=range])::-moz-range-thumb {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-thumb {
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    @media (hover:hover) {
        :is(.field>input[type=range],.input[type=range])::-moz-range-thumb: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)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-thumb: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)
    }

    :is(.field>input[type=range],.input[type=range])::-moz-range-thumb:focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        :is(.field>input[type=range],.input[type=range])::-moz-range-thumb:focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    :is(.field>input[type=range],.input[type=range])::-ms-thumb {
        width: calc(var(--spacing) * 4);
        height: calc(var(--spacing) * 4);
        border-style: var(--tw-border-style);
        border-width: 1px;
        border-color: var(--color-primary);
        background-color: var(--color-white);
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
        --tw-ring-color: var(--color-ring);
        border-radius: 3.40282e38px
    }

    @supports (color:color-mix(in lab, red, red)) {
        :is(.field>input[type=range],.input[type=range])::-ms-thumb {
            --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-ms-thumb {
        transition-property: color,box-shadow;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    @media (hover:hover) {
        :is(.field>input[type=range],.input[type=range])::-ms-thumb: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)
        }
    }

    :is(.field>input[type=range],.input[type=range])::-ms-thumb: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)
    }

    :is(.field>input[type=range],.input[type=range])::-ms-thumb:focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        :is(.field>input[type=range],.input[type=range])::-ms-thumb:focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }
}

@layer utilities;

:root {
    --radius: .625rem;
    --background: oklch(100% 0 0);
    --foreground: oklch(14.5% 0 0);
    --card: oklch(100% 0 0);
    --card-foreground: oklch(14.5% 0 0);
    --popover: oklch(100% 0 0);
    --popover-foreground: oklch(14.5% 0 0);
    --primary: oklch(20.5% 0 0);
    --primary-foreground: oklch(98.5% 0 0);
    --secondary: oklch(97% 0 0);
    --secondary-foreground: oklch(20.5% 0 0);
    --muted: oklch(97% 0 0);
    --muted-foreground: oklch(55.6% 0 0);
    --accent: oklch(97% 0 0);
    --accent-foreground: oklch(20.5% 0 0);
    --destructive: oklch(57.7% .245 27.325);
    --border: oklch(92.2% 0 0);
    --input: oklch(92.2% 0 0);
    --ring: oklch(70.8% 0 0);
    --chart-1: #93c5fd;
    --chart-2: #3b82f6;
    --chart-3: #2563eb;
    --chart-4: #1d4ed8;
    --chart-5: #1e40af;
    --sidebar: oklch(98.5% 0 0);
    --sidebar-foreground: oklch(14.5% 0 0);
    --sidebar-primary: oklch(20.5% 0 0);
    --sidebar-primary-foreground: oklch(98.5% 0 0);
    --sidebar-accent: oklch(97% 0 0);
    --sidebar-accent-foreground: oklch(20.5% 0 0);
    --sidebar-border: oklch(92.2% 0 0);
    --sidebar-ring: oklch(70.8% 0 0);
    --sidebar-width: 16rem;
    --sidebar-mobile-width: 18rem;
    --scrollbar-track: transparent;
    --scrollbar-thumb: var(--border);
    --scrollbar-width: .625rem;
    --scrollbar-sm-width: .375rem;
    --scrollbar-radius: 9999px;
    --chevron-down-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
    --chevron-down-icon-50: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0 / 0.5)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
    --check-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.556 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-check-icon lucide-check\"><path d=\"M20 6 9 17l-5-5\"/></svg>")
}

.dark {
    --background: oklch(14.5% 0 0);
    --foreground: oklch(98.5% 0 0);
    --card: oklch(20.5% 0 0);
    --card-foreground: oklch(98.5% 0 0);
    --popover: oklch(20.5% 0 0);
    --popover-foreground: oklch(98.5% 0 0);
    --primary: oklch(92.2% 0 0);
    --primary-foreground: oklch(20.5% 0 0);
    --secondary: oklch(26.9% 0 0);
    --secondary-foreground: oklch(98.5% 0 0);
    --muted: oklch(26.9% 0 0);
    --muted-foreground: oklch(70.8% 0 0);
    --accent: oklch(37.1% 0 0);
    --accent-foreground: oklch(98.5% 0 0);
    --destructive: oklch(70.4% .191 22.216);
    --border: oklch(100% 0 0/.1);
    --input: oklch(100% 0 0/.15);
    --ring: oklch(55.6% 0 0);
    --chart-1: #93c5fd;
    --chart-2: #3b82f6;
    --chart-3: #2563eb;
    --chart-4: #1d4ed8;
    --chart-5: #1e40af;
    --sidebar: oklch(20.5% 0 0);
    --sidebar-foreground: oklch(98.5% 0 0);
    --sidebar-primary: oklch(48.8% .243 264.376);
    --sidebar-primary-foreground: oklch(98.5% 0 0);
    --sidebar-accent: oklch(26.9% 0 0);
    --sidebar-accent-foreground: oklch(98.5% 0 0);
    --sidebar-border: oklch(100% 0 0/.1);
    --sidebar-ring: oklch(43.9% 0 0);
    --chevron-down-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
    --chevron-down-icon-50: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0 / 0.5)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down-icon lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>");
    --check-icon: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"oklch(0.708 0 0)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-check-icon lucide-check\"><path d=\"M20 6 9 17l-5-5\"/></svg>");
    color-scheme: dark
}

@keyframes toast-up {
    0% {
        opacity: 0;
        transform: translateY(100%)
    }
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-content {
    syntax: "*";
    inherits: false;
    initial-value: ""
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-leading {
    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-duration {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-ordinal {
    syntax: "*";
    inherits: false
}

@property --tw-slashed-zero {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-figure {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-spacing {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-fraction {
    syntax: "*";
    inherits: false
}

@property --tw-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-tracking {
    syntax: "*";
    inherits: false
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@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
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}