/* Auto-pruned: only rules used by the /docs page (light+dark) */
@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
        *, ::backdrop, ::after, ::before {
            --tw-border-spacing-x: 0;
            --tw-border-spacing-y: 0;
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-duration: initial;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-space-y-reverse: 0;
            --tw-space-x-reverse: 0;
            --tw-divide-x-reverse: 0;
            --tw-border-style: solid;
            --tw-divide-y-reverse: 0;
            --tw-gradient-position: initial;
            --tw-gradient-from: #0000;
            --tw-gradient-via: #0000;
            --tw-gradient-to: #0000;
            --tw-gradient-stops: initial;
            --tw-gradient-via-stops: initial;
            --tw-gradient-from-position: 0%;
            --tw-gradient-via-position: 50%;
            --tw-gradient-to-position: 100%;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-tracking: initial;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-outline-style: solid;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-ease: initial;
            --tw-content: "";
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-scale-z: 1;
            --mask-left-stop: 0%;
            --mask-right-stop: 100%;
            --tw-ordinal: initial;
            --tw-slashed-zero: initial;
            --tw-numeric-figure: initial;
            --tw-numeric-spacing: initial;
            --tw-numeric-fraction: initial;
        }
    }
}

@layer theme {
    :host, :root {
        --spacing: .25rem;
        --container-xs: 20rem;
        --container-md: 28rem;
        --container-lg: 32rem;
        --container-5xl: 64rem;
        --container-7xl: 80rem;
        --text-xs: .75rem;
        --text-xs--line-height: 1.33333;
        --text-sm: .875rem;
        --text-sm--line-height: 1.42857;
        --text-base: 1rem;
        --text-base--line-height: 1.5;
        --text-lg: 1.125rem;
        --text-lg--line-height: 1.55556;
        --text-xl: 1.25rem;
        --text-xl--line-height: 1.4;
        --text-2xl: 1.5rem;
        --text-2xl--line-height: 1.33333;
        --text-4xl: 2.25rem;
        --text-4xl--line-height: 1.11111;
        --font-weight-light: 300;
        --font-weight-normal: 400;
        --font-weight-medium: 500;
        --font-weight-semibold: 600;
        --font-weight-extrabold: 800;
        --tracking-tighter: -.05em;
        --tracking-tight: -.025em;
        --tracking-normal: 0em;
        --tracking-wide: .025em;
        --leading-tight: 1.25;
        --leading-snug: 1.375;
        --leading-normal: 1.5;
        --leading-relaxed: 1.625;
        --ease-out: cubic-bezier(0,0,.2,1);
        --ease-in-out: cubic-bezier(.4,0,.2,1);
        --animate-spin: spin 1s linear infinite;
        --animate-ping: ping 1s cubic-bezier(0,0,.2,1)infinite;
        --animate-pulse: pulse 2s cubic-bezier(.4,0,.6,1)infinite;
        --blur-sm: 8px;
        --blur-md: 12px;
        --blur-lg: 16px;
        --blur-xl: 24px;
        --blur-2xl: 40px;
        --aspect-video: 16/9;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4,0,.2,1);
        --grayscale-1: var(--gray-1);
        --grayscale-2: var(--gray-2);
        --grayscale-3: var(--gray-3);
        --grayscale-4: var(--gray-4);
        --grayscale-5: var(--gray-5);
        --grayscale-6: var(--gray-6);
        --grayscale-9: var(--gray-9);
        --grayscale-10: var(--gray-10);
        --grayscale-11: var(--gray-11);
        --grayscale-12: var(--gray-12);
        --grayscale-a1: var(--gray-a1);
        --grayscale-a2: var(--gray-a2);
        --grayscale-a3: var(--gray-a3);
        --grayscale-a4: var(--gray-a4);
        --grayscale-a5: var(--gray-a5);
        --grayscale-a6: var(--gray-a6);
        --grayscale-a7: var(--gray-a7);
        --grayscale-a8: var(--gray-a8);
        --grayscale-a9: var(--gray-a9);
        --grayscale-a10: var(--gray-a10);
        --grayscale-a11: var(--gray-a11);
        --grayscale-a12: var(--gray-a12);
        --shiki-dark: #fff;
        --spacing-page-padding: var(--page-padding);
        --color-black: #2a2a2a;
        --color-white: #fff;
        --color-zplcloud: #1ba32a;
        --color-zplcloud-air: #fbfffa;
        --color-zplcloud-ground: #081008;
        --ease-collapse: cubic-bezier(.25,.46,.45,.94);
        --ease-shift: cubic-bezier(.16,1,.3,1);
        --ease-slide: cubic-bezier(.87,0,.13,1);
        --animate-slide-down-and-fade: slide-down-and-fade .4s var(--ease-shift);
        --animate-slide-left-and-fade: slide-left-and-fade .4s var(--ease-shift);
        --animate-slide-up-and-fade: slide-up-and-fade .4s var(--ease-shift);
        --animate-slide-right-and-fade: slide-right-and-fade .4s var(--ease-shift);
        --animate-shine: shine 5s ease-in-out infinite;
        --animate-slide-down: slide-down .4s var(--ease-slide);
        --animate-thumb-rock: thumb-rock .5s both;
        --animate-overlay-show: overlay-show .15s var(--ease-shift);
        --animate-dropdown-expand: dropdown-expand .3s var(--ease-shift);
        --radius-3\/2: calc(var(--radius)*1.5);
        --radius-1: var(--radius);
        --radius-3: calc(var(--radius)*3);
        --radius-full: calc(var(--radius)*9999);
        --color-background: var(--background);
        --color-background-a12: var(--color-background);
    }

    @supports (color:lab(0% 0 0)) {
        :host, :root {
            --color-zplcloud: lab(58.6413% -53.3238 48.9768);
            --color-zplcloud-air: lab(99.5904% -2.02343 1.9148);
            --color-zplcloud-ground: lab(3.97522% -3.40538 2.57078);
        }
    }

    @supports (color:color-mix(in lab,red,red)) {
        :host, :root {
            --color-background-a12: color-mix(in oklab,var(--color-background)95%,transparent);
        }
    }

    :host, :root {
        --color-background-a3: var(--color-background);
    }

    @supports (color:color-mix(in lab,red,red)) {
        :host, :root {
            --color-background-a3: color-mix(in oklab,var(--color-background)6.27%,transparent);
        }
    }

    :host, :root {
        --color-border-default: var(--border,var(--grayscale-a5));
        --spacing-page-width: var(--page-width,88rem);
        --spacing-content-width: var(--content-width,40rem);
        --spacing-sidebar-width: var(--sidebar-width,18rem);
        --spacing-header-height-real: var(--header-height-real);
        --spacing-header-height: var(--header-height,var(--spacing-header-height-real));
        --spacing-header-height-padded: calc(var(--spacing-header-height) + var(--spacing)*4);
        --spacing-content-height: calc(100dvh - var(--spacing-header-height));
    }
}

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

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

    :host, html {
        text-size-adjust: 100%;
        font-family: var(--default-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,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);
        tab-size: 4;
        -webkit-tap-highlight-color: transparent;
        line-height: 1.5;
    }

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

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

    code, kbd, pre, samp {
        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;
    }

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

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

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

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

    button, input, optgroup, select, textarea {
        color: inherit;
        font: inherit;
        letter-spacing: inherit;
        opacity: 1;
        background-color: rgba(0, 0, 0, 0);
        border-radius: 0px;
    }

    ::file-selector-button {
        color: inherit;
        font: inherit;
        letter-spacing: inherit;
        opacity: 1;
        background-color: rgba(0, 0, 0, 0);
        border-radius: 0px;
    }

    ::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(currentcolor, transparent);
            }
        }
    }

    ::-webkit-search-decoration {
        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: 0px;
    }

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

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

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

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

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

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

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

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

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

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

    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;
    }

    kbd {
        font-variant-numeric: slashed-zero;
        font-weight: 600;
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
    }

    body, html {
        color: var(--color-black);
        font-family: var(--font-body);
        font-size: var(--text-base);
        line-height: var(--tw-leading,var(--text-base--line-height));
    }

    :is(html, body):is(.dark, .dark *) {
        color: var(--color-white);
    }

    body, html {
        background-color: var(--background,lightdark(#fff,#000));
    }

    .zplcloud-background-image {
        background-position: 50% center;
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
    }

    code, pre {
        font-family: var(--font-code);
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: var(--font-heading);
    }

    :is(h1, h2, h3, h4, h5, h6):first-child {
        margin-top: calc(var(--spacing)*0);
    }

    html {
        box-sizing: border-box;
        -webkit-tap-highlight-color: transparent;
    }

    ::details-content {
        box-sizing: inherit;
    }

    *, ::after, ::before {
        box-sizing: inherit;
        outline-color: rgba(0, 0, 0, 0);
    }

    :is(*):focus-visible {
        outline-color: var(--accent-a5);
    }

    ::selection {
        background-color: var(--accent-a6);
    }

    h1 {
        --tw-leading: var(--leading-tight);
        --tw-font-weight: var(--font-weight-semibold);
        font-size: var(--text-4xl);
        font-weight: var(--font-weight-semibold);
        line-height: var(--tw-leading,var(--text-4xl--line-height));
    }

    h2 {
        --tw-leading: var(--leading-tight);
        --tw-font-weight: var(--font-weight-semibold);
        font-size: var(--text-2xl);
        font-weight: var(--font-weight-semibold);
        line-height: var(--tw-leading,var(--text-2xl--line-height));
    }

    h3 {
        font-size: var(--text-xl);
        line-height: var(--tw-leading,var(--text-xl--line-height));
    }

    h3, h4 {
        --tw-leading: var(--leading-tight);
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
    }

    code:not(.code-block) {
        background-color: var(--card-background,var(--grayscale-surface));
        border-radius: var(--radius);
        font-family: var(--font-code);
        padding-block: calc(var(--spacing)*.5);
        padding-inline: calc(var(--spacing)*1);
        --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
        --tw-ring-color: var(--border,var(--grayscale-a5));
        --tw-ring-inset: inset;
        font-size: 0.875em;
        font-weight: inherit;
    }
}

@layer components {
    .zplcloud-button {
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        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));
    }

    @media (hover: hover) {
        .zplcloud-button:hover {
            transition-property: none;
        }
    }

    .zplcloud-button {
        border-radius: calc(var(--radius)*2);
        font-size: var(--text-sm);
        height: calc(var(--spacing)*10);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        padding-block: calc(var(--spacing)*1);
        padding-inline: calc(var(--spacing)*3);
        justify-content: center;
        align-items: center;
        display: inline-flex;
    }

    @media (min-width: 40rem) {
        .zplcloud-button {
            height: calc(var(--spacing)*8);
        }
    }

    .zplcloud-button {
        cursor: pointer;
    }

        .zplcloud-button svg {
            height: calc(var(--spacing)*4);
            width: calc(var(--spacing)*4);
            flex-shrink: 0;
        }

        .zplcloud-button:not(.square):has(> .zplcloud-button-content > svg:first-child) {
            padding-left: calc(var(--spacing)*2);
        }

        .zplcloud-button:not(.square):has(> .zplcloud-button-content > svg:last-child) {
            padding-right: calc(var(--spacing)*2);
        }

        .zplcloud-button > .zplcloud-button-content {
            align-items: center;
            gap: calc(var(--spacing)*1.5);
            height: calc(var(--spacing)*6);
            display: inline-flex;
        }

            .zplcloud-button > .zplcloud-button-content, .zplcloud-button > .zplcloud-button-content .zplcloud-button-text {
                min-width: calc(var(--spacing)*0);
                flex-shrink: 1;
            }

        .zplcloud-button:not(.multiline) .zplcloud-button-text {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }

        .zplcloud-button:not(.text-left, .text-right) > .zplcloud-button-content {
            text-align: center;
            justify-content: center;
        }

        .zplcloud-button:not([disabled]).minimal {
            color: var(--grayscale-a11);
            background-color: rgba(0, 0, 0, 0);
        }

            .zplcloud-button:not([disabled]).minimal:focus-visible, .zplcloud-button:not([disabled]).minimal:hover {
                color: var(--color-black);
            }

    :is(.zplcloud-button:not([disabled]).minimal:hover, .zplcloud-button:not([disabled]).minimal:focus-visible):is(.dark, .dark *) {
        color: var(--color-white);
    }

    .zplcloud-button:not([disabled]).minimal:focus-visible {
        background-color: var(--grayscale-a3);
        --tw-outline-style: none;
        outline-style: none;
    }

    @media (hover: hover) {
        .zplcloud-button:not([disabled]).minimal:hover {
            background-color: var(--grayscale-a3);
        }
    }

    .zplcloud-button:not([disabled]).filled {
        background-color: var(--grayscale-12);
        color: var(--grayscale-1);
    }

        .zplcloud-button:not([disabled]).filled:focus-visible, .zplcloud-button:not([disabled]).filled:hover, .zplcloud-button:not([disabled]).filled[data-state="checked"], .zplcloud-button:not([disabled]).filled[data-state="on"], .zplcloud-button:not([disabled]).filled[data-state="open"], .zplcloud-button:not([disabled]).filled[data-state="opening"] {
            background-color: var(--grayscale-11);
            color: var(--grayscale-1);
        }

        .zplcloud-button:not([disabled]).filled:focus-visible {
            --tw-outline-style: none;
            outline-style: none;
        }

        .zplcloud-button:not([disabled]).filled.primary {
            background-color: var(--accent);
            color: var(--accent-contrast);
        }

    @media (hover: hover) {
        .zplcloud-button:not([disabled]).filled.primary:hover {
            background-color: var(--accent);
        }
    }

    .zplcloud-button:not([disabled]).filled.primary:focus-visible, .zplcloud-button:not([disabled]).filled.primary:hover, .zplcloud-button:not([disabled]).filled.primary[data-state="checked"], .zplcloud-button:not([disabled]).filled.primary[data-state="on"], .zplcloud-button:not([disabled]).filled.primary[data-state="open"], .zplcloud-button:not([disabled]).filled.primary[data-state="opening"] {
        background-color: var(--accent-a10);
        color: var(--accent-contrast);
    }

    .zplcloud-button-group {
        align-items: center;
        display: inline-flex;
    }

    .zplcloud-copy-button, .zplcloud-expand-button {
        --tw-backdrop-blur: blur(8px);
        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,);
        width: fit-content;
        height: fit-content;
    }

    .zplcloud-card {
        background-color: var(--card-background,var(--grayscale-surface));
        border-color: var(--border,var(--grayscale-a5));
        border-style: var(--tw-border-style);
        color: var(--color-black);
        border-width: 1px;
    }

        .zplcloud-card:is(.dark, .dark *) {
            color: var(--color-white);
        }

    .zplcloud-card {
        --tw-shadow: 0 1px 2px var(--tw-shadow-color,var(--grayscale-a3));
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    }

    @media (hover: hover) {
        .zplcloud-card:hover {
            color: var(--color-black);
        }

            .zplcloud-card:hover:is(.dark, .dark *) {
                color: var(--color-white);
            }

        .zplcloud-card:hover {
            transition-property: none;
        }
    }

    .zplcloud-card:is(.dark, .dark *) {
        box-shadow: 0 2px 4px var(--grayscale-a3);
    }

    @media (hover: hover) {
        .zplcloud-card.interactive:hover {
            --tw-shadow: 0 1px 2px var(--tw-shadow-color,var(--grayscale-a3)),0 3px 6px var(--tw-shadow-color,var(--grayscale-a3));
            border-color: var(--accent-a9);
            box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
        }
    }

    .zplcloud-numeric-input-group:focus-within .zplcloud-numeric-input-step:not(:disabled) {
        border-color: var(--accent-a5);
        color: var(--accent-a11);
        --tw-ring-color: var(--accent);
    }

    @media (hover: hover) {
        .zplcloud-numeric-input-group:focus-within .zplcloud-numeric-input-step:not(:disabled):hover {
            background-color: var(--accent-a3);
            color: var(--accent-a11);
        }
    }

    .zplcloud-scroll-area {
        z-index: 0;
        overflow: hidden;
    }

    .zplcloud-scroll-area, .zplcloud-scroll-area-viewport {
        flex-direction: column;
        width: 100%;
        height: 100%;
        display: flex;
    }

    .zplcloud-scroll-area-viewport {
        border-radius: inherit;
        min-height: calc(var(--spacing)*0);
        flex-shrink: 1;
    }

        .zplcloud-scroll-area-viewport > div {
            flex-grow: 1;
            display: block !important;
        }

        .zplcloud-scroll-area-viewport[data-scrollbars="vertical"] > div {
            max-width: 100%;
        }

    @keyframes zplcloud-scroll-area-scrollbar-fade-in {
        0% {
            opacity: 0;
        }
    }

    @keyframes zplcloud-scroll-area-scrollbar-fade-out {
        100% {
            opacity: 0;
        }
    }

    .zplcloud-breadcrumb {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
        flex-wrap: wrap;
        align-items: baseline;
        max-width: 100%;
        height: fit-content;
        display: inline-flex;
    }

        .zplcloud-breadcrumb .zplcloud-breadcrumb-item {
            color: var(--accent-a11);
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            min-width: calc(var(--spacing)*0);
            flex-shrink: 1;
        }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined)[data-state="open"]:not(:disabled) {
        background-color: var(--grayscale-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).accent.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a4,var(--grayscale-a4));
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gray.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gray[data-state="open"]:not(:disabled) {
        background-color: var(--gray-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gray-hover-accent.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gray-hover-accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a9);
        color: var(--accent-contrast);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).mauve.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).mauve[data-state="open"]:not(:disabled) {
        background-color: var(--mauve-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).slate.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).slate[data-state="open"]:not(:disabled) {
        background-color: var(--slate-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sage.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sage[data-state="open"]:not(:disabled) {
        background-color: var(--sage-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).olive.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).olive[data-state="open"]:not(:disabled) {
        background-color: var(--olive-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sand.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sand[data-state="open"]:not(:disabled) {
        background-color: var(--sand-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).tomato.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).tomato[data-state="open"]:not(:disabled) {
        background-color: var(--tomato-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).red.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).red[data-state="open"]:not(:disabled) {
        background-color: var(--red-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).ruby.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).ruby[data-state="open"]:not(:disabled) {
        background-color: var(--ruby-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).crimson.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).crimson[data-state="open"]:not(:disabled) {
        background-color: var(--crimson-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).pink.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).pink[data-state="open"]:not(:disabled) {
        background-color: var(--pink-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).plum.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).plum[data-state="open"]:not(:disabled) {
        background-color: var(--plum-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).purple.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).purple[data-state="open"]:not(:disabled) {
        background-color: var(--purple-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).violet.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).violet[data-state="open"]:not(:disabled) {
        background-color: var(--violet-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).iris.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).iris[data-state="open"]:not(:disabled) {
        background-color: var(--iris-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).indigo.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).indigo[data-state="open"]:not(:disabled) {
        background-color: var(--indigo-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).blue.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).blue[data-state="open"]:not(:disabled) {
        background-color: var(--blue-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).cyan.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).cyan[data-state="open"]:not(:disabled) {
        background-color: var(--cyan-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).teal.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).teal[data-state="open"]:not(:disabled) {
        background-color: var(--teal-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).jade.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).jade[data-state="open"]:not(:disabled) {
        background-color: var(--jade-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).green.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).green[data-state="open"]:not(:disabled) {
        background-color: var(--green-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).grass.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).grass[data-state="open"]:not(:disabled) {
        background-color: var(--grass-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).bronze.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).bronze[data-state="open"]:not(:disabled) {
        background-color: var(--bronze-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gold.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).gold[data-state="open"]:not(:disabled) {
        background-color: var(--gold-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).brown.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).brown[data-state="open"]:not(:disabled) {
        background-color: var(--brown-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).orange.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).orange[data-state="open"]:not(:disabled) {
        background-color: var(--orange-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).amber.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).amber[data-state="open"]:not(:disabled) {
        background-color: var(--amber-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).yellow.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).yellow[data-state="open"]:not(:disabled) {
        background-color: var(--yellow-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).lime.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).lime[data-state="open"]:not(:disabled) {
        background-color: var(--lime-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).mint.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).mint[data-state="open"]:not(:disabled) {
        background-color: var(--mint-a4);
    }

    :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sky.interactive:not(:disabled):hover, :is(.zplcloud-docs-badge.subtle, .zplcloud-docs-badge.outlined).sky[data-state="open"]:not(:disabled) {
        background-color: var(--sky-a4);
    }

    .zplcloud-docs-badge.subtle-solid-hover.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover[data-state="open"]:not(:disabled) {
        background-color: var(--grayscale-a10);
        color: var(--accent-contrast);
    }

    .zplcloud-docs-badge.subtle-solid-hover.accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a9,var(--grayscale-a10));
        color: var(--accent-contrast);
    }

    .zplcloud-docs-badge.subtle-solid-hover.gray.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.gray[data-state="open"]:not(:disabled) {
        background-color: var(--gray-a9);
        color: var(--gray-a1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.gray-hover-accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.gray-hover-accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a10);
        color: var(--accent-contrast);
    }

    .zplcloud-docs-badge.subtle-solid-hover.mauve.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.mauve[data-state="open"]:not(:disabled) {
        background-color: var(--mauve-10);
        color: var(--mauve-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.slate.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.slate[data-state="open"]:not(:disabled) {
        background-color: var(--slate-10);
        color: var(--slate-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.sage.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.sage[data-state="open"]:not(:disabled) {
        background-color: var(--sage-10);
        color: var(--sage-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.olive.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.olive[data-state="open"]:not(:disabled) {
        background-color: var(--olive-10);
        color: var(--olive-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.sand.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.sand[data-state="open"]:not(:disabled) {
        background-color: var(--sand-10);
        color: var(--sand-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.tomato.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.tomato[data-state="open"]:not(:disabled) {
        background-color: var(--tomato-10);
        color: var(--tomato-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.red.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.red[data-state="open"]:not(:disabled) {
        background-color: var(--red-10);
        color: var(--red-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.ruby.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.ruby[data-state="open"]:not(:disabled) {
        background-color: var(--ruby-10);
        color: var(--ruby-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.crimson.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.crimson[data-state="open"]:not(:disabled) {
        background-color: var(--crimson-10);
        color: var(--crimson-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.pink.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.pink[data-state="open"]:not(:disabled) {
        background-color: var(--pink-10);
        color: var(--pink-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.plum.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.plum[data-state="open"]:not(:disabled) {
        background-color: var(--plum-10);
        color: var(--plum-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.purple.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.purple[data-state="open"]:not(:disabled) {
        background-color: var(--purple-10);
        color: var(--purple-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.violet.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.violet[data-state="open"]:not(:disabled) {
        background-color: var(--violet-10);
        color: var(--violet-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.iris.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.iris[data-state="open"]:not(:disabled) {
        background-color: var(--iris-10);
        color: var(--iris-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.indigo.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.indigo[data-state="open"]:not(:disabled) {
        background-color: var(--indigo-10);
        color: var(--indigo-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.blue.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.blue[data-state="open"]:not(:disabled) {
        background-color: var(--blue-10);
        color: var(--blue-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.cyan.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.cyan[data-state="open"]:not(:disabled) {
        background-color: var(--cyan-10);
        color: var(--cyan-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.teal.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.teal[data-state="open"]:not(:disabled) {
        background-color: var(--teal-10);
        color: var(--teal-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.jade.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.jade[data-state="open"]:not(:disabled) {
        background-color: var(--jade-10);
        color: var(--jade-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.green.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.green[data-state="open"]:not(:disabled) {
        background-color: var(--green-10);
        color: var(--green-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.grass.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.grass[data-state="open"]:not(:disabled) {
        background-color: var(--grass-10);
        color: var(--grass-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.bronze.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.bronze[data-state="open"]:not(:disabled) {
        background-color: var(--bronze-10);
        color: var(--bronze-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.gold.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.gold[data-state="open"]:not(:disabled) {
        background-color: var(--gold-9);
        color: var(--gold-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.brown.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.brown[data-state="open"]:not(:disabled) {
        background-color: var(--brown-9);
        color: var(--brown-1);
    }

    .zplcloud-docs-badge.subtle-solid-hover.orange.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.orange[data-state="open"]:not(:disabled) {
        background-color: var(--orange-10);
        color: var(--orange-12);
    }

    .zplcloud-docs-badge.subtle-solid-hover.amber.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.amber[data-state="open"]:not(:disabled) {
        background-color: var(--amber-10);
        color: var(--amber-12);
    }

    .zplcloud-docs-badge.subtle-solid-hover.yellow.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.yellow[data-state="open"]:not(:disabled) {
        background-color: var(--yellow-10);
        color: var(--yellow-12);
    }

    .zplcloud-docs-badge.subtle-solid-hover.lime.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.lime[data-state="open"]:not(:disabled) {
        background-color: var(--lime-10);
        color: var(--lime-12);
    }

    .zplcloud-docs-badge.subtle-solid-hover.mint.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.mint[data-state="open"]:not(:disabled) {
        background-color: var(--mint-10);
        color: var(--mint-12);
    }

    .zplcloud-docs-badge.subtle-solid-hover.sky.interactive:not(:disabled):hover, .zplcloud-docs-badge.subtle-solid-hover.sky[data-state="open"]:not(:disabled) {
        background-color: var(--sky-10);
        color: var(--sky-12);
    }

    .zplcloud-docs-badge.outlined-subtle.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle[data-state="open"]:not(:disabled) {
        background-color: var(--grayscale-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a2,var(--grayscale-a2));
    }

    .zplcloud-docs-badge.outlined-subtle.gray.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.gray[data-state="open"]:not(:disabled) {
        background-color: var(--gray-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.gray-hover-accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.gray-hover-accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-a9);
        color: var(--accent-contrast);
    }

    .zplcloud-docs-badge.outlined-subtle.mauve.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.mauve[data-state="open"]:not(:disabled) {
        background-color: var(--mauve-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.slate.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.slate[data-state="open"]:not(:disabled) {
        background-color: var(--slate-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.sage.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.sage[data-state="open"]:not(:disabled) {
        background-color: var(--sage-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.olive.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.olive[data-state="open"]:not(:disabled) {
        background-color: var(--olive-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.sand.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.sand[data-state="open"]:not(:disabled) {
        background-color: var(--sand-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.tomato.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.tomato[data-state="open"]:not(:disabled) {
        background-color: var(--tomato-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.red.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.red[data-state="open"]:not(:disabled) {
        background-color: var(--red-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.ruby.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.ruby[data-state="open"]:not(:disabled) {
        background-color: var(--ruby-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.crimson.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.crimson[data-state="open"]:not(:disabled) {
        background-color: var(--crimson-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.pink.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.pink[data-state="open"]:not(:disabled) {
        background-color: var(--pink-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.plum.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.plum[data-state="open"]:not(:disabled) {
        background-color: var(--plum-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.purple.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.purple[data-state="open"]:not(:disabled) {
        background-color: var(--purple-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.violet.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.violet[data-state="open"]:not(:disabled) {
        background-color: var(--violet-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.iris.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.iris[data-state="open"]:not(:disabled) {
        background-color: var(--iris-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.indigo.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.indigo[data-state="open"]:not(:disabled) {
        background-color: var(--indigo-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.blue.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.blue[data-state="open"]:not(:disabled) {
        background-color: var(--blue-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.cyan.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.cyan[data-state="open"]:not(:disabled) {
        background-color: var(--cyan-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.teal.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.teal[data-state="open"]:not(:disabled) {
        background-color: var(--teal-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.jade.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.jade[data-state="open"]:not(:disabled) {
        background-color: var(--jade-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.green.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.green[data-state="open"]:not(:disabled) {
        background-color: var(--green-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.grass.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.grass[data-state="open"]:not(:disabled) {
        background-color: var(--grass-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.bronze.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.bronze[data-state="open"]:not(:disabled) {
        background-color: var(--bronze-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.gold.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.gold[data-state="open"]:not(:disabled) {
        background-color: var(--gold-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.brown.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.brown[data-state="open"]:not(:disabled) {
        background-color: var(--brown-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.orange.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.orange[data-state="open"]:not(:disabled) {
        background-color: var(--orange-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.amber.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.amber[data-state="open"]:not(:disabled) {
        background-color: var(--amber-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.yellow.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.yellow[data-state="open"]:not(:disabled) {
        background-color: var(--yellow-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.lime.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.lime[data-state="open"]:not(:disabled) {
        background-color: var(--lime-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.mint.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.mint[data-state="open"]:not(:disabled) {
        background-color: var(--mint-a2);
    }

    .zplcloud-docs-badge.outlined-subtle.sky.interactive:not(:disabled):hover, .zplcloud-docs-badge.outlined-subtle.sky[data-state="open"]:not(:disabled) {
        background-color: var(--sky-a2);
    }

    .zplcloud-docs-badge.solid.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid[data-state="open"]:not(:disabled) {
        background-color: var(--grayscale-10);
    }

    .zplcloud-docs-badge.solid.accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-10,var(--gray-10));
    }

    .zplcloud-docs-badge.solid.gray.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.gray[data-state="open"]:not(:disabled) {
        background-color: var(--gray-10);
    }

    .zplcloud-docs-badge.solid.gray-hover-accent.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.gray-hover-accent[data-state="open"]:not(:disabled) {
        background-color: var(--accent-10);
    }

    .zplcloud-docs-badge.solid.mauve.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.mauve[data-state="open"]:not(:disabled) {
        background-color: var(--mauve-10);
    }

    .zplcloud-docs-badge.solid.slate.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.slate[data-state="open"]:not(:disabled) {
        background-color: var(--slate-10);
    }

    .zplcloud-docs-badge.solid.sage.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.sage[data-state="open"]:not(:disabled) {
        background-color: var(--sage-10);
    }

    .zplcloud-docs-badge.solid.olive.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.olive[data-state="open"]:not(:disabled) {
        background-color: var(--olive-10);
    }

    .zplcloud-docs-badge.solid.sand.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.sand[data-state="open"]:not(:disabled) {
        background-color: var(--sand-10);
    }

    .zplcloud-docs-badge.solid.tomato.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.tomato[data-state="open"]:not(:disabled) {
        background-color: var(--tomato-10);
    }

    .zplcloud-docs-badge.solid.red.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.red[data-state="open"]:not(:disabled) {
        background-color: var(--red-10);
    }

    .zplcloud-docs-badge.solid.ruby.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.ruby[data-state="open"]:not(:disabled) {
        background-color: var(--ruby-10);
    }

    .zplcloud-docs-badge.solid.crimson.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.crimson[data-state="open"]:not(:disabled) {
        background-color: var(--crimson-10);
    }

    .zplcloud-docs-badge.solid.pink.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.pink[data-state="open"]:not(:disabled) {
        background-color: var(--pink-10);
    }

    .zplcloud-docs-badge.solid.plum.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.plum[data-state="open"]:not(:disabled) {
        background-color: var(--plum-10);
    }

    .zplcloud-docs-badge.solid.purple.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.purple[data-state="open"]:not(:disabled) {
        background-color: var(--purple-10);
    }

    .zplcloud-docs-badge.solid.violet.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.violet[data-state="open"]:not(:disabled) {
        background-color: var(--violet-10);
    }

    .zplcloud-docs-badge.solid.iris.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.iris[data-state="open"]:not(:disabled) {
        background-color: var(--iris-10);
    }

    .zplcloud-docs-badge.solid.indigo.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.indigo[data-state="open"]:not(:disabled) {
        background-color: var(--indigo-10);
    }

    .zplcloud-docs-badge.solid.blue.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.blue[data-state="open"]:not(:disabled) {
        background-color: var(--blue-10);
    }

    .zplcloud-docs-badge.solid.cyan.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.cyan[data-state="open"]:not(:disabled) {
        background-color: var(--cyan-10);
    }

    .zplcloud-docs-badge.solid.teal.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.teal[data-state="open"]:not(:disabled) {
        background-color: var(--teal-10);
    }

    .zplcloud-docs-badge.solid.jade.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.jade[data-state="open"]:not(:disabled) {
        background-color: var(--jade-10);
    }

    .zplcloud-docs-badge.solid.green.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.green[data-state="open"]:not(:disabled) {
        background-color: var(--green-10);
    }

    .zplcloud-docs-badge.solid.grass.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.grass[data-state="open"]:not(:disabled) {
        background-color: var(--grass-10);
    }

    .zplcloud-docs-badge.solid.bronze.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.bronze[data-state="open"]:not(:disabled) {
        background-color: var(--bronze-10);
    }

    .zplcloud-docs-badge.solid.gold.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.gold[data-state="open"]:not(:disabled) {
        background-color: var(--gold-10);
    }

    .zplcloud-docs-badge.solid.brown.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.brown[data-state="open"]:not(:disabled) {
        background-color: var(--brown-10);
    }

    .zplcloud-docs-badge.solid.orange.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.orange[data-state="open"]:not(:disabled) {
        background-color: var(--orange-10);
    }

    .zplcloud-docs-badge.solid.amber.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.amber[data-state="open"]:not(:disabled) {
        background-color: var(--amber-10);
    }

    .zplcloud-docs-badge.solid.yellow.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.yellow[data-state="open"]:not(:disabled) {
        background-color: var(--yellow-10);
    }

    .zplcloud-docs-badge.solid.lime.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.lime[data-state="open"]:not(:disabled) {
        background-color: var(--lime-10);
    }

    .zplcloud-docs-badge.solid.mint.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.mint[data-state="open"]:not(:disabled) {
        background-color: var(--mint-10);
    }

    .zplcloud-docs-badge.solid.sky.interactive:not(:disabled):hover, .zplcloud-docs-badge.solid.sky[data-state="open"]:not(:disabled) {
        background-color: var(--sky-10);
    }

    .zplcloud-docs-badge.interactive:not(:disabled):hover, .zplcloud-docs-badge[data-state="open"]:not(:disabled) {
        transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
    }

    .zplcloud-kbd {
        background-color: var(--grayscale-surface);
        border-color: var(--grayscale-a6);
        border-radius: calc(var(--radius)*1.5);
        border-style: var(--tw-border-style);
        color: var(--grayscale-a12);
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
        padding-block: calc(var(--spacing)*.5);
        padding-inline: calc(var(--spacing)*1.5);
        border-width: 1px;
    }

    .zplcloud-accordion-trigger {
        border-radius: inherit;
        cursor: pointer;
        align-items: center;
        gap: calc(var(--spacing)*3);
        padding: calc(var(--spacing)*4);
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        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));
        display: flex;
    }

    @media (hover: hover) {
        .zplcloud-accordion-trigger:hover {
            background-color: var(--grayscale-a2);
            transition-property: none;
        }
    }

    .zplcloud-accordion-trigger[data-state="open"] {
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 0px;
    }

    .zplcloud-accordion-trigger {
        list-style-type: none;
        overflow: auto;
    }

        .zplcloud-accordion-trigger::-webkit-details-marker {
            display: none;
        }

        .zplcloud-accordion-trigger .zplcloud-accordion-trigger-arrow {
            color: var(--grayscale-a11);
            height: calc(var(--spacing)*4);
            transition-property: transform, translate, scale, rotate;
            width: calc(var(--spacing)*4);
            --tw-duration: .4s;
            --tw-ease: var(--ease-shift);
            transition-duration: 0.4s;
            transition-timing-function: var(--ease-shift);
            flex-shrink: 0;
        }

        .zplcloud-accordion-trigger[data-state="open"] .zplcloud-accordion-trigger-arrow {
            rotate: 90deg;
        }

    .code-block-root {
        counter-reset: code-block-line 0;
        flex-direction: column;
        width: 100%;
        display: flex;
        overflow: hidden;
        background-color: unset !important;
    }

        .code-block-root > .zplcloud-scroll-area {
            min-height: calc(var(--spacing)*0);
            flex-shrink: 1;
        }

    .code-block, .code-block.text-base, .code-block.text-sm, .code-block.text-xs {
        font-family: var(--font-code);
        --tw-leading: var(--leading-relaxed);
        line-height: var(--leading-relaxed);
    }

    .code-block-inner {
        padding-block: calc(var(--spacing)*3);
    }

    .code-block-line-group {
        --tw-border-spacing-x: calc(var(--spacing)*0);
        --tw-border-spacing-y: calc(var(--spacing)*0);
        border-spacing: var(--tw-border-spacing-x)var(--tw-border-spacing-y);
        min-width: 100%;
    }

    .code-block-line-gutter {
        padding: calc(var(--spacing)*0);
        user-select: none;
        vertical-align: top;
        width: calc(var(--spacing)*0);
    }

        .code-block-line-gutter > span {
            color: var(--grayscale-a9,var(--gray-a9));
            padding-left: calc(var(--spacing)*3);
        }

    .code-block-line-content {
        padding-block: calc(var(--spacing)*0);
        padding-inline: calc(var(--spacing)*3);
    }

        .code-block-line-content .line {
            vertical-align: top;
            display: inline-block;
        }

    .dark .code-block-line-content span {
        color: var(--shiki-dark) !important;
        font-style: var(--shiki-dark-font-style) !important;
        font-weight: var(--shiki-dark-font-weight) !important;
        text-decoration: var(--shiki-dark-text-decoration) !important;
    }

    .zplcloud-header-logo-container {
        gap: calc(var(--spacing)*2);
        min-width: fit-content;
        height: 100%;
        padding-block: calc(var(--spacing)*1);
        flex: 1 0 0%;
        display: flex;
        position: relative;
    }

    .zplcloud-header-tabs {
        user-select: none;
        max-width: 100%;
        display: none;
    }

    @media (min-width: 64rem) {
        .zplcloud-header-tabs {
            justify-content: space-between;
            align-items: center;
            display: flex;
        }
    }

    .zplcloud-header-selectors {
        align-items: baseline;
        display: none;
    }

    @media (min-width: 64rem) {
        .zplcloud-header-selectors {
            display: flex;
        }
    }

    .zplcloud-sidebar-desktop {
        display: none;
    }

    @media (min-width: 64rem) {
        .zplcloud-sidebar-desktop {
            display: block;
        }
    }

    .zplcloud-header-navbar-links {
        flex: 1 1 0%;
        display: none;
    }

    @media (min-width: 64rem) {
        .zplcloud-header-navbar-links {
            justify-content: flex-end;
            align-items: center;
            display: flex;
        }
    }

    .zplcloud-header-mobile-menu-button {
        flex: 1 1 0%;
        justify-content: flex-end;
        align-items: center;
        display: flex;
    }

    .zplcloud-header-search-bar {
        max-width: var(--content-width,40rem);
        min-width: calc(var(--spacing)*0);
        flex-shrink: 1;
        width: 100%;
        display: none;
    }

    @media (min-width: 64rem) {
        .zplcloud-header-search-bar {
            display: inline-flex;
        }
    }

    :where(a, button, [role="tab"], [role="button"], [tabindex="0"]):focus-visible {
        outline: 2px solid var(--accent-9,Highlight);
        outline-offset: 2px;
        border-radius: 4px;
    }

    [data-theme="default"]#zplcloud-header {
        background-color: var(--header-background);
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px;
        border-color: var(--border,var(--grayscale-a3));
        inset-inline: calc(var(--spacing)*0);
        pointer-events: auto;
        top: calc(var(--spacing)*0);
        z-index: 30;
        --tw-backdrop-blur: blur(var(--blur-lg));
        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,);
        position: fixed;
    }

        [data-theme="default"]#zplcloud-header .zplcloud-header-content {
            height: var(--mobile-header-height-real);
            padding-inline: var(--page-padding);
            align-items: center;
            display: flex;
        }

    @media (min-width: 48rem) {
        [data-theme="default"]#zplcloud-header .zplcloud-header-content {
            height: var(--header-height-real);
        }
    }

    [data-theme="default"]#zplcloud-header .zplcloud-header-tabs {
        padding-inline: var(--page-padding);
        width: calc(var(--spacing-page-width) + var(--spacing-page-padding)*2);
        margin-inline: auto;
    }

    [data-theme="default"]#zplcloud-header [role="tablist"] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
        margin-inline: calc(var(--spacing)*-3);
        vertical-align: bottom;
        display: flex;
    }

    [data-theme="default"]#zplcloud-header [data-radix-collection-item] {
        height: calc(var(--spacing)*11);
        min-width: calc(var(--spacing)*0);
        justify-content: flex-start;
        align-items: center;
        display: flex;
        position: relative;
    }

    :where([data-theme="default"]#zplcloud-header [data-radix-collection-item] > :not(:last-child)) {
        --tw-space-x-reverse: 0;
        margin-inline-start: calc(var(--spacing)*2*var(--tw-space-x-reverse));
        margin-inline-end: calc(var(--spacing)*2*(1 - var(--tw-space-x-reverse)));
    }

    [data-theme="default"]#zplcloud-header [data-radix-collection-item] {
        padding-inline: calc(var(--spacing)*3);
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
    }

        [data-theme="default"]#zplcloud-header [data-radix-collection-item]::after {
            background-color: var(--accent-indicator);
            height: calc(var(--spacing)*.5);
            inset-inline: calc(var(--spacing)*3);
            opacity: 0;
            --tw-content: "";
            content: var(--tw-content);
            position: absolute;
            bottom: -1px;
        }

        [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="active"] {
            color: var(--accent-11);
        }

            [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="active"] > span {
                -webkit-text-stroke: 0.5px currentcolor;
            }

            [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="active"]::after {
                opacity: 1;
            }

            [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="active"]:focus-visible {
                background-color: var(--accent-a3);
                --tw-outline-style: none;
                outline-style: none;
            }

        [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"] {
            color: var(--grayscale-a11);
        }

            [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"]:focus-visible, [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"]:hover {
                color: var(--color-black);
            }

    :is([data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"]:hover, [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"]:focus-visible):is(.dark, .dark *) {
        color: var(--color-white);
    }

    [data-theme="default"]#zplcloud-header [data-radix-collection-item][data-state="inactive"]:focus-visible {
        --tw-outline-style: none;
        outline-style: none;
    }

    [data-theme="default"]#zplcloud-header [data-radix-collection-item] svg {
        height: calc(var(--spacing)*3.5);
        width: calc(var(--spacing)*3.5);
    }

    [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"] {
        pointer-events: auto;
        top: var(--header-height);
        z-index: 30;
        display: none;
    }

    @media (min-width: 64rem) {
        [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"] {
            --tw-translate-x: calc(var(--spacing)*0);
            translate: var(--tw-translate-x)var(--tw-translate-y);
            flex-direction: column;
            flex-shrink: 0;
            display: flex;
        }
    }

    [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"] {
        padding-left: var(--aside-offset);
        width: var(--sticky-aside-width);
    }

        [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"][data-state="fixed"], [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"][data-state="sticky"] {
            border-color: var(--border,var(--grayscale-a3));
            border-right-style: var(--tw-border-style);
            --tw-backdrop-blur: blur(var(--blur-xl));
            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,);
            border-right-width: 1px;
            overflow-y: auto;
        }

        [data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"][data-state="sticky"] {
            background-color: var(--sidebar-background);
            height: calc(100dvh - var(--header-height) - var(--custom-footer-visible-height,0px));
            flex-shrink: 0;
            align-self: flex-start;
            position: sticky;
        }

    [data-theme="default"] #zplcloud-sidebar-scroll-area {
        padding-block: calc(var(--spacing)*6);
        padding-inline: calc(var(--spacing)*4);
        padding-bottom: calc(var(--spacing)*12);
    }

    @media (min-width: 64rem) {
        [data-theme="default"] #zplcloud-sidebar-scroll-area {
            padding-left: calc(var(--spacing)*5);
        }
    }

    .zplcloud-sidebar-heading {
        margin-bottom: calc(var(--spacing)*1);
        min-height: 32px;
        display: flex;
    }

    @media (min-width: 64rem) {
        .zplcloud-sidebar-heading {
            min-height: 36px;
        }
    }

    .zplcloud-sidebar-heading {
        padding-inline: calc(var(--spacing)*4);
        align-items: center;
        display: inline-flex;
    }

    @media (min-width: 64rem) {
        .zplcloud-sidebar-heading {
            padding-inline: calc(var(--spacing)*2);
        }
    }

    .zplcloud-sidebar-heading .zplcloud-sidebar-heading-content {
        font-size: var(--text-base);
        margin: calc(var(--spacing)*0);
        --tw-leading: calc(var(--spacing)*6);
        line-height: calc(var(--spacing)*6);
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
    }

    @media (min-width: 64rem) {
        .zplcloud-sidebar-heading .zplcloud-sidebar-heading-content {
            font-size: var(--text-sm);
            --tw-leading: calc(var(--spacing)*5);
            line-height: calc(var(--spacing)*5);
        }
    }

    .zplcloud-sidebar-link {
        font-size: var(--text-base);
        align-items: center;
        gap: calc(var(--spacing)*3);
        padding-block: calc(var(--spacing)*2);
        padding-inline: calc(var(--spacing)*4);
        text-align: left;
        --tw-leading: var(--leading-tight);
        width: 100%;
        color: var(--grayscale-a12);
        line-height: var(--leading-tight);
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        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));
        display: flex;
    }

    @media (min-width: 64rem) {
        .zplcloud-sidebar-link {
            border-radius: calc(var(--radius)*2);
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
            padding: calc(var(--spacing)*2);
        }
    }

    @media (hover: hover) {
        .zplcloud-sidebar-link:hover {
            background-color: var(--grayscale-a3);
            color: var(--grayscale-a12);
            transition-property: none;
        }
    }

    .zplcloud-sidebar-link svg {
        color: var(--grayscale-a9);
        height: calc(var(--spacing)*4);
        width: calc(var(--spacing)*4);
        flex-shrink: 0;
    }

    .zplcloud-sidebar-link .expand-indicator[data-state="active"], .zplcloud-sidebar-link[data-state="active"] {
        background-color: var(--accent-a3);
        color: var(--accent-a11);
    }

        .zplcloud-sidebar-link[data-state="active"] svg {
            color: var(--accent-a9);
        }

        .zplcloud-sidebar-link[data-state="active"] .zplcloud-sidebar-link-title-inner {
            -webkit-text-stroke: 0.5px currentcolor;
        }

    .zplcloud-sidebar-link-title {
        text-overflow: ellipsis;
        white-space: nowrap;
        min-width: 0px;
        overflow: hidden;
    }

    .zplcloud-sidebar-link-title-inner {
        will-change: transform;
        display: inline;
        transform: translate(0px);
    }

    @keyframes zplcloud-sidebar-marquee {
        100% {
            transform: translateX(var(--marquee-translate,0));
        }
    }

    .zplcloud-sidebar-group {
        list-style-type: none;
    }

    :where(.zplcloud-sidebar-group > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(1px*var(--tw-space-y-reverse));
        margin-block-end: calc(1px*(1 - var(--tw-space-y-reverse)));
    }

    @media not all and (min-width: 64rem) {
        .zplcloud-sidebar-group {
            margin-inline: calc(var(--spacing)*-4);
        }

            .zplcloud-sidebar-group .zplcloud-sidebar-group {
                margin-inline: calc(var(--spacing)*0);
            }
    }

    .zplcloud-layout-guide {
        margin-inline: auto;
        margin-bottom: calc(var(--spacing)*12);
        min-width: calc(var(--spacing)*0);
        flex-shrink: 1;
    }

    :where(.zplcloud-layout-guide > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*8*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*8*(1 - var(--tw-space-y-reverse)));
    }

    .zplcloud-layout-guide {
        padding-inline: var(--page-padding);
    }

    .zplcloud-layout-changelog-entry, .zplcloud-layout-guide {
        min-height: calc(100vh - var(--header-height));
        flex-direction: column;
        display: flex;
    }

    .zplcloud-layout-footer {
        margin-block: calc(var(--spacing)*16);
        max-width: 100%;
        width: var(--content-width,40rem);
        margin-inline: auto;
    }

    :where(.zplcloud-layout-footer > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*8*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*8*(1 - var(--tw-space-y-reverse)));
    }

    .zplcloud-layout-footer .zplcloud-layout-footer-toolbar {
        column-gap:;
        row-gap: calc(var(--spacing)*8);
        display: flex;
    }

    @media not all and (min-width: 40rem) {
        .zplcloud-layout-footer .zplcloud-layout-footer-toolbar {
            flex-direction: column;
        }
    }

    @media (min-width: 40rem) {
        .zplcloud-layout-footer .zplcloud-layout-footer-toolbar {
            justify-content: space-between;
        }
    }

    @keyframes loading-dots {
        0% {
            content: ".";
        }

        33% {
            content: "..";
        }

        66% {
            content: "...";
        }
    }

    [data-rmiz-btn-zoom]:not(:focus, :active) {
        clip: rect(0px, 0px, 0px, 0px);
        clip-path: inset(50%);
        pointer-events: none;
        white-space: nowrap;
        width: 1px;
        height: 1px;
        position: absolute;
        overflow: hidden;
    }

    .zplcloud-mdx-link {
        color: var(--accent-a11);
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
        text-underline-offset: calc(var(--spacing)*1);
        text-decoration-line: underline;
        text-decoration-color: currentcolor;
        text-decoration-thickness: 1px !important;
    }

        .zplcloud-mdx-link svg.external-link-icon {
            color: currentcolor;
            height: calc(var(--spacing)*3.5);
            margin-left: calc(var(--spacing)*.5);
            opacity: 0.7;
            width: calc(var(--spacing)*3.5);
            display: inline-block;
            overflow: visible;
        }

            .zplcloud-mdx-link svg.external-link-icon path:first-child, .zplcloud-mdx-link svg.external-link-icon path:nth-child(2) {
                transition: transform 0.2s;
            }

        .zplcloud-mdx-link:hover {
            text-decoration-thickness: 2px !important;
        }

            .zplcloud-mdx-link:hover svg.external-link-icon path:first-child, .zplcloud-mdx-link:hover svg.external-link-icon path:nth-child(2) {
                transform: translate(2px, -2px);
            }

    .zplcloud-page-heading {
        margin-block: calc(var(--spacing)*0);
        --tw-leading: var(--leading-tight);
        line-height: var(--leading-tight);
        text-wrap: balance;
        overflow-wrap: break-word;
        display: inline-block;
    }

    a.zplcloud-anchor {
        border-radius: calc(var(--radius)*1.5);
        border-style: var(--tw-border-style);
        border-width: 0px;
        position: relative;
    }

    .zplcloud-anchor-icon, a.zplcloud-anchor {
        height: calc(var(--spacing)*6);
        width: calc(var(--spacing)*6);
        align-items: center;
        display: flex;
    }

    .zplcloud-anchor-icon {
        border-radius: calc(var(--radius)*1.5);
        left: calc(var(--spacing)*0);
        justify-content: center;
        position: absolute;
    }

        .zplcloud-anchor-icon:not(.copied) {
            background-color: var(--card-background,var(--grayscale-surface));
            border-color: var(--card-border,var(--color-border-default));
            border-style: var(--tw-border-style);
            color: var(--grayscale-a11);
            border-width: 1px;
        }

        .zplcloud-anchor-icon.copied, .zplcloud-anchor-icon:not(.copied) {
            --tw-backdrop-blur: blur(8px);
            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,);
        }

    .zplcloud-page-actions.zplcloud-toolbar {
        gap: calc(var(--spacing)*0);
    }

    .zplcloud-footer-nav {
        background-color: var(--grayscale-a3);
        border-radius: calc(var(--radius)*4);
        margin-inline: calc(var(--spacing)*-1);
        padding: calc(var(--spacing)*1);
        display: flex;
    }

        .zplcloud-footer-nav > a {
            border-radius: calc(var(--radius)*3);
        }

        .zplcloud-footer-nav .zplcloud-footer-prev {
            gap: calc(var(--spacing)*1);
            padding-right: calc(var(--spacing)*6);
            flex-shrink: 0;
        }

        .zplcloud-footer-nav .zplcloud-footer-next, .zplcloud-footer-nav .zplcloud-footer-prev {
            height: calc(var(--spacing)*16);
            padding-inline: calc(var(--spacing)*3);
            align-items: center;
            display: flex;
        }

        .zplcloud-footer-nav .zplcloud-footer-next {
            background-color: var(--card-background,var(--card-surface-fallback));
            border-color: var(--card-border,var(--color-border-default));
            border-style: var(--tw-border-style);
            gap: calc(var(--spacing)*4);
            min-width: calc(var(--spacing)*0);
            transition-duration: var(--tw-duration,var(--default-transition-duration));
            transition-property: all;
            transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
            border-width: 1px;
            flex: 1 1 0%;
            justify-content: flex-end;
            position: relative;
            overflow: clip;
        }

    @media (hover: hover) {
        .zplcloud-footer-nav .zplcloud-footer-next:hover {
            border-color: var(--accent-a9);
            transition-property: none;
        }
    }

    .zplcloud-footer-nav--simple {
        gap: calc(var(--spacing)*2);
        margin: calc(var(--spacing)*0);
        padding: calc(var(--spacing)*0);
        background-color: rgba(0, 0, 0, 0);
        justify-content: space-between;
    }

        .zplcloud-footer-nav--simple .zplcloud-footer-prev {
            border-radius: var(--radius);
            border-style: var(--tw-border-style);
            align-items: flex-start;
            gap: calc(var(--spacing)*2);
            height: auto;
            min-width: calc(var(--spacing)*0);
            padding: calc(var(--spacing)*2);
            background-color: rgba(0, 0, 0, 0);
            border-width: 0px;
            flex-direction: column;
            flex: 1 1 0%;
            justify-content: flex-start;
            overflow: hidden;
        }

        .zplcloud-footer-nav--simple .zplcloud-footer-next {
            border-radius: var(--radius);
            border-style: var(--tw-border-style);
            align-items: flex-end;
            gap: calc(var(--spacing)*2);
            height: auto;
            min-width: calc(var(--spacing)*0);
            padding: calc(var(--spacing)*2);
            background-color: rgba(0, 0, 0, 0);
            border-width: 0px;
            flex-direction: column;
            flex: 1 1 0%;
            justify-content: flex-end;
            overflow: hidden;
        }

            .zplcloud-footer-nav--simple .zplcloud-footer-next span:first-child span {
                color: var(--grayscale-a11);
            }

            .zplcloud-footer-nav--simple .zplcloud-footer-next span:first-child svg {
                color: var(--grayscale-a9);
                transition: transform 0.2s;
            }

            .zplcloud-footer-nav--simple .zplcloud-footer-next:hover span:first-child span {
                color: var(--grayscale-a12);
            }

            .zplcloud-footer-nav--simple .zplcloud-footer-next:hover span:first-child svg {
                color: var(--grayscale-a12);
                transform: translate(4px);
            }

    .zplcloud-steps {
        border-color: var(--border,var(--grayscale-a5));
        border-left-style: var(--tw-border-style);
        margin-bottom: calc(var(--spacing)*12);
        margin-left: calc(var(--spacing)*3);
        margin-top: calc(var(--spacing)*4);
        padding-left: calc(var(--spacing)*7);
        border-left-width: 1px;
    }

    .zplcloud-step > .zplcloud-anchor {
        margin-left: -40px;
        margin-top: calc(var(--spacing)*1);
        position: absolute;
    }

    .zplcloud-walkthrough-control:hover:not(:disabled) {
        background-color: var(--grayscale-a3);
        color: var(--grayscale-a12);
    }
}

@layer utilities {
    .pointer-events-none {
        pointer-events: none;
    }

    .invisible {
        visibility: hidden;
    }

    .sr-only {
        clip-path: inset(50%);
        white-space: nowrap;
        border-width: 0px;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0px;
        overflow: hidden;
    }

    .absolute, .sr-only {
        position: absolute;
    }

    .fixed {
        position: fixed;
    }

    .relative {
        position: relative;
    }

    .sticky {
        position: sticky;
    }

    .inset-0 {
        inset: calc(var(--spacing)*0);
    }

    .top-2 {
        top: calc(var(--spacing)*2);
    }

    .right-2 {
        right: calc(var(--spacing)*2);
    }

    .z-0 {
        z-index: 0;
    }

    .z-20 {
        z-index: 20;
    }

    .-mx-4 {
        margin-inline: calc(var(--spacing)*-4);
    }

    .mx-auto {
        margin-inline: auto;
    }

    .mx-px {
        margin-inline: 1px;
    }

    .-my-2 {
        margin-block: calc(var(--spacing)*-2);
    }

    .my-6 {
        margin-block: calc(var(--spacing)*6);
    }

    .my-8 {
        margin-block: calc(var(--spacing)*8);
    }

    .prose {
        color: inherit;
        max-width: unset;
    }

        .prose :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
            margin-top: 1.25em;
            margin-bottom: 1.25em;
        }

        .prose :where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
            color: var(--tw-prose-links);
            font-weight: 500;
            text-decoration: underline;
        }

        .prose :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
            color: var(--tw-prose-headings);
            margin-top: 2em;
            margin-bottom: 1em;
            font-size: 1.5em;
            font-weight: 600;
            line-height: 1.33333;
        }

        .prose :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
            color: var(--tw-prose-headings);
            margin-top: 1.6em;
            margin-bottom: 0.6em;
            font-size: 1.25em;
            font-weight: 600;
            line-height: 1.6;
        }

        .prose :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
            color: var(--tw-prose-code);
            font-size: 0.875em;
            font-weight: 600;
        }

    .prose {
        --tw-prose-body: inherit;
        --tw-prose-headings: inherit;
        --tw-prose-lead: var(--grayscale-a11);
        --tw-prose-links: var(--accent-a11);
        --tw-prose-bold: inherit;
        --tw-prose-counters: var(--grayscale-a10);
        --tw-prose-bullets: var(--grayscale-a9);
        --tw-prose-hr: var(--color-border-default);
        --tw-prose-quotes: var(--grayscale-a11);
        --tw-prose-quote-borders: var(--accent-a6);
        --tw-prose-captions: var(--grayscale-a11);
        --tw-prose-kbd: var(--grayscale-a11);
        --tw-prose-kbd-shadows: var(--color-border-default);
        --tw-prose-code: var(--accent-a11);
        --tw-prose-pre-code: inherit;
        --tw-prose-pre-bg: initial;
        --tw-prose-th-borders: var(--color-border-default);
        --tw-prose-td-borders: var(--color-border-default);
        --tw-prose-invert-body: #d1d5dc;
        --tw-prose-invert-headings: #fff;
        --tw-prose-invert-lead: #99a1af;
        --tw-prose-invert-links: #fff;
        --tw-prose-invert-bold: #fff;
        --tw-prose-invert-counters: #99a1af;
        --tw-prose-invert-bullets: #4a5565;
        --tw-prose-invert-hr: #364153;
        --tw-prose-invert-quotes: #f3f4f6;
        --tw-prose-invert-quote-borders: #364153;
        --tw-prose-invert-captions: #99a1af;
        --tw-prose-invert-kbd: #fff;
        --tw-prose-invert-kbd-shadows: #ffffff1a;
        --tw-prose-invert-code: #fff;
        --tw-prose-invert-pre-code: #d1d5dc;
        --tw-prose-invert-pre-bg: #00000080;
        --tw-prose-invert-th-borders: #4a5565;
        --tw-prose-invert-td-borders: #364153;
        font-size: 1rem;
        line-height: 1.75;
    }

    @supports (color:lab(0% 0 0)) {
        .prose {
            --tw-prose-invert-body: lab(85.1236% -.612259 -3.7138);
            --tw-prose-invert-lead: lab(65.9269% -.832707 -8.17473);
            --tw-prose-invert-counters: lab(65.9269% -.832707 -8.17473);
            --tw-prose-invert-bullets: lab(35.6337% -1.58697 -10.8425);
            --tw-prose-invert-hr: lab(27.1134% -.956401 -12.3224);
            --tw-prose-invert-quotes: lab(96.1596% -.0823438 -1.13575);
            --tw-prose-invert-quote-borders: lab(27.1134% -.956401 -12.3224);
            --tw-prose-invert-captions: lab(65.9269% -.832707 -8.17473);
            --tw-prose-invert-pre-code: lab(85.1236% -.612259 -3.7138);
            --tw-prose-invert-th-borders: lab(35.6337% -1.58697 -10.8425);
            --tw-prose-invert-td-borders: lab(27.1134% -.956401 -12.3224);
        }
    }

    .prose :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)), .prose :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)), .prose :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)), .prose :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
        margin-top: 0px;
    }

    .prose :where(.prose > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
        margin-top: 0px;
    }

    .prose :where(.prose > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
        margin-bottom: 0px;
    }

    .prose :where(h1, h2, h3, h4, h5, h6):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
        letter-spacing: -0.02em;
    }

    .m-mdx {
        margin-bottom: calc(var(--spacing)*6);
        margin-top: calc(var(--spacing)*4);
    }

    .mt-\(--header-height\) {
        margin-top: var(--header-height);
    }

    .mt-2 {
        margin-top: calc(var(--spacing)*2);
    }

    .mt-4 {
        margin-top: calc(var(--spacing)*4);
    }

    .-mr-1 {
        margin-right: calc(var(--spacing)*-1);
    }

    .mr-1 {
        margin-right: calc(var(--spacing)*1);
    }

    .mr-4 {
        margin-right: calc(var(--spacing)*4);
    }

    .mr-auto {
        margin-right: auto;
    }

    .mb-0 {
        margin-bottom: calc(var(--spacing)*0);
    }

    .mb-6 {
        margin-bottom: calc(var(--spacing)*6);
    }

    .-ml-2 {
        margin-left: calc(var(--spacing)*-2);
    }

    .ml-4 {
        margin-left: calc(var(--spacing)*4);
    }

    .ml-auto {
        margin-left: auto;
    }

    .block {
        display: block;
    }

    .flex {
        display: flex;
    }

    .grid {
        display: grid;
    }

    .hidden {
        display: none;
    }

    .inline-flex {
        display: inline-flex;
    }

    .size-4 {
        height: calc(var(--spacing)*4);
        width: calc(var(--spacing)*4);
    }

    .size-6 {
        height: calc(var(--spacing)*6);
        width: calc(var(--spacing)*6);
    }

    .size-7 {
        height: calc(var(--spacing)*7);
        width: calc(var(--spacing)*7);
    }

    .size-9 {
        height: calc(var(--spacing)*9);
        width: calc(var(--spacing)*9);
    }

    .size-icon {
        height: calc(var(--spacing)*4);
        width: calc(var(--spacing)*4);
    }

    .h-5 {
        height: calc(var(--spacing)*5);
    }

    .h-6 {
        height: calc(var(--spacing)*6);
    }

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

    .h-9 {
        height: calc(var(--spacing)*9);
    }

    .h-px {
        height: 1px;
    }

    .max-h-full {
        max-height: 100%;
    }

    .min-h-8 {
        min-height: calc(var(--spacing)*8);
    }

    .min-h-10 {
        min-height: calc(var(--spacing)*10);
    }

    .w-6 {
        width: calc(var(--spacing)*6);
    }

    .w-content-width {
        width: var(--content-width,40rem);
    }

    .w-fit {
        width: fit-content;
    }

    .w-full {
        width: 100%;
    }

    .w-px {
        width: 1px;
    }

    .max-w-\[640px\] {
        max-width: 640px;
    }

    .max-w-full {
        max-width: 100%;
    }

    .max-w-page-width {
        max-width: var(--page-width,88rem);
    }

    .min-w-0 {
        min-width: calc(var(--spacing)*0);
    }

    .flex-1 {
        flex: 1 1 0%;
    }

    .flex-shrink-0 {
        flex-shrink: 0;
    }

    .shrink {
        flex-shrink: 1;
    }

    .shrink-0 {
        flex-shrink: 0;
    }

    .grow {
        flex-grow: 1;
    }

    .animate-dropdown-chevron {
        transition-property: transform, translate, scale, rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        --tw-duration: .25s;
        transition-duration: 0.25s;
    }

    .cursor-pointer {
        cursor: pointer;
    }

    .cursor-wait {
        cursor: wait;
    }

    .list-none {
        list-style-type: none;
    }

    .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0px, 1fr));
    }

    .flex-col {
        flex-direction: column;
    }

    .flex-row {
        flex-direction: row;
    }

    .flex-wrap {
        flex-wrap: wrap;
    }

    .items-baseline {
        align-items: baseline;
    }

    .items-center {
        align-items: center;
    }

    .items-start {
        align-items: flex-start;
    }

    .justify-between {
        justify-content: space-between;
    }

    .justify-center {
        justify-content: center;
    }

    .justify-start {
        justify-content: flex-start;
    }

    .justify-stretch {
        justify-content: stretch;
    }

    .gap-1 {
        gap: calc(var(--spacing)*1);
    }

    .gap-1\.5 {
        gap: calc(var(--spacing)*1.5);
    }

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

    .gap-3 {
        gap: calc(var(--spacing)*3);
    }

    .gap-4 {
        gap: calc(var(--spacing)*4);
    }

    :where(.space-y-1 > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*1*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*1*(1 - var(--tw-space-y-reverse)));
    }

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

    :where(.space-y-3 > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*3*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*3*(1 - var(--tw-space-y-reverse)));
    }

    :where(.space-y-6 > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*6*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));
    }

    .truncate {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .overflow-hidden {
        overflow: hidden;
    }

    .overflow-x-auto {
        overflow-x: auto;
    }

    .overscroll-contain {
        overscroll-behavior: contain;
    }

    .rounded-1 {
        border-radius: var(--radius);
    }

    .rounded-2 {
        border-radius: calc(var(--radius)*2);
    }

    .rounded-3 {
        border-radius: calc(var(--radius)*3);
    }

    .rounded-3\/2 {
        border-radius: calc(var(--radius)*1.5);
    }

    .rounded-t-\[inherit\] {
        border-top-left-radius: inherit;
        border-top-right-radius: inherit;
    }

    .rounded-b-\[inherit\] {
        border-bottom-left-radius: inherit;
        border-bottom-right-radius: inherit;
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px;
    }

    .border-0 {
        border-style: var(--tw-border-style);
        border-width: 0px;
    }

    .border-t {
        border-top-style: var(--tw-border-style);
        border-top-width: 1px;
    }

    .border-border-concealed {
        border-color: var(--border,var(--grayscale-a3));
    }

    .border-border-default {
        border-color: var(--border,var(--grayscale-a5));
    }

    .border-card-border {
        border-color: var(--card-border,var(--color-border-default));
    }

    .bg-\(color\:--grayscale-a2\) {
        background-color: var(--grayscale-a2);
    }

    .bg-border-concealed {
        background-color: var(--border,var(--grayscale-a3));
    }

    .bg-border-default {
        background-color: var(--border,var(--grayscale-a5));
    }

    .bg-card-background {
        background-color: var(--card-background,var(--grayscale-surface));
    }

    .bg-transparent {
        background-color: rgba(0, 0, 0, 0);
    }

    .mask-grad-y-3 {
        mask-image: linear-gradient(to bottom,transparent 0,#000 calc(var(--spacing)*3),#000 calc(100% - var(--spacing)*3),transparent 100%);
    }

    .object-contain {
        object-fit: contain;
    }

    .p-0 {
        padding: calc(var(--spacing)*0);
    }

    .p-1 {
        padding: calc(var(--spacing)*1);
    }

    .p-2 {
        padding: calc(var(--spacing)*2);
    }

    .p-4 {
        padding: calc(var(--spacing)*4);
    }

    .p-6 {
        padding: calc(var(--spacing)*6);
    }

    .px-2 {
        padding-inline: calc(var(--spacing)*2);
    }

    .px-3 {
        padding-inline: calc(var(--spacing)*3);
    }

    .py-1 {
        padding-block: calc(var(--spacing)*1);
    }

    .py-1\.5 {
        padding-block: calc(var(--spacing)*1.5);
    }

    .py-2 {
        padding-block: calc(var(--spacing)*2);
    }

    .py-4 {
        padding-block: calc(var(--spacing)*4);
    }

    .pl-2 {
        padding-left: calc(var(--spacing)*2);
    }

    .pl-4 {
        padding-left: calc(var(--spacing)*4);
    }

    .text-left {
        text-align: left;
    }

    .text-right {
        text-align: right;
    }

    .font-mono {
        font-family: var(--font-code);
    }

    .text-base {
        font-size: var(--text-base);
        line-height: var(--tw-leading,var(--text-base--line-height));
    }

    .text-sm {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height));
    }

    .text-xs {
        font-size: var(--text-xs);
        line-height: var(--tw-leading,var(--text-xs--line-height));
    }

    .leading-7 {
        --tw-leading: calc(var(--spacing)*7);
        line-height: calc(var(--spacing)*7);
    }

    .font-bold {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
    }

    .font-medium {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium);
    }

    .font-semibold {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
    }

    .text-balance {
        text-wrap: balance;
    }

    .break-words {
        overflow-wrap: break-word;
    }

    .whitespace-nowrap {
        white-space: nowrap;
    }

    .text-body {
        color: var(--color-black);
    }

        .text-body:is(.dark, .dark *) {
            color: var(--color-white);
        }

    .text-\(color\:--grayscale-11\) {
        color: var(--grayscale-11);
    }

    .text-\(color\:--grayscale-a8\) {
        color: var(--grayscale-a8);
    }

    .text-\(color\:--grayscale-a9\) {
        color: var(--grayscale-a9);
    }

    .text-\(color\:--grayscale-a11\) {
        color: var(--grayscale-a11);
    }

    .text-\(color\:--grayscale-a12\) {
        color: var(--grayscale-a12);
    }

    .antialiased {
        -webkit-font-smoothing: antialiased;
    }

    .opacity-0 {
        opacity: 0;
    }

    .shadow-\[0_2px_2px\], .shadow-\[inset_0_-1px_0_0\] {
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    }

    .shadow-\[inset_0_-1px_0_0\] {
        --tw-shadow: inset 0 -1px 0 0 var(--tw-shadow-color,currentcolor);
    }

    .shadow-card-grayscale {
        --tw-shadow: 0 1px 2px var(--tw-shadow-color,var(--grayscale-a3));
    }

    .shadow-card-grayscale, .shadow-lg {
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    }

    .ring-1 {
        --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);
    }

    .ring-1, .ring-2 {
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    }

    .shadow-border-default {
        --tw-shadow-color: var(--border,var(--grayscale-a5));
    }

    @supports (color:color-mix(in lab,red,red)) {
        .shadow-border-default {
            --tw-shadow-color: color-mix(in oklab,var(--border,var(--grayscale-a5))var(--tw-shadow-alpha),transparent);
        }
    }

    .ring-border-default {
        --tw-ring-color: var(--border,var(--grayscale-a5));
    }

    .backdrop-blur {
        --tw-backdrop-blur: blur(8px);
    }

    .backdrop-blur, .backdrop-blur-lg {
        backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);
    }

    .transition-all {
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    }

    .transition-colors {
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        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-opacity {
        transition-duration: var(--tw-duration,var(--default-transition-duration));
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    }

    .duration-200 {
        --tw-duration: .2s;
        transition-duration: 0.2s;
    }

    .duration-500 {
        --tw-duration: .5s;
        transition-duration: 0.5s;
    }

    .ease-out {
        --tw-ease: var(--ease-out);
        transition-timing-function: var(--ease-out);
    }

    .select-none {
        user-select: none;
    }

    .\[clip\:rect\(0\,0\,0\,0\)\] {
        clip: rect(0px, 0px, 0px, 0px);
    }

    .ring-inset {
        --tw-ring-inset: inset;
    }

    @media (hover: hover) {
        .group-hover\:pointer-events-auto:is(:where(.group):hover *) {
            pointer-events: auto;
        }

        .group-hover\/cb-container\:opacity-100:is(:where(.group\/cb-container):hover *), .group-hover\:opacity-100:is(:where(.group):hover *) {
            opacity: 1;
        }
    }

    .group-data-\[state\=active\]\:border-transparent:is(:where(.group)[data-state="active"] *) {
        border-color: rgba(0, 0, 0, 0);
    }

    .group-data-\[state\=active\]\:bg-\(color\:--accent-10\):is(:where(.group)[data-state="active"] *) {
        background-color: var(--accent-10);
    }

    .group-data-\[state\=active\]\:font-semibold:is(:where(.group)[data-state="active"] *) {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold);
    }

    .group-data-\[state\=active\]\:text-background:is(:where(.group)[data-state="active"] *) {
        color: var(--background);
    }

    .group-data-\[state\=active\]\:shadow-none:is(:where(.group)[data-state="active"] *) {
        --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);
    }

    @media (hover: hover) {
        .group-hover\:group-data-\[state\=inactive\]\:border-\(color\:--accent-a8\):is(:where(.group):hover *):is(:where(.group)[data-state="inactive"] *) {
            border-color: var(--accent-a8);
        }

        .group-hover\:group-data-\[state\=inactive\]\:bg-\(color\:--accent-a3\):is(:where(.group):hover *):is(:where(.group)[data-state="inactive"] *) {
            background-color: var(--accent-a3);
        }

        .group-hover\:group-data-\[state\=inactive\]\:text-\(color\:--accent-a11\):is(:where(.group):hover *):is(:where(.group)[data-state="inactive"] *) {
            color: var(--accent-a11);
        }
    }

    .group-focus-visible\:group-data-\[state\=inactive\]\:border-\(color\:--accent-a8\):is(:where(.group):focus-visible *):is(:where(.group)[data-state="inactive"] *) {
        border-color: var(--accent-a8);
    }

    .group-focus-visible\:group-data-\[state\=inactive\]\:bg-\(color\:--accent-a3\):is(:where(.group):focus-visible *):is(:where(.group)[data-state="inactive"] *) {
        background-color: var(--accent-a3);
    }

    .group-focus-visible\:group-data-\[state\=inactive\]\:text-\(color\:--accent-a11\):is(:where(.group):focus-visible *):is(:where(.group)[data-state="inactive"] *) {
        color: var(--accent-a11);
    }

    .before\:absolute::before {
        content: var(--tw-content);
        position: absolute;
    }

    .before\:top-2::before {
        content: var(--tw-content);
        top: calc(var(--spacing)*2);
    }

    .before\:bottom-2::before {
        bottom: calc(var(--spacing)*2);
        content: var(--tw-content);
    }

    .before\:left-0::before {
        content: var(--tw-content);
        left: calc(var(--spacing)*0);
    }

    .before\:border-l::before {
        border-left-style: var(--tw-border-style);
        content: var(--tw-content);
        border-left-width: 1px;
    }

    .before\:border-border-default::before {
        border-color: var(--border,var(--grayscale-a5));
        content: var(--tw-content);
    }

    .before\:content-\[\'\'\]::before {
        --tw-content: "";
        content: var(--tw-content);
    }

    .focus-within\:pointer-events-auto:focus-within {
        pointer-events: auto;
    }

    .focus-within\:opacity-100:focus-within {
        opacity: 1;
    }

    @media (hover: hover) {
        .hover\:bg-\(color\:--accent-a3\):hover {
            background-color: var(--accent-a3);
        }

        .hover\:bg-\(color\:--grayscale-a4\):hover {
            background-color: var(--grayscale-a4);
        }

        .hover\:text-\(color\:--accent\):hover {
            color: var(--accent);
        }

        .hover\:text-\(color\:--accent-11\):hover {
            color: var(--accent-11);
        }

        .hover\:text-\(color\:--accent-12\):hover {
            color: var(--accent-12);
        }

        .hover\:text-\(color\:--grayscale-12\):hover {
            color: var(--grayscale-12);
        }

        .hover\:transition-none:hover {
            transition-property: none;
        }
    }

    .focus-visible\:text-\(color\:--accent\):focus-visible {
        color: var(--accent);
    }

    .focus-visible\:ring-1:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    }

    .focus-visible\:ring-\(color\:--accent\):focus-visible {
        --tw-ring-color: var(--accent);
    }

    .focus-visible\:outline-none:focus-visible {
        --tw-outline-style: none;
        outline-style: none;
    }

    .disabled\:pointer-events-none:disabled {
        pointer-events: none;
    }

    .disabled\:opacity-50:disabled {
        opacity: 0.5;
    }

    .data-\[state\=active\]\:text-\(color\:--accent-a11\)[data-state="active"] {
        color: var(--accent-a11);
    }

    .data-\[state\=inactive\]\:text-\(color\:--grayscale-a11\)[data-state="inactive"] {
        color: var(--grayscale-a11);
    }

    @media not all and (min-width: 48rem) {
        .max-md\:\!max-h-8 {
            max-height: calc(var(--spacing)*8) !important;
        }
    }

    @media (min-width: 40rem) {
        .sm\:block {
            display: block;
        }

        .sm\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0px, 1fr));
        }

        .sm\:gap-4 {
            gap: calc(var(--spacing)*4);
        }
    }

    @media (min-width: 64rem) {
        .lg\:flex {
            display: flex;
        }

        .lg\:hidden {
            display: none;
        }

        .lg\:min-h-9 {
            min-height: calc(var(--spacing)*9);
        }

        .lg\:items-start {
            align-items: flex-start;
        }

        .lg\:px-1 {
            padding-inline: calc(var(--spacing)*1);
        }

        .lg\:px-3 {
            padding-inline: calc(var(--spacing)*3);
        }

        .lg\:text-sm {
            font-size: var(--text-sm);
            line-height: var(--tw-leading,var(--text-sm--line-height));
        }
    }

    @media (pointer: coarse) {
        .pointer-coarse\:hidden {
            display: none;
        }

        .pointer-coarse\:size-9 {
            width: calc(var(--spacing)*9);
        }

        .pointer-coarse\:h-9, .pointer-coarse\:size-9 {
            height: calc(var(--spacing)*9);
        }
    }

    .\[\&_svg\]\:pointer-events-none svg {
        pointer-events: none;
    }

    .\[\&_svg\]\:size-4 svg, .\[\&_svg\]\:size-icon svg {
        height: calc(var(--spacing)*4);
        width: calc(var(--spacing)*4);
    }

    .\[\&_svg\]\:shrink-0 svg {
        flex-shrink: 0;
    }

    .\[\&\>\*\]\:flex > * {
        display: flex;
    }

    :where(.\[\&\>div\]\:space-y-6 > div > :not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(var(--spacing)*6*var(--tw-space-y-reverse));
        margin-block-end: calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));
    }
}

:root {
    --black-a1: #0000000d;
    --black-a2: #0000001a;
    --black-a3: #00000026;
    --black-a4: #0003;
    --black-a5: #0000004d;
    --black-a6: #0006;
    --black-a7: #00000080;
    --black-a8: #0009;
    --black-a9: #000000b3;
    --black-a10: #000c;
    --black-a11: #000000e6;
    --black-a12: #000000f2;
    --white-a1: #ffffff0d;
    --white-a2: #ffffff1a;
    --white-a3: #ffffff26;
    --white-a4: #fff3;
    --white-a5: #ffffff4d;
    --white-a6: #fff6;
    --white-a7: #ffffff80;
    --white-a8: #fff9;
    --white-a9: #ffffffb3;
    --white-a10: #fffc;
    --white-a11: #ffffffe6;
    --white-a12: #fffffff2;
}

.light, .light-theme, :root {
    --gray-1: #fcfcfc;
    --gray-2: #f9f9f9;
    --gray-3: #f0f0f0;
    --gray-4: #e8e8e8;
    --gray-5: #e0e0e0;
    --gray-6: #d9d9d9;
    --gray-7: #cecece;
    --gray-8: #bbb;
    --gray-9: #8d8d8d;
    --gray-10: #838383;
    --gray-11: #646464;
    --gray-12: #202020;
    --gray-a1: #00000003;
    --gray-a2: #00000006;
    --gray-a3: #0000000f;
    --gray-a4: #00000017;
    --gray-a5: #0000001f;
    --gray-a6: #00000026;
    --gray-a7: #00000031;
    --gray-a8: #0004;
    --gray-a9: #00000072;
    --gray-a10: #0000007c;
    --gray-a11: #0000009b;
    --gray-a12: #000000df;
}

.dark, .dark-theme {
    --gray-1: #111;
    --gray-2: #191919;
    --gray-3: #222;
    --gray-4: #2a2a2a;
    --gray-5: #313131;
    --gray-6: #3a3a3a;
    --gray-7: #484848;
    --gray-8: #606060;
    --gray-9: #6e6e6e;
    --gray-10: #7b7b7b;
    --gray-11: #b4b4b4;
    --gray-12: #eee;
    --gray-a1: #0000;
    --gray-a2: #ffffff09;
    --gray-a3: #ffffff12;
    --gray-a4: #ffffff1b;
    --gray-a5: #fff2;
    --gray-a6: #ffffff2c;
    --gray-a7: #ffffff3b;
    --gray-a8: #fff5;
    --gray-a9: #ffffff64;
    --gray-a10: #ffffff72;
    --gray-a11: #ffffffaf;
    --gray-a12: #ffffffed;
}

.light, .light-theme, :root {
    --mauve-1: #fdfcfd;
    --mauve-9: #8e8c99;
    --mauve-10: #84828e;
    --mauve-11: #65636d;
    --mauve-12: #211f26;
    --mauve-a1: #55005503;
    --mauve-a2: #2b005506;
    --mauve-a3: #30004010;
    --mauve-a4: #20003618;
    --mauve-a5: #20003820;
    --mauve-a6: #14003527;
    --mauve-a9: #05001d73;
    --mauve-a10: #0500197d;
    --mauve-a11: #0400119c;
    --mauve-a12: #020008e0;
}

.dark, .dark-theme {
    --mauve-1: #121113;
    --mauve-9: #6f6d78;
    --mauve-10: #7c7a85;
    --mauve-11: #b5b2bc;
    --mauve-12: #eeeef0;
    --mauve-a1: #0000;
    --mauve-a2: #f5f4f609;
    --mauve-a3: #ebeaf814;
    --mauve-a4: #eee5f81d;
    --mauve-a5: #efe6fe25;
    --mauve-a6: #f1e6fd30;
    --mauve-a9: #eae6fd6e;
    --mauve-a10: #ece9fd7c;
    --mauve-a11: #f5f1ffb7;
    --mauve-a12: #fdfdffef;
}

.light, .light-theme, :root {
    --slate-1: #fcfcfd;
    --slate-9: #8b8d98;
    --slate-10: #80838d;
    --slate-11: #60646c;
    --slate-12: #1c2024;
    --slate-a1: #00005503;
    --slate-a2: #00005506;
    --slate-a3: #0000330f;
    --slate-a4: #00002d17;
    --slate-a5: #0009321f;
    --slate-a6: #00002f26;
    --slate-a9: #00051d74;
    --slate-a10: #00071b7f;
    --slate-a11: #0007149f;
    --slate-a12: #000509e3;
}

.dark, .dark-theme {
    --slate-1: #111113;
    --slate-9: #696e77;
    --slate-10: #777b84;
    --slate-11: #b0b4ba;
    --slate-12: #edeef0;
    --slate-a1: #0000;
    --slate-a2: #d8f4f609;
    --slate-a3: #ddeaf814;
    --slate-a4: #d3edf81d;
    --slate-a5: #d9edfe25;
    --slate-a6: #d6ebfd30;
    --slate-a9: #dfebfd6d;
    --slate-a10: #e5edfd7b;
    --slate-a11: #f1f7feb5;
    --slate-a12: #fcfdffef;
}

.light, .light-theme, :root {
    --sage-1: #fbfdfc;
    --sage-9: #868e8b;
    --sage-10: #7c8481;
    --sage-11: #5f6563;
    --sage-12: #1a211e;
    --sage-a1: #00804004;
    --sage-a2: #00402008;
    --sage-a3: #002d1e11;
    --sage-a4: #001f1519;
    --sage-a5: #00180820;
    --sage-a6: #00140d28;
    --sage-a9: #00110b79;
    --sage-a10: #00100a83;
    --sage-a11: #000a07a0;
    --sage-a12: #000805e5;
}

.dark, .dark-theme {
    --sage-1: #101211;
    --sage-9: #63706b;
    --sage-10: #717d79;
    --sage-11: #adb5b2;
    --sage-12: #eceeed;
    --sage-a1: #0000;
    --sage-a2: #f0f2f108;
    --sage-a3: #f3f5f412;
    --sage-a4: #f2fefd1a;
    --sage-a5: #f1fbfa22;
    --sage-a6: #edfbf42d;
    --sage-a9: #dffdf266;
    --sage-a10: #e5fdf674;
    --sage-a11: #f4fefbb0;
    --sage-a12: #fdfffeed;
}

.light, .light-theme, :root {
    --olive-1: #fcfdfc;
    --olive-9: #898e87;
    --olive-10: #7f847d;
    --olive-11: #60655f;
    --olive-12: #1d211c;
    --olive-a1: #00550003;
    --olive-a2: #00490007;
    --olive-a3: #00200010;
    --olive-a4: #00160018;
    --olive-a5: #00180020;
    --olive-a6: #00140028;
    --olive-a9: #050f0078;
    --olive-a10: #040e0082;
    --olive-a11: #020a00a0;
    --olive-a12: #010600e3;
}

.dark, .dark-theme {
    --olive-1: #111210;
    --olive-9: #687066;
    --olive-10: #767d74;
    --olive-11: #afb5ad;
    --olive-12: #eceeec;
    --olive-a1: #0000;
    --olive-a2: #f1f2f008;
    --olive-a3: #f4f5f312;
    --olive-a4: #f3fef21a;
    --olive-a5: #f2fbf122;
    --olive-a6: #f4faed2c;
    --olive-a9: #ebfde766;
    --olive-a10: #f0fdec74;
    --olive-a11: #f6fef4b0;
    --olive-a12: #fdfffded;
}

.light, .light-theme, :root {
    --sand-1: #fdfdfc;
    --sand-9: #8d8d86;
    --sand-10: #82827c;
    --sand-11: #63635e;
    --sand-12: #21201c;
    --sand-a1: #55550003;
    --sand-a2: #25250007;
    --sand-a3: #20100010;
    --sand-a4: #1f150019;
    --sand-a5: #1f180021;
    --sand-a6: #19130029;
    --sand-a9: #0f0f0079;
    --sand-a10: #0c0c0083;
    --sand-a11: #080800a1;
    --sand-a12: #060500e3;
}

.dark, .dark-theme {
    --sand-1: #111110;
    --sand-9: #6f6d66;
    --sand-10: #7c7b74;
    --sand-11: #b5b3ad;
    --sand-12: #eeeeec;
    --sand-a1: #0000;
    --sand-a2: #f4f4f309;
    --sand-a3: #f6f6f513;
    --sand-a4: #fefef31b;
    --sand-a5: #fbfbeb23;
    --sand-a6: #fffaed2d;
    --sand-a9: #fffae965;
    --sand-a10: #fffdee73;
    --sand-a11: #fffcf4b0;
    --sand-a12: #fffffded;
}

.light, .light-theme, :root {
    --tomato-1: #fffcfc;
    --tomato-9: #e54d2e;
    --tomato-10: #dd4425;
    --tomato-11: #d13415;
    --tomato-12: #5c271f;
    --tomato-a1: #ff000003;
    --tomato-a2: #ff200008;
    --tomato-a3: #f52b0018;
    --tomato-a4: #ff35002c;
    --tomato-a5: #ff2e003d;
    --tomato-a6: #f92d0050;
    --tomato-a9: #df2600d1;
    --tomato-a10: #d72400da;
    --tomato-a11: #cd2200ea;
    --tomato-a12: #460900e0;
}

.dark, .dark-theme {
    --tomato-1: #181111;
    --tomato-9: #e54d2e;
    --tomato-10: #ec6142;
    --tomato-11: #ff977d;
    --tomato-12: #fbd3cb;
    --tomato-a1: #f1121208;
    --tomato-a2: #ff55330f;
    --tomato-a3: #ff35232b;
    --tomato-a4: #fd201142;
    --tomato-a5: #fe332153;
    --tomato-a6: #ff4f3864;
    --tomato-a9: #fe5431e4;
    --tomato-a10: #ff6847eb;
    --tomato-a11: #ff977d;
    --tomato-a12: #ffd6cefb;
}

.light, .light-theme, :root {
    --red-1: #fffcfc;
    --red-9: #e5484d;
    --red-10: #dc3e42;
    --red-11: #ce2c31;
    --red-12: #641723;
    --red-a1: #ff000003;
    --red-a2: #ff000008;
    --red-a3: #f3000d14;
    --red-a4: #ff000824;
    --red-a5: #ff000632;
    --red-a6: #f8000442;
    --red-a9: #db0007b7;
    --red-a10: #d10005c1;
    --red-a11: #c40006d3;
    --red-a12: #55000de8;
}

.dark, .dark-theme {
    --red-1: #191111;
    --red-9: #e5484d;
    --red-10: #ec5d5e;
    --red-11: #ff9592;
    --red-12: #ffd1d9;
    --red-a1: #f4121209;
    --red-a2: #f22f3e11;
    --red-a3: #ff173f2d;
    --red-a4: #fe0a3b44;
    --red-a5: #ff204756;
    --red-a6: #ff3e5668;
    --red-a9: #fe4e54e4;
    --red-a10: #ff6465eb;
    --red-a11: #ff9592;
    --red-a12: #ffd1d9;
}

.light, .light-theme, :root {
    --ruby-1: #fffcfd;
    --ruby-9: #e54666;
    --ruby-10: #dc3b5d;
    --ruby-11: #ca244d;
    --ruby-12: #64172b;
    --ruby-a1: #ff005503;
    --ruby-a2: #ff002008;
    --ruby-a3: #f3002515;
    --ruby-a4: #ff002523;
    --ruby-a5: #ff002a31;
    --ruby-a6: #e4002440;
    --ruby-a9: #db002cb9;
    --ruby-a10: #d2002cc4;
    --ruby-a11: #c10030db;
    --ruby-a12: #550016e8;
}

.dark, .dark-theme {
    --ruby-1: #191113;
    --ruby-9: #e54666;
    --ruby-10: #ec5a72;
    --ruby-11: #ff949d;
    --ruby-12: #fed2e1;
    --ruby-a1: #f4124a09;
    --ruby-a2: #fe5a7f0e;
    --ruby-a3: #ff235d2c;
    --ruby-a4: #fd195e42;
    --ruby-a5: #fe2d6b53;
    --ruby-a6: #ff447665;
    --ruby-a9: #fe4c70e4;
    --ruby-a10: #ff617beb;
    --ruby-a11: #ff949d;
    --ruby-a12: #ffd3e2;
}

.light, .light-theme, :root {
    --crimson-1: #fffcfd;
    --crimson-9: #e93d82;
    --crimson-10: #df3478;
    --crimson-11: #cb1d63;
    --crimson-12: #621639;
    --crimson-a1: #ff005503;
    --crimson-a2: #e0004008;
    --crimson-a3: #ff005216;
    --crimson-a4: #f8005123;
    --crimson-a5: #e5004f31;
    --crimson-a6: #d0004b41;
    --crimson-a9: #e2005bc2;
    --crimson-a10: #d70056cb;
    --crimson-a11: #c4004fe2;
    --crimson-a12: #530026e9;
}

.dark, .dark-theme {
    --crimson-1: #191114;
    --crimson-9: #e93d82;
    --crimson-10: #ee518a;
    --crimson-11: #ff92ad;
    --crimson-12: #fdd3e8;
    --crimson-a1: #f4126709;
    --crimson-a2: #f22f7a11;
    --crimson-a3: #fe2a8b2a;
    --crimson-a4: #fd158741;
    --crimson-a5: #fd278f51;
    --crimson-a6: #fe459763;
    --crimson-a9: #fe418de8;
    --crimson-a10: #ff5693ed;
    --crimson-a11: #ff92ad;
    --crimson-a12: #ffd5eafd;
}

.light, .light-theme, :root {
    --pink-1: #fffcfe;
    --pink-9: #d6409f;
    --pink-10: #cf3897;
    --pink-11: #c2298a;
    --pink-12: #651249;
    --pink-a1: #ff00aa03;
    --pink-a2: #e0008008;
    --pink-a3: #f4008c16;
    --pink-a4: #e2008b23;
    --pink-a5: #d1008331;
    --pink-a6: #c0007840;
    --pink-a9: #c8007fbf;
    --pink-a10: #c2007ac7;
    --pink-a11: #b60074d6;
    --pink-a12: #59003bed;
}

.dark, .dark-theme {
    --pink-1: #191117;
    --pink-9: #d6409f;
    --pink-10: #de51a8;
    --pink-11: #ff8dcc;
    --pink-12: #fdd1ea;
    --pink-a1: #f412bc09;
    --pink-a2: #f420bb12;
    --pink-a3: #fe37cc29;
    --pink-a4: #fc1ec43f;
    --pink-a5: #fd35c24e;
    --pink-a6: #fd51c75f;
    --pink-a9: #fe49bcd4;
    --pink-a10: #ff5cc0dc;
    --pink-a11: #ff8dcc;
    --pink-a12: #ffd3ecfd;
}

.light, .light-theme, :root {
    --plum-1: #fefcff;
    --plum-9: #ab4aba;
    --plum-10: #a144af;
    --plum-11: #953ea3;
    --plum-12: #53195d;
    --plum-a1: #aa00ff03;
    --plum-a2: #c000c008;
    --plum-a3: #cc00cc14;
    --plum-a4: #c200c921;
    --plum-a5: #b700bd2e;
    --plum-a6: #a400b03d;
    --plum-a9: #89009eb5;
    --plum-a10: #7f0092bb;
    --plum-a11: #730086c1;
    --plum-a12: #40004be6;
}

.dark, .dark-theme {
    --plum-1: #181118;
    --plum-9: #ab4aba;
    --plum-10: #b658c4;
    --plum-11: #e796f3;
    --plum-12: #f4d4f4;
    --plum-a1: #f112f108;
    --plum-a2: #f22ff211;
    --plum-a3: #fd4cfd27;
    --plum-a4: #f646ff3a;
    --plum-a5: #f455ff48;
    --plum-a6: #f66dff56;
    --plum-a9: #e961feb6;
    --plum-a10: #ed70ffc0;
    --plum-a11: #f19cfef3;
    --plum-a12: #feddfef4;
}

.light, .light-theme, :root {
    --purple-1: #fefcfe;
    --purple-9: #8e4ec6;
    --purple-10: #8347b9;
    --purple-11: #8145b5;
    --purple-12: #402060;
    --purple-a1: #aa00aa03;
    --purple-a2: #8000e008;
    --purple-a3: #8e00f112;
    --purple-a4: #8d00e51d;
    --purple-a5: #8000db2a;
    --purple-a6: #7a01d03b;
    --purple-a9: #5c00adb1;
    --purple-a10: #53009eb8;
    --purple-a11: #52009aba;
    --purple-a12: #250049df;
}

.dark, .dark-theme {
    --purple-1: #18111b;
    --purple-9: #8e4ec6;
    --purple-10: #9a5cd0;
    --purple-11: #d19dff;
    --purple-12: #ecd9fa;
    --purple-a1: #b412f90b;
    --purple-a2: #b744f714;
    --purple-a3: #c150ff2d;
    --purple-a4: #bb53fd42;
    --purple-a5: #be5cfd51;
    --purple-a6: #c16dfd61;
    --purple-a9: #b661ffc2;
    --purple-a10: #bc6fffcd;
    --purple-a11: #d19dff;
    --purple-a12: #f1ddfffa;
}

.light, .light-theme, :root {
    --violet-1: #fdfcfe;
    --violet-9: #6e56cf;
    --violet-10: #654dc4;
    --violet-11: #6550b9;
    --violet-12: #2f265f;
    --violet-a1: #5500aa03;
    --violet-a2: #4900ff07;
    --violet-a3: #4400ee0f;
    --violet-a4: #4300ff1b;
    --violet-a5: #3600ff26;
    --violet-a6: #3100fb35;
    --violet-a9: #2400b7a9;
    --violet-a10: #2300abb2;
    --violet-a11: #1f0099af;
    --violet-a12: #0b0043d9;
}

.dark, .dark-theme {
    --violet-1: #14121f;
    --violet-9: #6e56cf;
    --violet-10: #7d66d9;
    --violet-11: #baa7ff;
    --violet-12: #e2ddfe;
    --violet-a1: #4422ff0f;
    --violet-a2: #853ff916;
    --violet-a3: #8354fe36;
    --violet-a4: #7d51fd50;
    --violet-a5: #845ffd5f;
    --violet-a6: #8f6cfd6d;
    --violet-a9: #8668ffcc;
    --violet-a10: #9176fed7;
    --violet-a11: #baa7ff;
    --violet-a12: #e3deff;
}

.light, .light-theme, :root {
    --iris-1: #fdfdff;
    --iris-9: #5b5bd6;
    --iris-10: #5151cd;
    --iris-11: #5753c6;
    --iris-12: #272962;
    --iris-a1: #0000ff02;
    --iris-a2: #0000ff07;
    --iris-a3: #0011ee0f;
    --iris-a4: #000bff19;
    --iris-a5: #000eff25;
    --iris-a6: #000aff34;
    --iris-a9: #0000c0a4;
    --iris-a10: #0000b6ae;
    --iris-a11: #0600abac;
    --iris-a12: #000246d8;
}

.dark, .dark-theme {
    --iris-1: #13131e;
    --iris-9: #5b5bd6;
    --iris-10: #6e6ade;
    --iris-11: #b1a9ff;
    --iris-12: #e0dffe;
    --iris-a1: #3636fe0e;
    --iris-a2: #564bf916;
    --iris-a3: #525bff3b;
    --iris-a4: #4d58ff5a;
    --iris-a5: #5b62fd6b;
    --iris-a6: #6d6ffd7a;
    --iris-a9: #6a6afed4;
    --iris-a10: #7d79ffdc;
    --iris-a11: #b1a9ff;
    --iris-a12: #e1e0ff;
}

.light, .light-theme, :root {
    --indigo-1: #fdfdfe;
    --indigo-9: #3e63dd;
    --indigo-10: #3358d4;
    --indigo-11: #3a5bc7;
    --indigo-12: #1f2d5c;
    --indigo-a1: #00008002;
    --indigo-a2: #0040ff08;
    --indigo-a3: #0047f112;
    --indigo-a4: #0044ff1e;
    --indigo-a5: #0044ff2d;
    --indigo-a6: #003eff3e;
    --indigo-a9: #0031d2c1;
    --indigo-a10: #002ec9cc;
    --indigo-a11: #002bb7c5;
    --indigo-a12: #001046e0;
}

.dark, .dark-theme {
    --indigo-1: #11131f;
    --indigo-9: #3e63dd;
    --indigo-10: #5472e4;
    --indigo-11: #9eb1ff;
    --indigo-12: #d6e1ff;
    --indigo-a1: #1133ff0f;
    --indigo-a2: #3354fa17;
    --indigo-a3: #2f62ff3c;
    --indigo-a4: #3566ff57;
    --indigo-a5: #4171fd6b;
    --indigo-a6: #5178fd7c;
    --indigo-a9: #4671ffdb;
    --indigo-a10: #5c7efee3;
    --indigo-a11: #9eb1ff;
    --indigo-a12: #d6e1ff;
}

.light, .light-theme, :root {
    --blue-1: #fbfdff;
    --blue-9: #0090ff;
    --blue-10: #0588f0;
    --blue-11: #0d74ce;
    --blue-12: #113264;
    --blue-a1: #0080ff04;
    --blue-a2: #008cff0b;
    --blue-a3: #008ff519;
    --blue-a4: #009eff2a;
    --blue-a5: #0093ff3d;
    --blue-a6: #0088f653;
    --blue-a9: #0090ff;
    --blue-a10: #0086f0fa;
    --blue-a11: #006dcbf2;
    --blue-a12: #002359ee;
}

.dark, .dark-theme {
    --blue-1: #0d1520;
    --blue-9: #0090ff;
    --blue-10: #3b9eff;
    --blue-11: #70b8ff;
    --blue-12: #c2e6ff;
    --blue-a1: #004df211;
    --blue-a2: #1166fb18;
    --blue-a3: #0077ff3a;
    --blue-a4: #0075ff57;
    --blue-a5: #0081fd6b;
    --blue-a6: #0f89fd7f;
    --blue-a9: #0090ff;
    --blue-a10: #3b9eff;
    --blue-a11: #70b8ff;
    --blue-a12: #c2e6ff;
}

.light, .light-theme, :root {
    --cyan-1: #fafdfe;
    --cyan-9: #00a2c7;
    --cyan-10: #0797b9;
    --cyan-11: #107d98;
    --cyan-12: #0d3c48;
    --cyan-a1: #0099cc05;
    --cyan-a2: #009db10d;
    --cyan-a3: #00c2d121;
    --cyan-a4: #00bcd435;
    --cyan-a5: #01b4cc4a;
    --cyan-a6: #00a7c162;
    --cyan-a9: #00a2c7;
    --cyan-a10: #0094b7f8;
    --cyan-a11: #007491ef;
    --cyan-a12: #00323ef2;
}

.dark, .dark-theme {
    --cyan-1: #0b161a;
    --cyan-9: #00a2c7;
    --cyan-10: #23afd0;
    --cyan-11: #4ccce6;
    --cyan-12: #b6ecf7;
    --cyan-a1: #0091f70a;
    --cyan-a2: #02a7f211;
    --cyan-a3: #00befd28;
    --cyan-a4: #00baff3b;
    --cyan-a5: #00befd4d;
    --cyan-a6: #00c7fd5e;
    --cyan-a9: #00cfffc3;
    --cyan-a10: #28d6ffcd;
    --cyan-a11: #52e1fee5;
    --cyan-a12: #bbf3fef7;
}

.light, .light-theme, :root {
    --teal-1: #fafefd;
    --teal-9: #12a594;
    --teal-10: #0d9b8a;
    --teal-11: #008573;
    --teal-12: #0d3d38;
    --teal-a1: #00cc9905;
    --teal-a2: #00aa800c;
    --teal-a3: #00c69d1f;
    --teal-a4: #00c39633;
    --teal-a5: #00b49047;
    --teal-a6: #00a6855e;
    --teal-a9: #009e8ced;
    --teal-a10: #009684f2;
    --teal-a11: #008573;
    --teal-a12: #00332df2;
}

.dark, .dark-theme {
    --teal-1: #0d1514;
    --teal-9: #12a594;
    --teal-10: #0eb39e;
    --teal-11: #0bd8b6;
    --teal-12: #adf0dd;
    --teal-a1: #00deab05;
    --teal-a2: #12fbe60c;
    --teal-a3: #00ffe61e;
    --teal-a4: #00ffe92d;
    --teal-a5: #00ffea3b;
    --teal-a6: #1cffe84b;
    --teal-a9: #13ffe49f;
    --teal-a10: #0dffe0ae;
    --teal-a11: #0afed5d6;
    --teal-a12: #b8ffebef;
}

.light, .light-theme, :root {
    --jade-1: #fbfefd;
    --jade-9: #29a383;
    --jade-10: #26997b;
    --jade-11: #208368;
    --jade-12: #1d3b31;
    --jade-a1: #00c08004;
    --jade-a2: #00a3460b;
    --jade-a3: #00ae4819;
    --jade-a4: #00a85129;
    --jade-a5: #00a2553c;
    --jade-a6: #009a5753;
    --jade-a9: #00916bd6;
    --jade-a10: #008764d9;
    --jade-a11: #007152df;
    --jade-a12: #002217e2;
}

.dark, .dark-theme {
    --jade-1: #0d1512;
    --jade-9: #29a383;
    --jade-10: #27b08b;
    --jade-11: #1fd8a4;
    --jade-12: #adf0d4;
    --jade-a1: #00de4505;
    --jade-a2: #27fba60c;
    --jade-a3: #02f99920;
    --jade-a4: #00ffaa2d;
    --jade-a5: #11ffb63b;
    --jade-a6: #34ffc24b;
    --jade-a9: #38feca9d;
    --jade-a10: #31fec7ab;
    --jade-a11: #21fec0d6;
    --jade-a12: #b8ffe1ef;
}

.light, .light-theme, :root {
    --green-1: #fbfefc;
    --green-9: #30a46c;
    --green-10: #2b9a66;
    --green-11: #218358;
    --green-12: #193b2d;
    --green-a1: #00c04004;
    --green-a2: #00a32f0b;
    --green-a3: #00a43319;
    --green-a4: #00a83829;
    --green-a5: #019c393b;
    --green-a6: #00963c52;
    --green-a9: #008f4acf;
    --green-a10: #008647d4;
    --green-a11: #00713fde;
    --green-a12: #002616e6;
}

.dark, .dark-theme {
    --green-1: #0e1512;
    --green-9: #30a46c;
    --green-10: #33b074;
    --green-11: #3dd68c;
    --green-12: #b1f1cb;
    --green-a1: #00de4505;
    --green-a2: #29f99d0b;
    --green-a3: #22ff991e;
    --green-a4: #11ff992d;
    --green-a5: #2bffa23c;
    --green-a6: #44ffaa4b;
    --green-a9: #44ffa49e;
    --green-a10: #43fea4ab;
    --green-a11: #46fea5d4;
    --green-a12: #bbffd7f0;
}

.light, .light-theme, :root {
    --grass-1: #fbfefb;
    --grass-9: #46a758;
    --grass-10: #3e9b4f;
    --grass-11: #2a7e3b;
    --grass-12: #203c25;
    --grass-a1: #00c00004;
    --grass-a2: #0099000a;
    --grass-a3: #00970016;
    --grass-a4: #009f0725;
    --grass-a5: #00930536;
    --grass-a6: #008f0a4d;
    --grass-a9: #008619b9;
    --grass-a10: #007b17c1;
    --grass-a11: #006514d5;
    --grass-a12: #002006df;
}

.dark, .dark-theme {
    --grass-1: #0e1511;
    --grass-9: #46a758;
    --grass-10: #53b365;
    --grass-11: #71d083;
    --grass-12: #c2f0c2;
    --grass-a1: #00de1205;
    --grass-a2: #5ef7780a;
    --grass-a3: #70fe8c1b;
    --grass-a4: #57ff802c;
    --grass-a5: #68ff8b3b;
    --grass-a6: #71ff8f4b;
    --grass-a9: #65ff82a1;
    --grass-a10: #72ff8dae;
    --grass-a11: #89ff9fcd;
    --grass-a12: #ceffceef;
}

.light, .light-theme, :root {
    --bronze-1: #fdfcfc;
    --bronze-9: #a18072;
    --bronze-10: #957468;
    --bronze-11: #7d5e54;
    --bronze-12: #43302b;
    --bronze-a1: #55000003;
    --bronze-a2: #cc33000a;
    --bronze-a3: #92250015;
    --bronze-a4: #80280020;
    --bronze-a5: #7423002c;
    --bronze-a6: #7324003a;
    --bronze-a9: #551a008d;
    --bronze-a10: #4c150097;
    --bronze-a11: #3d0f00ab;
    --bronze-a12: #1d0600d4;
}

.dark, .dark-theme {
    --bronze-1: #141110;
    --bronze-9: #a18072;
    --bronze-10: #ae8c7e;
    --bronze-11: #d4b3a5;
    --bronze-12: #ede0d9;
    --bronze-a1: #d1110004;
    --bronze-a2: #fbbc910c;
    --bronze-a3: #faceb817;
    --bronze-a4: #facdb622;
    --bronze-a5: #ffd2c12d;
    --bronze-a6: #ffd1c03c;
    --bronze-a9: #fec7b09b;
    --bronze-a10: #fecab5a9;
    --bronze-a11: #ffd7c6d1;
    --bronze-a12: #fff1e9ec;
}

.light, .light-theme, :root {
    --gold-1: #fdfdfc;
    --gold-9: #978365;
    --gold-10: #8c7a5e;
    --gold-11: #71624b;
    --gold-12: #3b352b;
    --gold-a1: #55550003;
    --gold-a2: #9d8a000d;
    --gold-a3: #75600018;
    --gold-a4: #6b4e0024;
    --gold-a5: #60460030;
    --gold-a6: #64440040;
    --gold-a9: #5332009a;
    --gold-a10: #492d00a1;
    --gold-a11: #362100b4;
    --gold-a12: #130c00d4;
}

.dark, .dark-theme {
    --gold-1: #121211;
    --gold-9: #978365;
    --gold-10: #a39073;
    --gold-11: #cbb99f;
    --gold-12: #e8e2d9;
    --gold-a1: #91911102;
    --gold-a2: #f9e29d0b;
    --gold-a3: #f8ecbb15;
    --gold-a4: #ffeec41e;
    --gold-a5: #feecc22a;
    --gold-a6: #feebcb37;
    --gold-a9: #ffdba690;
    --gold-a10: #fedfb09d;
    --gold-a11: #fee7c6c8;
    --gold-a12: #fef7ede7;
}

.light, .light-theme, :root {
    --brown-1: #fefdfc;
    --brown-9: #ad7f58;
    --brown-10: #a07553;
    --brown-11: #815e46;
    --brown-12: #3e332e;
    --brown-a1: #aa550003;
    --brown-a2: #aa550009;
    --brown-a3: #a04b0018;
    --brown-a4: #9b4a0026;
    --brown-a5: #9f4d0035;
    --brown-a6: #a04e0048;
    --brown-a9: #823c00a7;
    --brown-a10: #723300ac;
    --brown-a11: #522100b9;
    --brown-a12: #140600d1;
}

.dark, .dark-theme {
    --brown-1: #12110f;
    --brown-9: #ad7f58;
    --brown-10: #b88c67;
    --brown-11: #dbb594;
    --brown-12: #f2e1ca;
    --brown-a1: #91110002;
    --brown-a2: #fba67c0c;
    --brown-a3: #fcb58c19;
    --brown-a4: #fbbb8a24;
    --brown-a5: #fcb88931;
    --brown-a6: #fdba8741;
    --brown-a9: #feb87da8;
    --brown-a10: #ffc18cb3;
    --brown-a11: #fed1aad9;
    --brown-a12: #feecd4f2;
}

.light, .light-theme, :root {
    --orange-1: #fefcfb;
    --orange-9: #f76b15;
    --orange-10: #ef5f00;
    --orange-11: #cc4e00;
    --orange-12: #582d1d;
    --orange-a1: #c0400004;
    --orange-a2: #ff8e0012;
    --orange-a3: #ff9c0029;
    --orange-a4: #ff91014a;
    --orange-a5: #ff8b0065;
    --orange-a6: #ff81007d;
    --orange-a9: #f65e00ea;
    --orange-a10: #ef5f00;
    --orange-a11: #cc4e00;
    --orange-a12: #431200e2;
}

.dark, .dark-theme {
    --orange-1: #17120e;
    --orange-9: #f76b15;
    --orange-10: #ff801f;
    --orange-11: #ffa057;
    --orange-12: #ffe0c2;
    --orange-a1: #ec360007;
    --orange-a2: #fe6d000e;
    --orange-a3: #fb6a0025;
    --orange-a4: #ff590039;
    --orange-a5: #ff61004a;
    --orange-a6: #fd75045c;
    --orange-a9: #fe6d15f7;
    --orange-a10: #ff801f;
    --orange-a11: #ffa057;
    --orange-a12: #ffe0c2;
}

.light, .light-theme, :root {
    --amber-1: #fefdfb;
    --amber-9: #ffc53d;
    --amber-10: #ffba18;
    --amber-11: #ab6400;
    --amber-12: #4f3422;
    --amber-a1: #c0800004;
    --amber-a2: #f4d10016;
    --amber-a3: #ffde003d;
    --amber-a4: #ffd40063;
    --amber-a5: #f8cf0088;
    --amber-a6: #eab5008c;
    --amber-a9: #ffb300c2;
    --amber-a10: #ffb300e7;
    --amber-a11: #ab6400;
    --amber-a12: #341500dd;
}

.dark, .dark-theme {
    --amber-1: #16120c;
    --amber-9: #ffc53d;
    --amber-10: #ffd60a;
    --amber-11: #ffca16;
    --amber-12: #ffe7b3;
    --amber-a1: #e63c0006;
    --amber-a2: #fd9b000d;
    --amber-a3: #fa820022;
    --amber-a4: #fc820032;
    --amber-a5: #fd8b0041;
    --amber-a6: #fd9b0051;
    --amber-a9: #ffc53d;
    --amber-a10: #ffd60a;
    --amber-a11: #ffca16;
    --amber-a12: #ffe7b3;
}

.light, .light-theme, :root {
    --yellow-1: #fdfdf9;
    --yellow-9: #ffe629;
    --yellow-10: #ffdc00;
    --yellow-11: #9e6c00;
    --yellow-12: #473b1f;
    --yellow-a1: #aaaa0006;
    --yellow-a2: #f4dd0016;
    --yellow-a3: #ffee0047;
    --yellow-a4: #ffe3016b;
    --yellow-a5: #ffd5008f;
    --yellow-a6: #ebbc0097;
    --yellow-a9: #ffe100d6;
    --yellow-a10: #ffdc00;
    --yellow-a11: #9e6c00;
    --yellow-a12: #2e2000e0;
}

.dark, .dark-theme {
    --yellow-1: #14120b;
    --yellow-9: #ffe629;
    --yellow-10: #ffff57;
    --yellow-11: #f5e147;
    --yellow-12: #f6eeb4;
    --yellow-a1: #d1510004;
    --yellow-a2: #f9b4000b;
    --yellow-a3: #ffaa001e;
    --yellow-a4: #fdb70028;
    --yellow-a5: #febb0036;
    --yellow-a6: #fec40046;
    --yellow-a9: #ffe629;
    --yellow-a10: #ffff57;
    --yellow-a11: #fee949f5;
    --yellow-a12: #fef6baf6;
}

.light, .light-theme, :root {
    --lime-1: #fcfdfa;
    --lime-9: #bdee63;
    --lime-10: #b0e64c;
    --lime-11: #5c7c2f;
    --lime-12: #37401c;
    --lime-a1: #66990005;
    --lime-a2: #6b95000c;
    --lime-a3: #96c80029;
    --lime-a4: #8fc60042;
    --lime-a5: #81bb0059;
    --lime-a6: #72aa006e;
    --lime-a9: #93e4009c;
    --lime-a10: #8fdc00b3;
    --lime-a11: #375f00d0;
    --lime-a12: #1e2900e3;
}

.dark, .dark-theme {
    --lime-1: #11130c;
    --lime-9: #bdee63;
    --lime-10: #d4ff70;
    --lime-11: #bde56c;
    --lime-12: #e3f7ba;
    --lime-a1: #11bb0003;
    --lime-a2: #78f7000a;
    --lime-a3: #9bfd4c1a;
    --lime-a4: #a7fe5c29;
    --lime-a5: #affe6537;
    --lime-a6: #b2fe6d46;
    --lime-a9: #caff69ed;
    --lime-a10: #d4ff70;
    --lime-a11: #d1fe77e4;
    --lime-a12: #e9febff7;
}

.light, .light-theme, :root {
    --mint-1: #f9fefd;
    --mint-9: #86ead4;
    --mint-10: #7de0cb;
    --mint-11: #027864;
    --mint-12: #16433c;
    --mint-a1: #00d5aa06;
    --mint-a2: #00b18a0d;
    --mint-a3: #00d29e22;
    --mint-a4: #00cc9937;
    --mint-a5: #00c0914c;
    --mint-a6: #00b08663;
    --mint-a9: #00d3a579;
    --mint-a10: #00c39982;
    --mint-a11: #007763fd;
    --mint-a12: #00312ae9;
}

.dark, .dark-theme {
    --mint-1: #0e1515;
    --mint-9: #86ead4;
    --mint-10: #a8f5e5;
    --mint-11: #58d5ba;
    --mint-12: #c4f5e1;
    --mint-a1: #00dede05;
    --mint-a2: #00f9f90b;
    --mint-a3: #00fff61d;
    --mint-a4: #00fff42c;
    --mint-a5: #00fff23a;
    --mint-a6: #0effeb4a;
    --mint-a9: #92ffe7e9;
    --mint-a10: #aefeedf5;
    --mint-a11: #67ffded2;
    --mint-a12: #cbfee9f5;
}

.light, .light-theme, :root {
    --sky-1: #f9feff;
    --sky-9: #7ce2fe;
    --sky-10: #74daf8;
    --sky-11: #00749e;
    --sky-12: #1d3e56;
    --sky-a1: #00d5ff06;
    --sky-a2: #00a4db0e;
    --sky-a3: #00b3ee1e;
    --sky-a4: #00ace42e;
    --sky-a5: #00a1d841;
    --sky-a6: #0092ca56;
    --sky-a9: #00c7fe83;
    --sky-a10: #00bcf38b;
    --sky-a11: #00749e;
    --sky-a12: #002540e2;
}

.dark, .dark-theme {
    --sky-1: #0d141f;
    --sky-9: #7ce2fe;
    --sky-10: #a8eeff;
    --sky-11: #75c7f0;
    --sky-12: #c2f3ff;
    --sky-a1: #0044ff0f;
    --sky-a2: #1171fb18;
    --sky-a3: #1184fc33;
    --sky-a4: #128fff49;
    --sky-a5: #1c9dfd5d;
    --sky-a6: #28a5ff72;
    --sky-a9: #7ce3ff;
    --sky-a10: #a8eeff;
    --sky-a11: #7cd3ffef;
    --sky-a12: #c2f3ff;
}

@page {
    size: a4;
    margin: 0px;
}

@keyframes collapsible-closed {
    0% {
        height: var(--radix-collapsible-content-height);
        opacity: 1;
    }

    100% {
        opacity: 0;
        height: 0px;
    }
}

@keyframes collapsible-open {
    0% {
        opacity: 0;
        height: 0px;
    }

    100% {
        height: var(--radix-collapsible-content-height);
        opacity: 1;
    }
}

@keyframes slide-up {
    0% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(-100%);
    }
}

@keyframes slide-down {
    0% {
        transform: translateY(-150%);
    }

    100% {
        transform: translateY(0px);
    }
}

:root {
    --radius: .25rem;
    --color-body: var(--color-black);
    --header-height-real: 4rem;
    --card-surface-fallback: var(--background);
}

@supports (color:color-mix(in lab,red,red)) {
    :root {
        --card-surface-fallback: color-mix(in srgb,var(--background),#fff 80%);
    }
}

.dark {
    --color-body: var(--color-white);
    --card-surface-fallback: var(--background);
}

@supports (color:color-mix(in lab,red,red)) {
    .dark {
        --card-surface-fallback: color-mix(in srgb,var(--background),#000 5%);
    }
}

@property --mask-left-stop {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 0%;
}

@property --mask-right-stop {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

:root {
    --page-padding: 1rem;
    --page-margin: calc((100vw - var(--page-width))/2);
    --aside-offset: max(0px,calc(var(--page-margin) - var(--page-padding)));
    --sticky-aside-width: calc(var(--spacing-sidebar-width) + var(--aside-offset));
}

@media (min-width: 768px) {
    :root {
        --page-padding: 1.5rem;
    }
}

@media (min-width: 1024px) {
    :root {
        --page-padding: 2rem;
    }
}

@property --tw-border-spacing-x {
    syntax: "<length>";
    inherits: false;
    initial-value: 0;
}

@property --tw-border-spacing-y {
    syntax: "<length>";
    inherits: false;
    initial-value: 0;
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-duration {
    syntax: "*";
    inherits: false;
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false;
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false;
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false;
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false;
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false;
}

@property --tw-space-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-divide-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid;
}

@property --tw-divide-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0;
}

@property --tw-gradient-position {
    syntax: "*";
    inherits: false;
}

@property --tw-gradient-from {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000;
}

@property --tw-gradient-via {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000;
}

@property --tw-gradient-to {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000;
}

@property --tw-gradient-stops {
    syntax: "*";
    inherits: false;
}

@property --tw-gradient-via-stops {
    syntax: "*";
    inherits: false;
}

@property --tw-gradient-from-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 0%;
}

@property --tw-gradient-via-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 50%;
}

@property --tw-gradient-to-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-leading {
    syntax: "*";
    inherits: false;
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false;
}

@property --tw-tracking {
    syntax: "*";
    inherits: false;
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false;
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false;
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false;
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false;
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false;
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0;
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff;
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid;
}

@property --tw-blur {
    syntax: "*";
    inherits: false;
}

@property --tw-brightness {
    syntax: "*";
    inherits: false;
}

@property --tw-contrast {
    syntax: "*";
    inherits: false;
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false;
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false;
}

@property --tw-invert {
    syntax: "*";
    inherits: false;
}

@property --tw-opacity {
    syntax: "*";
    inherits: false;
}

@property --tw-saturate {
    syntax: "*";
    inherits: false;
}

@property --tw-sepia {
    syntax: "*";
    inherits: false;
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false;
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false;
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false;
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false;
}

@property --tw-ease {
    syntax: "*";
    inherits: false;
}

@property --tw-content {
    syntax: "*";
    inherits: false;
    initial-value: "";
}

@property --tw-scale-x {
    syntax: "*";
    inherits: false;
    initial-value: 1;
}

@property --tw-scale-y {
    syntax: "*";
    inherits: false;
    initial-value: 1;
}

@property --tw-scale-z {
    syntax: "*";
    inherits: false;
    initial-value: 1;
}

@property --tw-ordinal {
    syntax: "*";
    inherits: false;
}

@property --tw-slashed-zero {
    syntax: "*";
    inherits: false;
}

@property --tw-numeric-figure {
    syntax: "*";
    inherits: false;
}

@property --tw-numeric-spacing {
    syntax: "*";
    inherits: false;
}

@property --tw-numeric-fraction {
    syntax: "*";
    inherits: false;
}

@keyframes spin {
    100% {
        transform: rotate(1turn);
    }
}

@keyframes ping {
    75%, 100% {
        opacity: 0;
        transform: scale(2);
    }
}

@keyframes pulse {
    50% {
        opacity: 0.5;
    }
}

@keyframes slide-down-and-fade {
    0% {
        opacity: 0;
        transform: translateY(-2px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes slide-left-and-fade {
    0% {
        opacity: 0;
        transform: translate(2px);
    }

    100% {
        opacity: 1;
        transform: translate(0px);
    }
}

@keyframes slide-up-and-fade {
    0% {
        opacity: 0;
        transform: translateY(2px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes slide-right-and-fade {
    0% {
        opacity: 0;
        transform: translate(-2px);
    }

    100% {
        opacity: 1;
        transform: translate(0px);
    }
}

@keyframes shine {
    0% {
        opacity: 0.5;
        transform: translate(-100px) skew(-15deg);
    }

    33% {
        opacity: 0.6;
        transform: translate(300px) skew(-15deg);
    }

    100% {
        opacity: 0.6;
        transform: translate(300px) skew(-15deg);
    }
}

@keyframes thumb-rock {
    0% {
        transform: rotate(0deg);
    }

    30% {
        transform: rotate(15deg);
    }

    80% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes overlay-show {
    0% {
        backdrop-filter: blur();
        opacity: 0;
    }

    100% {
        backdrop-filter: blur(4px);
        opacity: 1;
    }
}

@keyframes dropdown-expand {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

[data-radix-scroll-area-viewport] {
    scrollbar-width: none;
}

    [data-radix-scroll-area-viewport]::-webkit-scrollbar {
        display: none;
    }

:root {
    --header-height: 108px;
    --header-height-real: 64px;
    --mobile-header-height-real: 64px;
    --content-width: 640px;
    --sidebar-width: 288px;
    --page-width: 100vw;
    --logo-height: 20px;
    --font-body: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-heading: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-code: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}

:root {
    --typography-body-font-family: var(--font-body);
    --typography-heading-font-family: var(--font-heading);
    --typography-code-font-family: var(--font-code);
}

.light, :root {
    --accent-1: #fafefa;
    --accent-2: #3D6D9E;
    --accent-3: #3D6D9E;
    --accent-4: #3D6D9E;
    --accent-5: #3D6D9E;
    --accent-6: #3D6D9E;
    --accent-7: #3D6D9E;
    --accent-8: #3D6D9E;
    --accent-9: #3D6D9E;
    --accent-10: #3D6D9E;
    --accent-11: #3D6D9E;
    --accent-12: #3D6D9E;
    --accent-a1: #3D6D9E05;
    --accent-a2: #3D6D9E0c;
    --accent-a3: #3D6D9E1b;
    --accent-a4: #3D6D9E2c;
    --accent-a5: #3D6D9E41;
    --accent-a6: #3D6D9E5a;
    --accent-a7: #3D6D9E7d;
    --accent-a8: #3D6D9Eb3;
    --accent-a9: #3D6D9E;
    --accent-a10: #3D6D9E;
    --accent-a11: #3D6D9E;
    --accent-a12: #3D6D9Ee7;
    --accent-contrast: #fff;
    --accent-surface: #3D6D9Ecc;
    --accent-indicator: #3D6D9E;
    --accent-track: #3D6D9E;
}

@supports (color: color(display-p3 1 1 1)) {
    @media (color-gamut: p3) {
        .light, :root {
            --accent-1: #3D6D9E;
            --accent-2: #3D6D9E;
            --accent-3: #3D6D9E;
            --accent-4: #3D6D9E;
            --accent-5: #3D6D9E;
            --accent-6: #3D6D9E;
            --accent-7: #3D6D9E;
            --accent-8: #3D6D9E;
            --accent-9: #3D6D9E;
            --accent-10: #3D6D9E;
            --accent-11: #3D6D9E;
            --accent-12: #3D6D9E;
            --accent-a1: color(display-p3 0.2839 0.4228 0.6040 / 0.02);
            --accent-a2: color(display-p3 0.2839 0.4228 0.6040 / 0.044);
            --accent-a3: color(display-p3 0.2839 0.4228 0.6040 / 0.099);
            --accent-a4: color(display-p3 0.2839 0.4228 0.6040 / 0.161);
            --accent-a5: color(display-p3 0.2839 0.4228 0.6040 / 0.24);
            --accent-a6: color(display-p3 0.2839 0.4228 0.6040 / 0.334);
            --accent-a7: color(display-p3 0.2839 0.4228 0.6040 / 0.459);
            --accent-a8: color(display-p3 0.2839 0.4228 0.6040 / 0.644);
            --accent-a9: color(display-p3 0.2839 0.4228 0.6040 / 0.859);
            --accent-a10: color(display-p3 0.2839 0.4228 0.6040 / 0.879);
            --accent-a11: color(display-p3 0.2839 0.4228 0.6040 / 0.863);
            --accent-a12: color(display-p3 0.2839 0.4228 0.6040 / 0.887);
            --accent-contrast: #fff;
            --accent-surface: color(display-p3 0.2839 0.4228 0.6040 / 0.8);
            --accent-indicator: #3D6D9E;
            --accent-track: #3D6D9E;
        }
    }
}

.light, :root {
    --grayscale-1: #fcfdfc;
    --grayscale-2: #f8faf8;
    --grayscale-3: #eff1ef;
    --grayscale-4: #e7e9e7;
    --grayscale-5: #dfe2df;
    --grayscale-6: #d7dad7;
    --grayscale-7: #cccfcc;
    --grayscale-8: #b9bcb8;
    --grayscale-9: #898e87;
    --grayscale-10: #7f847d;
    --grayscale-11: #60655f;
    --grayscale-12: #1d211c;
    --grayscale-a1: #00550003;
    --grayscale-a2: #00490007;
    --grayscale-a3: #00200010;
    --grayscale-a4: #00160018;
    --grayscale-a5: #00180020;
    --grayscale-a6: #00140028;
    --grayscale-a7: #000f0033;
    --grayscale-a8: #040f0047;
    --grayscale-a9: #050f0078;
    --grayscale-a10: #040e0082;
    --grayscale-a11: #020a00a0;
    --grayscale-a12: #010600e3;
    --grayscale-contrast: #000;
    --grayscale-surface: #ffffffcc;
    --grayscale-indicator: #898e87;
    --grayscale-track: #898e87;
}

@supports (color: color(display-p3 1 1 1)) {
    @media (color-gamut: p3) {
        .light, :root {
            --grayscale-1: color(display-p3 0.989 0.992 0.989);
            --grayscale-2: color(display-p3 0.974 0.98 0.973);
            --grayscale-3: color(display-p3 0.939 0.945 0.937);
            --grayscale-4: color(display-p3 0.907 0.914 0.905);
            --grayscale-5: color(display-p3 0.878 0.885 0.875);
            --grayscale-6: color(display-p3 0.846 0.855 0.843);
            --grayscale-7: color(display-p3 0.803 0.812 0.8);
            --grayscale-8: color(display-p3 0.727 0.738 0.723);
            --grayscale-9: color(display-p3 0.541 0.556 0.532);
            --grayscale-10: color(display-p3 0.5 0.515 0.491);
            --grayscale-11: color(display-p3 0.38 0.395 0.374);
            --grayscale-12: color(display-p3 0.117 0.129 0.111);
            --grayscale-a1: #00550003;
            --grayscale-a2: #00490007;
            --grayscale-a3: #00200010;
            --grayscale-a4: #00160018;
            --grayscale-a5: #00180020;
            --grayscale-a6: #00140028;
            --grayscale-a7: #000f0033;
            --grayscale-a8: #040f0047;
            --grayscale-a9: #050f0078;
            --grayscale-a10: #040e0082;
            --grayscale-a11: #020a00a0;
            --grayscale-a12: #010600e3;
            --grayscale-contrast: #000;
            --grayscale-surface: color(display-p3 1 1 1 / 80%);
            --grayscale-indicator: color(display-p3 0.541 0.556 0.532);
            --grayscale-track: color(display-p3 0.541 0.556 0.532);
        }
    }
}

.dark {
    --accent-1: #3D6D9E;
    --accent-2: #3D6D9E;
    --accent-3: #3D6D9E;
    --accent-4: #3D6D9E;
    --accent-5: #3D6D9E;
    --accent-6: #3D6D9E;
    --accent-7: #3D6D9E;
    --accent-8: #3D6D9E;
    --accent-9: #3D6D9E;
    --accent-10: #3D6D9E;
    --accent-11: #3D6D9E;
    --accent-12: #3D6D9E;
    --accent-a1: #3D6D9E03;
    --accent-a2: #3D6D9E0b;
    --accent-a3: #3D6D9E1d;
    --accent-a4: #3D6D9E2d;
    --accent-a5: #3D6D9E3c;
    --accent-a6: #3D6D9E4d;
    --accent-a7: #3D6D9E5f;
    --accent-a8: #3D6D9E73;
    --accent-a9: #3D6D9Edf;
    --accent-a10: #3D6D9Ed4;
    --accent-a11: #3D6D9Ed2;
    --accent-a12: #3D6D9Ef3;
    --accent-contrast: #ffffff;
    --accent-surface: #3D6D9E80;
    --accent-indicator: #3D6D9E;
    --accent-track: #3D6D9E;
}

@supports (color: color(display-p3 1 1 1)) {
    @media (color-gamut: p3) {
        .dark {
            --accent-1: #3D6D9E;
            --accent-2: #3D6D9E;
            --accent-3: #3D6D9E;
            --accent-4: #3D6D9E;
            --accent-5: #3D6D9E;
            --accent-6: #3D6D9E;
            --accent-7: #3D6D9E;
            --accent-8: #3D6D9E;
            --accent-9: #3D6D9E;
            --accent-10: #3D6D9E;
            --accent-11: #3D6D9E;
            --accent-12: #3D6D9E;
            --accent-a1: color(display-p3 0.2839 0.4228 0.6040 / 0.009);
            --accent-a2: color(display-p3 0.2839 0.4228 0.6040 / 0.043);
            --accent-a3: color(display-p3 0.2839 0.4228 0.6040 / 0.114);
            --accent-a4: color(display-p3 0.2839 0.4228 0.6040 / 0.173);
            --accent-a5: color(display-p3 0.2839 0.4228 0.6040 / 0.232);
            --accent-a6: color(display-p3 0.2839 0.4228 0.6040 / 0.295);
            --accent-a7: color(display-p3 0.2839 0.4228 0.6040 / 0.366);
            --accent-a8: color(display-p3 0.2839 0.4228 0.6040 / 0.446);
            --accent-a9: color(display-p3 0.2839 0.4228 0.6040 / 0.862);
            --accent-a10: color(display-p3 0.2839 0.4228 0.6040 / 0.816);
            --accent-a11: color(display-p3 0.2839 0.4228 0.6040 / 0.811);
            --accent-a12: color(display-p3 0.2839 0.4228 0.6040 / 0.942);
            --accent-contrast: #ffffff;
            --accent-surface: color(display-p3 0.2839 0.4228 0.6040 / 0.5);
            --accent-indicator: #3D6D9E;
            --accent-track: #3D6D9E;
        }
    }
}

.dark {
    --grayscale-1: #111113;
    --grayscale-2: #18191b;
    --grayscale-3: #212225;
    --grayscale-4: #272a2d;
    --grayscale-5: #2e3135;
    --grayscale-6: #363a3f;
    --grayscale-7: #43484e;
    --grayscale-8: #5a6169;
    --grayscale-9: #696e77;
    --grayscale-10: #777b84;
    --grayscale-11: #b0b4ba;
    --grayscale-12: #edeef0;
    --grayscale-a1: #00000000;
    --grayscale-a2: #d8f4f609;
    --grayscale-a3: #ddeaf814;
    --grayscale-a4: #d3edf81d;
    --grayscale-a5: #d9edfe25;
    --grayscale-a6: #d6ebfd30;
    --grayscale-a7: #d9edff40;
    --grayscale-a8: #d9edff5d;
    --grayscale-a9: #dfebfd6d;
    --grayscale-a10: #e5edfd7b;
    --grayscale-a11: #f1f7feb5;
    --grayscale-a12: #fcfdffef;
    --grayscale-contrast: #fff;
    --grayscale-surface: rgba(0, 0, 0, 0.05);
    --grayscale-indicator: #696e77;
    --grayscale-track: #696e77;
}

@supports (color: color(display-p3 1 1 1)) {
    @media (color-gamut: p3) {
        .dark {
            --grayscale-1: color(display-p3 0.067 0.067 0.074);
            --grayscale-2: color(display-p3 0.095 0.098 0.105);
            --grayscale-3: color(display-p3 0.13 0.135 0.145);
            --grayscale-4: color(display-p3 0.156 0.163 0.176);
            --grayscale-5: color(display-p3 0.183 0.191 0.206);
            --grayscale-6: color(display-p3 0.215 0.226 0.244);
            --grayscale-7: color(display-p3 0.265 0.28 0.302);
            --grayscale-8: color(display-p3 0.357 0.381 0.409);
            --grayscale-9: color(display-p3 0.415 0.431 0.463);
            --grayscale-10: color(display-p3 0.469 0.483 0.514);
            --grayscale-11: color(display-p3 0.692 0.704 0.728);
            --grayscale-12: color(display-p3 0.93 0.933 0.94);
            --grayscale-a1: #00000000;
            --grayscale-a2: #d8f4f609;
            --grayscale-a3: #ddeaf814;
            --grayscale-a4: #d3edf81d;
            --grayscale-a5: #d9edfe25;
            --grayscale-a6: #d6ebfd30;
            --grayscale-a7: #d9edff40;
            --grayscale-a8: #d9edff5d;
            --grayscale-a9: #dfebfd6d;
            --grayscale-a10: #e5edfd7b;
            --grayscale-a11: #f1f7feb5;
            --grayscale-a12: #fcfdffef;
            --grayscale-contrast: #fff;
            --grayscale-surface: color(display-p3 0 0 0 / 5%);
            --grayscale-indicator: color(display-p3 0.415 0.431 0.463);
            --grayscale-track: color(display-p3 0.415 0.431 0.463);
        }
    }
}

.light, :root {
    color-scheme: light;
    --accent: rgba(61, 109, 158, 1);
    --background: rgba(255, 255, 255, 1);
    --border: initial;
    --sidebar-background: initial;
    --header-background: color-mix(in srgb, var(--background), transparent 30%);
    --card-background: initial;
    --theme-color: #fff;
}

.dark {
    color-scheme: dark;
    --accent: rgba(61, 109, 158, 1);
    --background: rgba(17, 17, 19, 1);
    --border: initial;
    --sidebar-background: initial;
    --header-background: color-mix(in srgb, var(--background), transparent 30%);
    --card-background: initial;
    --theme-color: #111113;
}

.zplcloud-background-image {
    background-image: linear-gradient(rgba(61, 109, 158, 0.03) 0%, transparent 50%);
}

:root.dark .zplcloud-background-image {
    background-image: linear-gradient(rgba(61, 109, 158, 0.03) 0%, transparent 50%);
}

[data-theme-toggle] .theme-icon-sun {
    display: block;
}

[data-theme-toggle] .theme-icon-moon {
    display: none;
}

.dark [data-theme-toggle] .theme-icon-sun {
    display: none;
}

.dark [data-theme-toggle] .theme-icon-moon {
    display: block;
}

@media (min-width: 1024px) {
    .zplcloud-layout-content-wrapper article.w-content-width {
        margin-left: 0px !important;
    }
}

:root {
    --bprogress-color: var(--accent);
    --bprogress-height: 3px;
    --bprogress-spinner-size: 18px;
    --bprogress-spinner-animation-duration: 400ms;
    --bprogress-spinner-border-size: 2px;
    --bprogress-box-shadow: 0 0 10px var(--accent), 0 0 5px var(--accent);
    --bprogress-z-index: 99999;
    --bprogress-spinner-top: 15px;
    --bprogress-spinner-bottom: auto;
    --bprogress-spinner-right: 15px;
    --bprogress-spinner-left: auto;
}

@-webkit-keyframes bprogress-spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes bprogress-spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes bprogress-indeterminate-increase {
    0% {
        left: -5%;
        width: 5%;
    }

    100% {
        left: 130%;
        width: 100%;
    }
}

@keyframes bprogress-indeterminate-decrease {
    0% {
        left: -80%;
        width: 80%;
    }

    100% {
        left: 110%;
        width: 10%;
    }
}

html, body {
    scroll-padding-top: calc( var(--header-height) + var(--mobile-toc-height, 0px) + (var(--spacing) * 4) );
}

.fa-secondary {
    opacity: 0.4;
}

[data-radix-scroll-area-viewport] {
    scrollbar-width: none;
}

    [data-radix-scroll-area-viewport]::-webkit-scrollbar {
        display: none;
    }

div > .card-icon {
    color: var(--accent-a10);
    width: 32px;
    height: 32px;
}

    div > .card-icon:is(.dark *) {
        color: var(--accent-a10);
    }

div > .card-icon {
    color: var(--accent-a10);
    width: 32px;
    height: 32px;
}

    div > .card-icon:is(.dark *) {
        color: var(--accent-a10);
    }

div > .card-icon {
    color: var(--accent-a10);
    width: 32px;
    height: 32px;
}

    div > .card-icon:is(.dark *) {
        color: var(--accent-a10);
    }

div > .card-icon {
    color: var(--accent-a10);
    width: 32px;
    height: 32px;
}

    div > .card-icon:is(.dark *) {
        color: var(--accent-a10);
    }

/* Suppress transitions/animations while the theme toggle flips light<->dark (added by JS as .theme-no-transition) */
.theme-no-transition, .theme-no-transition *, .theme-no-transition *::before, .theme-no-transition *::after {
  transition: none !important;
  animation: none !important;
}

/* zplCloud-Logo: je nach Theme hell/dunkel */
.zpl-logo-dark { display: none !important; }
.dark .zpl-logo-light, [data-theme='dark'] .zpl-logo-light { display: none !important; }
.dark .zpl-logo-dark, [data-theme='dark'] .zpl-logo-dark { display: block !important; }

/* ── Mobile-Menü: Sidebar als Overlay über den Burger öffnen ─────────────── */
/* Backdrop: verdunkelt die Seite beim Öffnen des Menüs */
.zplcloud-mobile-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 55;
}
[data-theme="default"] #zplcloud-sidebar[data-viewport="desktop"].zplcloud-mobile-open {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100dvh;
    width: min(19rem, 85vw);
    display: flex;
    flex-direction: column;
    background: var(--background, #fff);
    border-right: 1px solid var(--border, var(--grayscale-a3));
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.35);
    z-index: 60;
    overflow-y: auto;
    padding: 1rem;
}
html.zplcloud-menu-lock {
    overflow: hidden;
}