:root {
    --w3m-color-mix: #fff;
    --w3m-accent: hsla(230, 100%, 67%, 1);
    --w3m-default: #fff;

    --wui-color-modal-bg-base: #121313;
    --wui-color-accent-base-100: var(--w3m-accent);

    --wui-color-blueberry-100: hsla(230, 100%, 67%, 1);
    --wui-color-blueberry-090: hsla(231, 76%, 61%, 1);
    --wui-color-blueberry-080: hsla(230, 59%, 55%, 1);
    --wui-color-blueberry-050: hsla(231, 100%, 70%, 0.1);

    --wui-color-fg-100: #e4e7e7;
    --wui-color-fg-125: #d0d5d5;
    --wui-color-fg-150: #a8b1b1;
    --wui-color-fg-175: #a8b0b0;
    --wui-color-fg-200: #949e9e;
    --wui-color-fg-225: #868f8f;
    --wui-color-fg-250: #788080;
    --wui-color-fg-275: #788181;
    --wui-color-fg-300: #6e7777;
    --wui-color-fg-325: #9a9a9a;
    --wui-color-fg-350: #363636;

    --wui-color-bg-100: #141414;
    --wui-color-bg-125: #191a1a;
    --wui-color-bg-150: #1e1f1f;
    --wui-color-bg-175: #222525;
    --wui-color-bg-200: #272a2a;
    --wui-color-bg-225: #2c3030;
    --wui-color-bg-250: #313535;
    --wui-color-bg-275: #363b3b;
    --wui-color-bg-300: #3b4040;
    --wui-color-bg-325: #252525;
    --wui-color-bg-350: #ffffff;

    --wui-color-success-base-100: #26d962;
    --wui-color-success-base-125: #30a46b;

    --wui-color-warning-base-100: #f3a13f;

    --wui-color-error-base-100: #f25a67;
    --wui-color-error-base-125: #df4a34;

    --wui-color-blue-base-100: rgba(102, 125, 255, 1);
    --wui-color-blue-base-90: rgba(102, 125, 255, 0.9);

    --wui-color-success-glass-001: rgba(38, 217, 98, 0.01);
    --wui-color-success-glass-002: rgba(38, 217, 98, 0.02);
    --wui-color-success-glass-005: rgba(38, 217, 98, 0.05);
    --wui-color-success-glass-010: rgba(38, 217, 98, 0.1);
    --wui-color-success-glass-015: rgba(38, 217, 98, 0.15);
    --wui-color-success-glass-020: rgba(38, 217, 98, 0.2);
    --wui-color-success-glass-025: rgba(38, 217, 98, 0.25);
    --wui-color-success-glass-030: rgba(38, 217, 98, 0.3);
    --wui-color-success-glass-060: rgba(38, 217, 98, 0.6);
    --wui-color-success-glass-080: rgba(38, 217, 98, 0.8);

    --wui-color-success-glass-reown-020: rgba(48, 164, 107, 0.2);

    --wui-color-warning-glass-reown-020: rgba(243, 161, 63, 0.2);

    --wui-color-error-glass-001: rgba(242, 90, 103, 0.01);
    --wui-color-error-glass-002: rgba(242, 90, 103, 0.02);
    --wui-color-error-glass-005: rgba(242, 90, 103, 0.05);
    --wui-color-error-glass-010: rgba(242, 90, 103, 0.1);
    --wui-color-error-glass-015: rgba(242, 90, 103, 0.15);
    --wui-color-error-glass-020: rgba(242, 90, 103, 0.2);
    --wui-color-error-glass-025: rgba(242, 90, 103, 0.25);
    --wui-color-error-glass-030: rgba(242, 90, 103, 0.3);
    --wui-color-error-glass-060: rgba(242, 90, 103, 0.6);
    --wui-color-error-glass-080: rgba(242, 90, 103, 0.8);

    --wui-color-error-glass-reown-020: rgba(223, 74, 52, 0.2);

    --wui-color-gray-glass-001: rgba(255, 255, 255, 0.01);
    --wui-color-gray-glass-002: rgba(255, 255, 255, 0.02);
    --wui-color-gray-glass-005: rgba(255, 255, 255, 0.05);
    --wui-color-gray-glass-010: rgba(255, 255, 255, 0.1);
    --wui-color-gray-glass-015: rgba(255, 255, 255, 0.15);
    --wui-color-gray-glass-020: rgba(255, 255, 255, 0.2);
    --wui-color-gray-glass-025: rgba(255, 255, 255, 0.25);
    --wui-color-gray-glass-030: rgba(255, 255, 255, 0.3);
    --wui-color-gray-glass-060: rgba(255, 255, 255, 0.6);
    --wui-color-gray-glass-080: rgba(255, 255, 255, 0.8);
    --wui-color-gray-glass-090: rgba(255, 255, 255, 0.9);

    --wui-color-dark-glass-100: rgba(42, 42, 42, 1);

    --wui-icon-box-bg-error-base-100: #3c2426;
    --wui-icon-box-bg-blue-base-100: #20303f;
    --wui-icon-box-bg-success-base-100: #1f3a28;
    --wui-icon-box-bg-inverse-base-100: #243240;

    --wui-all-wallets-bg-100: #222b35;

    --wui-avatar-border-base: #252525;

    --wui-thumbnail-border-base: #252525;

    --wui-wallet-button-bg-base: var(--wui-color-bg-125);

    --w3m-card-embedded-shadow-color: rgb(17 17 18 / 25%);
}

:root {
    --base-nav-bar-height: 64px;
    --navbar-height: 64px;
    --mobile-tabs-height: 53px;
    --vault-market-sub-tabs-height: 64px;
    --hairline: 1px;
}

@media (-webkit-min-device-pixel-ratio: 2) {
    :root {
        --hairline: 0.5px;
    }
}

@media (-webkit-min-device-pixel-ratio: 3) {
    :root {
        --hairline: 0.7px;
    }
}

:root {
    --v5-transitions-appear: opacity 250ms ease-in-out;
    --v5-easings-aggressiveOut: cubic-bezier(0, 1.02, 0.27, 0.97);
    --v5-easings-easeOutCubic: cubic-bezier(0.33, 1, 0.68, 1);
    --v5-colors-constant-color-brand: #2973ff;
    --v5-colors-constant-color-active: #5792ff;
    --v5-colors-constant-color-yellow: #f0a224;
    --v5-colors-constant-color-valid: #39a699;
    --v5-colors-constant-gradient-earth: linear-gradient(224deg, #a5feca 3.65%, #3edceb 31.56%, #2594ff 65.16%, #53f 102.22%);
    --v5-colors-constant-gradient-mars: linear-gradient(135deg, #e25544 2.88%, #620c90 98.14%);
    --v5-colors-constant-gradient-jupiter: linear-gradient(51deg, #9358f7 0.87%, #7b78f2 25.96%, #6197ee 49.23%, #45b5e9 74.93%, #10d7e2 97.48%);
    --v5-colors-constant-gradient-venus: linear-gradient(135deg, #80f1a6 0%, #efd000 100%);
    --v5-colors-constant-gradient-mercury: linear-gradient(135deg, #fbda61 2.88%, #f76b1c 98.13%);
    --v5-colors-constant-gradient-blueStroke: linear-gradient(270deg, #2470ff 0.01%, #5792ff 100%);
    --v5-colors-constant-gradient-pageBackground: linear-gradient(180deg, transparent 66.99%, rgba(27, 32, 37, 0.04) 100%);
    --v5-colors-constant-gradient-scrollIndicatorLeft: linear-gradient(-90deg, rgba(235, 237, 245, 0.01) 0%, #ebedf5 125%);
    --v5-colors-constant-gradient-scrollIndicatorRight: linear-gradient(90deg, rgba(235, 237, 245, 0.01) 0%, #ebedf5 125%);
    --v5-colors-constant-gradient-scrollIndicatorBottom: linear-gradient(to bottom, rgba(235, 237, 245, 0) 1%, #ebedf5 100%);
    --v5-colors-constant-chart-startGradient: #2470ff;
    --v5-colors-constant-chart-blueArea: linear-gradient(to left, #2470ff, #5792ff);
    --v5-colors-constant-chart-blueAreaTransparent: linear-gradient(#2470ff33 0%, transparent 80%);
    --v5-colors-constant-allocationPalette-0: #2973ff;
    --v5-colors-constant-allocationPalette-1: #5940f5;
    --v5-colors-constant-allocationPalette-2: #6364f1;
    --v5-colors-constant-allocationPalette-3: #4895ef;
    --v5-colors-constant-allocationPalette-4: #4cc9f0;
    --v5-colors-constant-allocationPalette-5: #92e9c4;
    --v5-colors-constant-allocationPalette-6: #92e9e0;
    --v5-colors-constant-allocationPalette-7: #8283e6;
    --v5-colors-constant-allocationPalette-8: #a882e6;
    --v5-colors-constant-allocationPalette-9: #c082e6;
    --v5-colors-constant-pearl: #ffffff;
    --v5-colors-constant-white: #fafafa;
    --v5-colors-constant-gray: #fafcff;
    --v5-colors-constant-dark: #f5f5f5;
    --v5-colors-constant-black: #191d20;
    --v5-colors-constant-vanta: #000000;
    --v5-colors-constant-error: #c73e59;
    --v5-colors-text-primary: #000000;
    --v5-colors-text-body: #191d20f2;
    --v5-colors-text-secondary: #191d20cc;
    --v5-colors-text-tertiary: #191d20a6;
    --v5-colors-text-brand: #2973fff2;
    --v5-colors-text-interactive-disabled: #191d2066;
    --v5-colors-text-interactive-active: #5792fff2;
    --v5-colors-text-interactive-error: #c73e59f2;
    --v5-colors-text-interactive-valid: #39a699f2;
    --v5-colors-text-interactive-warning: #f0a224f2;
    --v5-colors-text-interactive-errorDisabled: #c73e5959;
    --v5-colors-text-button-primary: #ffffff;
    --v5-colors-text-button-disabled: #ffffff80;
    --v5-colors-icon-primary: #191d20e6;
    --v5-colors-icon-secondary: #191d20cc;
    --v5-colors-icon-tertiary: #191d20a6;
    --v5-colors-icon-brand: #2973ffe6;
    --v5-colors-icon-softWarning: #f0a224e6;
    --v5-colors-icon-interactive-disabled: #191d2040;
    --v5-colors-icon-interactive-active: #5792ffe6;
    --v5-colors-icon-interactive-error: #c73e59e6;
    --v5-colors-icon-interactive-valid: #39a699e6;
    --v5-colors-icon-button-primary: #ffffffe6;
    --v5-colors-icon-button-disabled: #ffffff33;
    --v5-colors-border-base: #191d20;
    --v5-colors-border-primary: #191d2033;
    --v5-colors-border-inactive: #191d2026;
    --v5-colors-border-interactive-hover: #191d2040;
    --v5-colors-border-interactive-selected: #191d204d;
    --v5-colors-border-interactive-focus: #191d204d;
    --v5-colors-border-interactive-disabled: #191d201f;
    --v5-colors-border-interactive-active: #2973ffa6;
    --v5-colors-border-interactive-error: #c73e59a6;
    --v5-colors-background-bloc: #fafcff;
    --v5-colors-background-base: #f5f5f5;
    --v5-colors-background-primary: #191d2014;
    --v5-colors-background-secondary: #191d200f;
    --v5-colors-background-tertiary: #191d200d;
    --v5-colors-background-overlay: #0000004d;
    --v5-colors-background-alert: #c73e592e;
    --v5-colors-background-valid: #39a6993d;
    --v5-colors-background-banner: #5792ff80;
    --v5-colors-background-interactive-hover: #191d2021;
    --v5-colors-background-interactive-pressed: #191d2026;
    --v5-colors-background-interactive-selected: #191d2012;
    --v5-colors-background-interactive-disabled: #191d200a;
    --v5-colors-background-interactive-multiply-blue: #2973ffb3;
    --v5-colors-background-interactive-multiply-red: #c73e59b3;
    --v5-colors-background-button-default: #2973ffd9;
    --v5-colors-background-button-hover: #2973ffeb;
    --v5-colors-background-button-pressed: #2973ff;
    --v5-colors-background-button-progress: #2973ffbf;
    --v5-colors-background-button-disabled: #2973ff66;
    --v5-colors-background-button-info-default: #2973ff26;
    --v5-colors-background-button-info-hover: #2973ff33;
    --v5-colors-background-button-delete-default: #c73e5933;
    --v5-colors-background-button-delete-hover: #c73e593b;
    --v5-colors-background-button-delete-active: #c73e5942;
    --v5-colors-background-button-delete-disabled: #c73e5908;
    --v5-colors-components-modal: #fafcff;
    --v5-colors-components-dropdown: #fafcff;
    --v5-colors-components-tooltip: #fafcff;
    --v5-colors-components-toast: #000000;
    --v5-colors-components-badge: #c73e5980;
    --v5-colors-components-chartPalette-0: #2973ff;
    --v5-colors-components-chartPalette-1: #555e64;
    --v5-colors-components-tableRowHover: #191d2012;
    --v5-colors-components-shader-blue1-hex: #779DE4;
    --v5-colors-components-shader-blue1-rgbChannels-r: 119;
    --v5-colors-components-shader-blue1-rgbChannels-g: 157;
    --v5-colors-components-shader-blue1-rgbChannels-b: 228;
    --v5-colors-components-shader-blue2-hex: #ABCEF2;
    --v5-colors-components-shader-blue2-rgbChannels-r: 171;
    --v5-colors-components-shader-blue2-rgbChannels-g: 206;
    --v5-colors-components-shader-blue2-rgbChannels-b: 238;
    --v5-colors-components-shader-blue1Background-hex: #779DE4;
    --v5-colors-components-shader-blue1Background-rgbChannels-r: 119;
    --v5-colors-components-shader-blue1Background-rgbChannels-g: 157;
    --v5-colors-components-shader-blue1Background-rgbChannels-b: 228;
    --v5-colors-components-shader-blue2Background-hex: #ABCEF2;
    --v5-colors-components-shader-blue2Background-rgbChannels-r: 171;
    --v5-colors-components-shader-blue2Background-rgbChannels-g: 206;
    --v5-colors-components-shader-blue2Background-rgbChannels-b: 238;
    --v5-colors-components-shader-green1-hex: #46B688;
    --v5-colors-components-shader-green1-rgbChannels-r: 70;
    --v5-colors-components-shader-green1-rgbChannels-g: 182;
    --v5-colors-components-shader-green1-rgbChannels-b: 136;
    --v5-colors-components-shader-green2-hex: #8BD2B0;
    --v5-colors-components-shader-green2-rgbChannels-r: 139;
    --v5-colors-components-shader-green2-rgbChannels-g: 210;
    --v5-colors-components-shader-green2-rgbChannels-b: 176;
    --v5-colors-components-scrollBar: #191d20a6;
    --v5-colors-frame-default: #fafcff;
    --v5-colors-frame-loading: #779de4;
    --v5-colors-frame-success: #46b688;
    --v5-borderRadius: 20px;
    --v5-spacing-xxs: 4px;
    --v5-spacing-xs: 8px;
    --v5-spacing-s: 12px;
    --v5-spacing-m: 32px;
    --v5-spacing-l: 80px;
    --v5-padding-s: 20px;
    --v5-padding-m: 32px;
    --v5-dropShadow-dp2: drop-shadow(0px -1px 2px rgba(6, 9, 11, 0.04)) drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.08)) drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.1));
    --v5-dropShadow-dp4: drop-shadow(0px 3px 4px rgba(0, 0, 0, 0.09));
    --v5-dropShadow-dp8: drop-shadow(0px 1px 10px rgba(0, 0, 0, 0.04)) drop-shadow(0px 8px 12px rgba(6, 9, 11, 0.05)) drop-shadow(0px 4px 8px rgba(0, 0, 0, 0.07));
    --v5-dropShadow-dp12: drop-shadow(0px 1px 20px rgba(0, 0, 0, 0.04)) drop-shadow(0px 6px 12px rgba(0, 0, 0, 0.07)) drop-shadow(0px 12px 16px rgba(6, 9, 11, 0.06)) drop-shadow(0px 18px 24px rgba(0, 0, 0, 0.08));
    --v5-boxShadow-dp2: 0px -1px 2px 0px rgba(6, 9, 11, 0.04), 0px 0px 2px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
    --v5-boxShadow-dp4: 0px 3px 4px 0px rgba(0, 0, 0, 0.09);
    --v5-boxShadow-dp8: 0px 1px 10px 0px rgba(0, 0, 0, 0.04), 0px 8px 12px 0px rgba(6, 9, 11, 0.05), 0px 4px 8px 0px rgba(0, 0, 0, 0.07);
    --v5-boxShadow-dp12: 0px 1px 20px 0px rgba(0, 0, 0, 0.04), 0px 6px 12px 0px rgba(0, 0, 0, 0.07), 0px 12px 16px 0px rgba(6, 9, 11, 0.06), 0px 18px 24px 0px rgba(0, 0, 0, 0.08);
    --v5-breakpoints-xxs: 360px;
    --v5-breakpoints-xs: 576px;
    --v5-breakpoints-s: 768px;
    --v5-breakpoints-m: 1024px;
    --v5-breakpoints-l: 1209px;
    --v5-breakpoints-xl: 1440px;
    --v5-breakpoints-xxl: 1920px;
    --v5-breakpoints-xxxl: 2560px;
    --v5-breakpoints-content-xxs: 340px;
    --v5-breakpoints-content-xs: 556px;
    --v5-breakpoints-content-s: 748px;
    --v5-breakpoints-content-m: 1004px;
    --v5-breakpoints-content-l: 1189px;
    --v5-breakpoints-content-xl: 1420px;
    --v5-breakpoints-content-xxl: 1900px;
    --v5-zIndex-hidden: -1;
    --v5-zIndex-base-default: 1;
    --v5-zIndex-base-higher: 2;
    --v5-zIndex-base-highest: 3;
    --v5-zIndex-banner-lowest: 8;
    --v5-zIndex-banner-low: 9;
    --v5-zIndex-banner-mid: 10;
    --v5-zIndex-banner-high: 11;
    --v5-zIndex-banner-highest: 12;
    --v5-zIndex-frame-low: 45;
    --v5-zIndex-frame-mid: 50;
    --v5-zIndex-frame-high: 55;
    --v5-zIndex-dropdown-lowest: 80;
    --v5-zIndex-dropdown-low: 90;
    --v5-zIndex-dropdown-mid: 100;
    --v5-zIndex-dropdown-high: 110;
    --v5-zIndex-dropdown-highest: 120;
    --v5-zIndex-overlay-lowest: 800;
    --v5-zIndex-overlay-low: 900;
    --v5-zIndex-overlay-mid: 1000;
    --v5-zIndex-overlay-high: 1100;
    --v5-zIndex-overlay-highest: 1200;
    --v5-zIndex-highest: 10000;
    --v5-mode: light;
    -webkit-print-color-scheme: light;
    color-scheme: light;
}

@media (prefers-color-scheme: dark) {
    :root {
        --v5-transitions-appear: opacity 250ms ease-in-out;
        --v5-easings-aggressiveOut: cubic-bezier(0, 1.02, 0.27, 0.97);
        --v5-easings-easeOutCubic: cubic-bezier(0.33, 1, 0.68, 1);
        --v5-colors-constant-color-brand: #2973ff;
        --v5-colors-constant-color-active: #5792ff;
        --v5-colors-constant-color-yellow: #f0a224;
        --v5-colors-constant-color-valid: #39a699;
        --v5-colors-constant-gradient-earth: linear-gradient(224deg, #a5feca 3.65%, #3edceb 31.56%, #2594ff 65.16%, #53f 102.22%);
        --v5-colors-constant-gradient-mars: linear-gradient(135deg, #e25544 2.88%, #620c90 98.14%);
        --v5-colors-constant-gradient-jupiter: linear-gradient(51deg, #9358f7 0.87%, #7b78f2 25.96%, #6197ee 49.23%, #45b5e9 74.93%, #10d7e2 97.48%);
        --v5-colors-constant-gradient-venus: linear-gradient(135deg, #80f1a6 0%, #efd000 100%);
        --v5-colors-constant-gradient-mercury: linear-gradient(135deg, #fbda61 2.88%, #f76b1c 98.13%);
        --v5-colors-constant-gradient-blueStroke: linear-gradient(270deg, #2470ff 0.01%, #5792ff 100%);
        --v5-colors-constant-gradient-pageBackground: linear-gradient(180deg, transparent 66.99%, #ffffff08 100%);
        --v5-colors-constant-gradient-scrollIndicatorLeft: linear-gradient(-90deg, rgba(21, 24, 26, 0.01) 0%, #15181a 125%);
        --v5-colors-constant-gradient-scrollIndicatorRight: linear-gradient(90deg, rgba(21, 24, 26, 0.01) 0%, #15181a 125%);
        --v5-colors-constant-gradient-scrollIndicatorBottom: linear-gradient(to bottom, rgba(21, 24, 26, 0) 1%, rgba(21, 24, 26, 1) 100%);
        --v5-colors-constant-chart-startGradient: #2470ff;
        --v5-colors-constant-chart-blueArea: linear-gradient(to left, #2470ff, #5792ff);
        --v5-colors-constant-chart-blueAreaTransparent: linear-gradient(#2470ff33 0%, transparent 80%);
        --v5-colors-constant-allocationPalette-0: #2973ff;
        --v5-colors-constant-allocationPalette-1: #5940f5;
        --v5-colors-constant-allocationPalette-2: #6364f1;
        --v5-colors-constant-allocationPalette-3: #4895ef;
        --v5-colors-constant-allocationPalette-4: #4cc9f0;
        --v5-colors-constant-allocationPalette-5: #92e9c4;
        --v5-colors-constant-allocationPalette-6: #92e9e0;
        --v5-colors-constant-allocationPalette-7: #8283e6;
        --v5-colors-constant-allocationPalette-8: #a882e6;
        --v5-colors-constant-allocationPalette-9: #c082e6;
        --v5-colors-constant-pearl: #ffffff;
        --v5-colors-constant-white: #fafafa;
        --v5-colors-constant-gray: #33363a;
        --v5-colors-constant-dark: #222529;
        --v5-colors-constant-black: #15181a;
        --v5-colors-constant-vanta: #000000;
        --v5-colors-constant-error: #ff7792;
        --v5-colors-text-primary: #ffffff;
        --v5-colors-text-body: #fffffff2;
        --v5-colors-text-secondary: #ffffffb3;
        --v5-colors-text-tertiary: #ffffff80;
        --v5-colors-text-brand: #2973fff2;
        --v5-colors-text-interactive-disabled: #ffffff66;
        --v5-colors-text-interactive-active: #5792fff2;
        --v5-colors-text-interactive-error: #ff7792f2;
        --v5-colors-text-interactive-valid: #39a699f2;
        --v5-colors-text-interactive-warning: #f0a224f2;
        --v5-colors-text-interactive-errorDisabled: #ff77924d;
        --v5-colors-text-button-primary: #ffffff;
        --v5-colors-text-button-disabled: #ffffff26;
        --v5-colors-icon-primary: #ffffff;
        --v5-colors-icon-secondary: #ffffff99;
        --v5-colors-icon-tertiary: #ffffff66;
        --v5-colors-icon-brand: #2973fff2;
        --v5-colors-icon-softWarning: #f0a224e6;
        --v5-colors-icon-interactive-disabled: #ffffff26;
        --v5-colors-icon-interactive-active: #5792ffe6;
        --v5-colors-icon-interactive-error: #ff7792e6;
        --v5-colors-icon-interactive-valid: #39a699e6;
        --v5-colors-icon-button-primary: #ffffffe6;
        --v5-colors-icon-button-disabled: #ffffff33;
        --v5-colors-border-base: #ffffff;
        --v5-colors-border-primary: #fafafa26;
        --v5-colors-border-inactive: #fafafa0d;
        --v5-colors-border-interactive-hover: #ffffff33;
        --v5-colors-border-interactive-selected: #ffffff40;
        --v5-colors-border-interactive-focus: #ffffff40;
        --v5-colors-border-interactive-disabled: #fafafa0d;
        --v5-colors-border-interactive-active: #2973ffa6;
        --v5-colors-border-interactive-error: #ff7792a6;
        --v5-colors-background-bloc: #222529;
        --v5-colors-background-base: #15181a;
        --v5-colors-background-primary: #fafafa1a;
        --v5-colors-background-secondary: #fafafa14;
        --v5-colors-background-tertiary: #fafafa0d;
        --v5-colors-background-overlay: #0000004d;
        --v5-colors-background-alert: #ff779214;
        --v5-colors-background-valid: #39a69914;
        --v5-colors-background-banner: #5792ff80;
        --v5-colors-background-interactive-hover: #fafafa21;
        --v5-colors-background-interactive-pressed: #fafafa26;
        --v5-colors-background-interactive-selected: #fafafa1a;
        --v5-colors-background-interactive-disabled: #fafafa08;
        --v5-colors-background-interactive-multiply-blue: #2973ffb3;
        --v5-colors-background-interactive-multiply-red: #ff7792b3;
        --v5-colors-background-button-default: #2973ff;
        --v5-colors-background-button-hover: #2973fff2;
        --v5-colors-background-button-pressed: #2973ffe6;
        --v5-colors-background-button-progress: #2973ffbf;
        --v5-colors-background-button-disabled: #2973ff26;
        --v5-colors-background-button-info-default: #2973ff26;
        --v5-colors-background-button-info-hover: #2973ff33;
        --v5-colors-background-button-delete-default: #ff779214;
        --v5-colors-background-button-delete-hover: #ff77921f;
        --v5-colors-background-button-delete-active: #ff779226;
        --v5-colors-background-button-delete-disabled: #ff779208;
        --v5-colors-components-modal: #33363a;
        --v5-colors-components-dropdown: #33363a;
        --v5-colors-components-tooltip: #33363a;
        --v5-colors-components-toast: #fafafa;
        --v5-colors-components-badge: #ff779280;
        --v5-colors-components-chartPalette-0: #2973ff;
        --v5-colors-components-chartPalette-1: #d6d6d6;
        --v5-colors-components-tableRowHover: #fafafa1a;
        --v5-colors-components-shader-blue1-hex: #448AC7;
        --v5-colors-components-shader-blue1-rgbChannels-r: 68;
        --v5-colors-components-shader-blue1-rgbChannels-g: 138;
        --v5-colors-components-shader-blue1-rgbChannels-b: 199;
        --v5-colors-components-shader-blue2-hex: #3E568A;
        --v5-colors-components-shader-blue2-rgbChannels-r: 62;
        --v5-colors-components-shader-blue2-rgbChannels-g: 86;
        --v5-colors-components-shader-blue2-rgbChannels-b: 138;
        --v5-colors-components-shader-blue1Background-hex: #415B74;
        --v5-colors-components-shader-blue1Background-rgbChannels-r: 65;
        --v5-colors-components-shader-blue1Background-rgbChannels-g: 91;
        --v5-colors-components-shader-blue1Background-rgbChannels-b: 116;
        --v5-colors-components-shader-blue2Background-hex: #2F3D56;
        --v5-colors-components-shader-blue2Background-rgbChannels-r: 47;
        --v5-colors-components-shader-blue2Background-rgbChannels-g: 61;
        --v5-colors-components-shader-blue2Background-rgbChannels-b: 86;
        --v5-colors-components-shader-green1-hex: #388357;
        --v5-colors-components-shader-green1-rgbChannels-r: 56;
        --v5-colors-components-shader-green1-rgbChannels-g: 131;
        --v5-colors-components-shader-green1-rgbChannels-b: 87;
        --v5-colors-components-shader-green2-hex: #46B688;
        --v5-colors-components-shader-green2-rgbChannels-r: 70;
        --v5-colors-components-shader-green2-rgbChannels-g: 182;
        --v5-colors-components-shader-green2-rgbChannels-b: 136;
        --v5-colors-components-scrollBar: #fafafa21;
        --v5-colors-frame-default: #222528;
        --v5-colors-frame-loading: #3e568a;
        --v5-colors-frame-success: #388357;
        --v5-borderRadius: 20px;
        --v5-spacing-xxs: 4px;
        --v5-spacing-xs: 8px;
        --v5-spacing-s: 12px;
        --v5-spacing-m: 32px;
        --v5-spacing-l: 80px;
        --v5-padding-s: 20px;
        --v5-padding-m: 32px;
        --v5-dropShadow-dp2: drop-shadow(0px -1px 2px rgba(6, 9, 11, 0.04)) drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.08)) drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.1));
        --v5-dropShadow-dp4: drop-shadow(0px 3px 4px rgba(0, 0, 0, 0.09));
        --v5-dropShadow-dp8: drop-shadow(0px 1px 10px rgba(0, 0, 0, 0.04)) drop-shadow(0px 8px 12px rgba(6, 9, 11, 0.05)) drop-shadow(0px 4px 8px rgba(0, 0, 0, 0.07));
        --v5-dropShadow-dp12: drop-shadow(0px 1px 20px rgba(0, 0, 0, 0.04)) drop-shadow(0px 6px 12px rgba(0, 0, 0, 0.07)) drop-shadow(0px 12px 16px rgba(6, 9, 11, 0.06)) drop-shadow(0px 18px 24px rgba(0, 0, 0, 0.08));
        --v5-boxShadow-dp2: 0px -1px 2px 0px rgba(6, 9, 11, 0.04), 0px 0px 2px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
        --v5-boxShadow-dp4: 0px 3px 4px 0px rgba(0, 0, 0, 0.09);
        --v5-boxShadow-dp8: 0px 1px 10px 0px rgba(0, 0, 0, 0.04), 0px 8px 12px 0px rgba(6, 9, 11, 0.05), 0px 4px 8px 0px rgba(0, 0, 0, 0.07);
        --v5-boxShadow-dp12: 0px 1px 20px 0px rgba(0, 0, 0, 0.04), 0px 6px 12px 0px rgba(0, 0, 0, 0.07), 0px 12px 16px 0px rgba(6, 9, 11, 0.06), 0px 18px 24px 0px rgba(0, 0, 0, 0.08);
        --v5-breakpoints-xxs: 360px;
        --v5-breakpoints-xs: 576px;
        --v5-breakpoints-s: 768px;
        --v5-breakpoints-m: 1024px;
        --v5-breakpoints-l: 1209px;
        --v5-breakpoints-xl: 1440px;
        --v5-breakpoints-xxl: 1920px;
        --v5-breakpoints-xxxl: 2560px;
        --v5-breakpoints-content-xxs: 340px;
        --v5-breakpoints-content-xs: 556px;
        --v5-breakpoints-content-s: 748px;
        --v5-breakpoints-content-m: 1004px;
        --v5-breakpoints-content-l: 1189px;
        --v5-breakpoints-content-xl: 1420px;
        --v5-breakpoints-content-xxl: 1900px;
        --v5-zIndex-hidden: -1;
        --v5-zIndex-base-default: 1;
        --v5-zIndex-base-higher: 2;
        --v5-zIndex-base-highest: 3;
        --v5-zIndex-banner-lowest: 8;
        --v5-zIndex-banner-low: 9;
        --v5-zIndex-banner-mid: 10;
        --v5-zIndex-banner-high: 11;
        --v5-zIndex-banner-highest: 12;
        --v5-zIndex-frame-low: 45;
        --v5-zIndex-frame-mid: 50;
        --v5-zIndex-frame-high: 55;
        --v5-zIndex-dropdown-lowest: 80;
        --v5-zIndex-dropdown-low: 90;
        --v5-zIndex-dropdown-mid: 100;
        --v5-zIndex-dropdown-high: 110;
        --v5-zIndex-dropdown-highest: 120;
        --v5-zIndex-overlay-lowest: 800;
        --v5-zIndex-overlay-low: 900;
        --v5-zIndex-overlay-mid: 1000;
        --v5-zIndex-overlay-high: 1100;
        --v5-zIndex-overlay-highest: 1200;
        --v5-zIndex-highest: 10000;
        --v5-mode: dark;
        -webkit-print-color-scheme: dark;
        color-scheme: dark;
    }
}

:root .highcharts-yaxis-grid path:first-of-type,
:root .highcharts-yaxis-grid path:last-of-type {
    display: none;
}

:root .highcharts-xaxis {
    display: none;
}

:root .highcharts-plot-border {
    ry: 5px;
    rx: 5px;
}

.css-lgbjlr {
    z-index: var(--v5-zIndex-highest);
    position: fixed;
    top: 0;
    right: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 10px;
    outline: none;
    list-style: none;
    pointer-events: none;
}


*,
:before,
:after,
::backdrop {
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-translate-z: 0;
    --tw-rotate-x: initial;
    --tw-rotate-y: initial;
    --tw-rotate-z: initial;
    --tw-skew-x: initial;
    --tw-skew-y: initial;
    --tw-border-style: solid;
    --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-shadow: 0 0 #0000;
    --tw-shadow-color: initial;
    --tw-shadow-alpha: 100%;
    --tw-inset-shadow: 0 0 #0000;
    --tw-inset-shadow-color: initial;
    --tw-inset-shadow-alpha: 100%;
    --tw-ring-color: initial;
    --tw-ring-shadow: 0 0 #0000;
    --tw-inset-ring-color: initial;
    --tw-inset-ring-shadow: 0 0 #0000;
    --tw-ring-inset: initial;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-outline-style: solid;
    --tw-blur: initial;
    --tw-brightness: initial;
    --tw-contrast: initial;
    --tw-grayscale: initial;
    --tw-hue-rotate: initial;
    --tw-invert: initial;
    --tw-opacity: initial;
    --tw-saturate: initial;
    --tw-sepia: initial;
    --tw-drop-shadow: initial;
    --tw-drop-shadow-color: initial;
    --tw-drop-shadow-alpha: 100%;
    --tw-drop-shadow-size: initial;
    --tw-backdrop-blur: initial;
    --tw-backdrop-brightness: initial;
    --tw-backdrop-contrast: initial;
    --tw-backdrop-grayscale: initial;
    --tw-backdrop-hue-rotate: initial;
    --tw-backdrop-invert: initial;
    --tw-backdrop-opacity: initial;
    --tw-backdrop-saturate: initial;
    --tw-backdrop-sepia: initial;
    --tw-duration: initial;
    --tw-ease: initial;
    --tw-content: ""
}

@font-face {
    font-family: Inter;
    src: url(//cdn.morpho.org/v2/assets/fonts/Inter.woff2);
    font-display: block
}

@font-face {
    font-family: JetBrains Mono;
    src: url(//cdn.morpho.org/v2/assets/fonts/JetBrains_Mono.woff2);
    font-display: block
}

@font-face {
    font-family: FK Grotesk;
    src: url(//cdn.morpho.org/v2/assets/fonts/FKGrotesk.woff2);
    font-display: block
}


:root,
:host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --leading-normal: 1.5;
    --ease-in: cubic-bezier(.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --spacing: 4px;
    --spacing-2xs: 4px;
    --spacing-xs: 8px;
    --spacing-s: 12px;
    --spacing-m: 20px;
    --spacing-l: 32px;
    --spacing-xl: 80px;
    --radius-lg: 20px;
    --radius-md: 16px;
    --radius-sm: 12px;
    --radius-xs: 8px;
    --z-dropdown-lowest: 80;
    --z-dropdown-mid: 100;
    --z-overlay-mid: 1000;
    --z-overlay-highest: 1200;
    --z-highest: 10000;
    --gradient-earth: linear-gradient(224deg, #a5feca 3.65%, #3edceb 31.56%, #2594ff 65.16%, #53f 102.22%);
    --color-base-brand: #2973ff;
    --color-base-active: #5792ff;
    --color-base-valid: #39a699;
    --color-base-light-yellow: #f0a224;
    --color-base-dark-yellow: #f0a224;
    --color-base-light-pearl: #fff;
    --color-base-light-white: #fafafa;
    --color-base-light-gray: #fafcff;
    --color-base-light-dark: #f5f5f5;
    --color-base-light-black: #191d20;
    --color-base-light-vanta: #000;
    --color-base-light-error: #c73e59;
    --color-base-dark-pearl: #fff;
    --color-base-dark-white: #fafafa;
    --color-base-dark-gray: #33363a;
    --color-base-dark-dark: #222529;
    --color-base-dark-error: #ff7792;
    --color-text-primary: var(--lightningcss-light, var(--color-base-light-vanta))var(--lightningcss-dark, var(--color-base-dark-pearl));
    --color-bg-interactive-hover: var(--lightningcss-light, #191d2021)var(--lightningcss-dark, #fafafa21)
}

@supports (color: color-mix(in lab, red, red)) {

    :root,
    :host {
        --color-bg-interactive-hover: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)13%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)13%, transparent))
    }
}

:root,
:host {
    --color-component-scrollbar: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #fafafa21)
}

@supports (color: color-mix(in lab, red, red)) {

    :root,
    :host {
        --color-component-scrollbar: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)13%, transparent))
    }
}


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

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

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

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

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

b,
strong {
    font-weight: bolder
}

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

small {
    font-size: 80%
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

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

:-moz-focusring {
    outline: auto
}

progress {
    vertical-align: baseline
}

summary {
    display: list-item
}

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

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

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

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

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

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

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

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

::placeholder {
    opacity: 1
}

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

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

textarea {
    resize: vertical
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

*,
:after,
:before,
::backdrop {
    box-sizing: border-box;
    border: none;
    margin: 0;
    padding: 0
}

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


.\@container {
    container-type: inline-size
}

.pointer-events-auto {
    pointer-events: auto
}

.pointer-events-none {
    pointer-events: none
}

.visible {
    visibility: visible
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.relative {
    position: relative
}

.static {
    position: static
}

.sticky {
    position: sticky
}

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

.-top-1\/2 {
    top: -50%
}

.-top-\[10px\] {
    top: -10px
}

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

.top-1\/2 {
    top: 50%
}

.top-\[20\%\] {
    top: 20%
}

.top-\[45\%\] {
    top: 45%
}

.top-\[74px\] {
    top: 74px
}

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

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

.right-\[5\%\] {
    right: 5%
}

.right-\[10\%\] {
    right: 10%
}

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

.bottom-\[15\%\] {
    bottom: 15%
}

.-left-\[150\%\] {
    left: -150%
}

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

.left-1\/2 {
    left: 50%
}

.left-2xs {
    left: var(--spacing-2xs)
}

.left-\[55\%\] {
    left: 55%
}

.left-m {
    left: var(--spacing-m)
}

.left-xs {
    left: var(--spacing-xs)
}

.z-dropdown-lowest {
    z-index: var(--z-dropdown-lowest)
}

.z-dropdown-mid {
    z-index: var(--z-dropdown-mid)
}

.z-highest {
    z-index: var(--z-highest)
}

.z-overlay-highest {
    z-index: var(--z-overlay-highest)
}

.z-overlay-mid {
    z-index: var(--z-overlay-mid)
}

.container {
    width: 100%
}

@media (min-width: 340px) {
    .container {
        max-width: 340px
    }
}

@media (min-width: 360px) {
    .container {
        max-width: 360px
    }
}

@media (min-width: 556px) {
    .container {
        max-width: 556px
    }
}

@media (min-width: 576px) {
    .container {
        max-width: 576px
    }
}

@media (min-width: 748px) {
    .container {
        max-width: 748px
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 768px
    }
}

@media (min-width: 1004px) {
    .container {
        max-width: 1004px
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1024px
    }
}

@media (min-width: 1189px) {
    .container {
        max-width: 1189px
    }
}

@media (min-width: 1209px) {
    .container {
        max-width: 1209px
    }
}

@media (min-width: 1420px) {
    .container {
        max-width: 1420px
    }
}

@media (min-width: 1440px) {
    .container {
        max-width: 1440px
    }
}

@media (min-width: 1900px) {
    .container {
        max-width: 1900px
    }
}

@media (min-width: 1920px) {
    .container {
        max-width: 1920px
    }
}

@media (min-width: 2540px) {
    .container {
        max-width: 2540px
    }
}

@media (min-width: 2560px) {
    .container {
        max-width: 2560px
    }
}

.input-no-spinner {
    appearance: textfield
}

.input-no-spinner::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.input-no-spinner::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.m-0 {
    margin: calc(var(--spacing)*0)
}

.m-2xs {
    margin: var(--spacing-2xs)
}

.m-\[4px\] {
    margin: 4px
}

.m-auto {
    margin: auto
}

.m-l {
    margin: var(--spacing-l)
}

.m-m {
    margin: var(--spacing-m)
}

.m-xl {
    margin: var(--spacing-xl)
}

.m-xs {
    margin: var(--spacing-xs)
}

.mx-2xs {
    margin-inline: var(--spacing-2xs)
}

.mx-auto {
    margin-inline: auto
}

.mx-l {
    margin-inline: var(--spacing-l)
}

.mx-m {
    margin-inline: var(--spacing-m)
}

.mx-xl {
    margin-inline: var(--spacing-xl)
}

.mx-xs {
    margin-inline: var(--spacing-xs)
}

.my-2xs {
    margin-block: var(--spacing-2xs)
}

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

.my-auto {
    margin-block: auto
}

.my-l {
    margin-block: var(--spacing-l)
}

.my-m {
    margin-block: var(--spacing-m)
}

.my-xl {
    margin-block: var(--spacing-xl)
}

.my-xs {
    margin-block: var(--spacing-xs)
}

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

.mr-2xs {
    margin-right: var(--spacing-2xs)
}

.mb-1\.5 {
    margin-bottom: calc(var(--spacing)*1.5)
}

.mb-l {
    margin-bottom: var(--spacing-l)
}

.mb-xs {
    margin-bottom: var(--spacing-xs)
}

.-ml-\[7px\] {
    margin-left: -7px
}

.-ml-\[14px\] {
    margin-left: -14px
}

.-ml-\[21px\] {
    margin-left: -21px
}

.-ml-\[30px\] {
    margin-left: -30px
}

.-ml-\[47px\] {
    margin-left: -47px
}

.-ml-s {
    margin-left: calc(var(--spacing-s)*-1)
}

.-ml-xs {
    margin-left: calc(var(--spacing-xs)*-1)
}

.ml-\[6px\] {
    margin-left: 6px
}

.ml-auto {
    margin-left: auto
}

.ml-px {
    margin-left: 1px
}

.ml-s {
    margin-left: var(--spacing-s)
}

.block {
    display: block
}

.contents {
    display: contents
}

.flex {
    display: flex
}

.grid {
    display: grid
}

.hidden {
    display: none
}

.inline {
    display: inline
}

.inline-flex {
    display: inline-flex
}

.table {
    display: table
}

.aspect-square {
    aspect-ratio: 1
}

.scrollbar-styled {
    scrollbar-width: thin;
    scrollbar-color: var(--color-component-scrollbar)transparent
}

.scrollbar-styled::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.scrollbar-styled::-webkit-scrollbar-track {
    background: 0 0
}

.scrollbar-styled::-webkit-scrollbar-thumb {
    background: var(--color-bg-interactive-hover);
    border-radius: 3px
}

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

.size-\[14px\] {
    width: 14px;
    height: 14px
}

.size-\[18px\] {
    width: 18px;
    height: 18px
}

.size-\[24px\] {
    width: 24px;
    height: 24px
}

.size-\[26px\] {
    width: 26px;
    height: 26px
}

.size-\[28px\] {
    width: 28px;
    height: 28px
}

.size-\[38px\] {
    width: 38px;
    height: 38px
}

.size-\[40px\] {
    width: 40px;
    height: 40px
}

.size-\[60px\] {
    width: 60px;
    height: 60px
}

.size-full {
    width: 100%;
    height: 100%
}

.size-l {
    width: var(--spacing-l);
    height: var(--spacing-l)
}

.size-m {
    width: var(--spacing-m);
    height: var(--spacing-m)
}

.size-xl {
    width: var(--spacing-xl);
    height: var(--spacing-xl)
}

.h-\(--v6-hairline\) {
    height: var(--v6-hairline)
}

.h-4\.5 {
    height: calc(var(--spacing)*4.5)
}

.h-\[1px\] {
    height: 1px
}

.h-\[2px\] {
    height: 2px
}

.h-\[10px\] {
    height: 10px
}

.h-\[14px\] {
    height: 14px
}

.h-\[16px\] {
    height: 16px
}

.h-\[18px\] {
    height: 18px
}

.h-\[19px\] {
    height: 19px
}

.h-\[20px\] {
    height: 20px
}

.h-\[25px\] {
    height: 25px
}

.h-\[26px\] {
    height: 26px
}

.h-\[29px\] {
    height: 29px
}

.h-\[30px\] {
    height: 30px
}

.h-\[33px\] {
    height: 33px
}

.h-\[34px\] {
    height: 34px
}

.h-\[38px\] {
    height: 38px
}

.h-\[40px\] {
    height: 40px
}

.h-\[44px\] {
    height: 44px
}

.h-\[48px\] {
    height: 48px
}

.h-\[56px\] {
    height: 56px
}

.h-\[87px\] {
    height: 87px
}

.h-\[200\%\] {
    height: 200%
}

.h-\[200px\] {
    height: 200px
}

.h-\[400px\] {
    height: 400px
}

.h-\[var\(--v6-hairline\)\] {
    height: var(--v6-hairline)
}

.h-auto {
    height: auto
}

.h-fit {
    height: fit-content
}

.h-full {
    height: 100%
}

.h-l {
    height: var(--spacing-l)
}

.h-m {
    height: var(--spacing-m)
}

.h-max {
    height: max-content
}

.h-min {
    height: min-content
}

.h-s {
    height: var(--spacing-s)
}

.h-screen {
    height: 100vh
}

.max-h-\[50svh\] {
    max-height: 50svh
}

.max-h-\[80svh\] {
    max-height: 80svh
}

.max-h-\[95vh\] {
    max-height: 95vh
}

.max-h-\[300px\] {
    max-height: 300px
}

.max-h-\[calc\(50svh-var\(--spacing-s\)\)\] {
    max-height: calc(50svh - var(--spacing-s))
}

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

.min-h-\[18px\] {
    min-height: 18px
}

.min-h-\[22px\] {
    min-height: 22px
}

.min-h-\[26px\] {
    min-height: 26px
}

.min-h-screen {
    min-height: 100vh
}

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

.w-\[1px\] {
    width: 1px
}

.w-\[2px\] {
    width: 2px
}

.w-\[14px\] {
    width: 14px
}

.w-\[19px\] {
    width: 19px
}

.w-\[25px\] {
    width: 25px
}

.w-\[26px\] {
    width: 26px
}

.w-\[27px\] {
    width: 27px
}

.w-\[33px\] {
    width: 33px
}

.w-\[38px\] {
    width: 38px
}

.w-\[40px\] {
    width: 40px
}

.w-\[45px\] {
    width: 45px
}

.w-\[48px\] {
    width: 48px
}

.w-\[50px\] {
    width: 50px
}

.w-\[56px\] {
    width: 56px
}

.w-\[60px\] {
    width: 60px
}

.w-\[90vw\] {
    width: 90vw
}

.w-\[100px\] {
    width: 100px
}

.w-\[200px\] {
    width: 200px
}

.w-\[220px\] {
    width: 220px
}

.w-\[min\(200px\,70vw\)\] {
    width: min(200px, 70vw)
}

.w-\[var\(--v6-hairline\)\] {
    width: var(--v6-hairline)
}

.w-auto {
    width: auto
}

.w-fit {
    width: fit-content
}

.w-full {
    width: 100%
}

.w-l {
    width: var(--spacing-l)
}

.w-m {
    width: var(--spacing-m)
}

.w-max {
    width: max-content
}

.w-min {
    width: min-content
}

.w-screen {
    width: 100vw
}

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

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

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

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

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

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

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

.max-w-\[min\(calc\(100vw-60px\)\,1280px\)\] {
    max-width: min(100vw - 60px, 1280px)
}

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

.min-w-\[155px\] {
    min-width: 155px
}

.min-w-\[176px\] {
    min-width: 176px
}

.flex-1 {
    flex: 1
}

.flex-shrink,
.shrink {
    flex-shrink: 1
}

.shrink-0 {
    flex-shrink: 0
}

.flex-grow,
.grow {
    flex-grow: 1
}

.grow-0 {
    flex-grow: 0
}

.basis-auto {
    flex-basis: auto
}

.basis-full {
    flex-basis: 100%
}

.border-collapse {
    border-collapse: collapse
}

.-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-x-\[0\.2px\] {
    --tw-translate-x: .2px;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-x-\[3px\] {
    --tw-translate-x: 3px;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-x-\[16px\] {
    --tw-translate-x: 16px;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-y-\[0\.5px\] {
    --tw-translate-y: .5px;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.translate-z-0 {
    --tw-translate-z: calc(var(--spacing)*0);
    translate: var(--tw-translate-x)var(--tw-translate-y)var(--tw-translate-z)
}

.rotate-0 {
    rotate: none
}

.rotate-180 {
    rotate: 180deg
}

.animate-skeleton-wave {
    animation: 1s linear .5s infinite alternate skeleton-wave;
    transform: translate(100%)
}

.transform {
    transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
}

.animate-\[pop-up-scale_300ms_cubic-bezier\(0\.175\,0\.885\,0\.32\,1\.275\)\] {
    animation: .3s cubic-bezier(.175, .885, .32, 1.275) pop-up-scale
}

.animate-bounce-from-left {
    animation: .3s ease-in-out bounce-from-left
}

.animate-dialog-in {
    animation: .3s cubic-bezier(.16, 1, .3, 1) dialog-in
}

.animate-fade-in {
    animation: .3s cubic-bezier(.16, 1, .3, 1) fade-in
}

.animate-fade-in-fast {
    animation: .2s linear fade-in
}

.animate-v2badge-pulse {
    animation: 2s ease-in-out infinite v2badge-pulse
}

.animate-v2badge-rotate {
    animation: 5s linear infinite v2badge-rotate
}

.animate-v2badge-shine {
    animation: 6s ease-in-out infinite both v2badge-shine
}

.cursor-default {
    cursor: default
}

.cursor-grab {
    cursor: grab
}

.cursor-move {
    cursor: move
}

.cursor-none {
    cursor: none
}

.cursor-not-allowed {
    cursor: not-allowed
}

.cursor-pointer {
    cursor: pointer
}

.cursor-text {
    cursor: text
}

.cursor-wait {
    cursor: wait
}

.touch-none {
    touch-action: none
}

.resize {
    resize: both
}

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

.appearance-none {
    appearance: none
}

.flex-col {
    flex-direction: column
}

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

.flex-row {
    flex-direction: row
}

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

.flex-nowrap {
    flex-wrap: nowrap
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse
}

.items-baseline {
    align-items: baseline
}

.items-center {
    align-items: center
}

.items-end {
    align-items: flex-end
}

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

.items-stretch {
    align-items: stretch
}

.justify-around {
    justify-content: space-around
}

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

.justify-center {
    justify-content: center
}

.justify-end {
    justify-content: flex-end
}

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

.justify-stretch {
    justify-content: stretch
}

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

.gap-0\.5 {
    gap: calc(var(--spacing)*.5)
}

.gap-2xs {
    gap: var(--spacing-2xs)
}

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

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

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

.gap-\[2\.5px\] {
    gap: 2.5px
}

.gap-\[2px\] {
    gap: 2px
}

.gap-\[9px\] {
    gap: 9px
}

.gap-\[10px\] {
    gap: 10px
}

.gap-\[18px\] {
    gap: 18px
}

.gap-l {
    gap: var(--spacing-l)
}

.gap-s {
    gap: var(--spacing-s)
}

.gap-xl {
    gap: var(--spacing-xl)
}

.gap-xs {
    gap: var(--spacing-xs)
}

.gap-x-xl {
    column-gap: var(--spacing-xl)
}

.gap-y-xs {
    row-gap: var(--spacing-xs)
}

.self-center {
    align-self: center
}

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

.overflow-auto {
    overflow: auto
}

.overflow-hidden {
    overflow: hidden
}

.overflow-visible {
    overflow: visible
}

.overflow-x-hidden {
    overflow-x: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.rounded-\[3px\] {
    border-radius: 3px
}

.rounded-\[4px\] {
    border-radius: 4px
}

.rounded-\[6px\] {
    border-radius: 6px
}

.rounded-\[8px\] {
    border-radius: 8px
}

.rounded-\[10px\] {
    border-radius: 10px
}

.rounded-\[20px\] {
    border-radius: 20px
}

.rounded-\[50px\] {
    border-radius: 50px
}

.rounded-\[100px\] {
    border-radius: 100px
}

.rounded-\[120px\] {
    border-radius: 120px
}

.rounded-full {
    border-radius: 3.40282e38px
}

.rounded-lg {
    border-radius: var(--radius-lg)
}

.rounded-md {
    border-radius: var(--radius-md)
}

.rounded-none {
    border-radius: 0
}

.rounded-sm {
    border-radius: var(--radius-sm)
}

.rounded-xs {
    border-radius: var(--radius-xs)
}

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

.border-hairline {
    border-style: solid;
    border-width: var(--v6-hairline)
}

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

.border-hairline-b {
    border-bottom-style: solid;
    border-bottom-width: var(--v6-hairline)
}

.border-none {
    --tw-border-style: none;
    border-style: none
}

.border-border-interactive-active {
    border-color: #2973ffa6
}

@supports (color: color-mix(in lab, red, red)) {
    .border-border-interactive-active {
        border-color: color-mix(in srgb, var(--color-base-brand)65%, transparent)
    }
}

.border-border-primary {
    border-color: var(--lightningcss-light, #191d2033)var(--lightningcss-dark, #fafafa26)
}

@supports (color: color-mix(in lab, red, red)) {
    .border-border-primary {
        border-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
    }
}

.border-transparent {
    border-color: #0000
}

.bg-\[rgba\(255\,255\,255\,0\.95\)\] {
    background-color: #fffffff2
}

.bg-bg-alert {
    background-color: var(--lightningcss-light, #c73e592e)var(--lightningcss-dark, #ff779214)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-alert {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)18%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)8%, transparent))
    }
}

.bg-bg-bloc {
    background-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.bg-bg-button-default {
    background-color: var(--lightningcss-light, #2973ffd9)var(--lightningcss-dark, var(--color-base-brand))
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-button-default {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)85%, transparent))var(--lightningcss-dark, var(--color-base-brand))
    }
}

.bg-bg-button-delete-default {
    background-color: var(--lightningcss-light, #c73e5933)var(--lightningcss-dark, #ff779214)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-button-delete-default {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)8%, transparent))
    }
}

.bg-bg-button-delete-hover {
    background-color: var(--lightningcss-light, #c73e593b)var(--lightningcss-dark, #ff77921f)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-button-delete-hover {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)23%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)12%, transparent))
    }
}

.bg-bg-button-disabled {
    background-color: var(--lightningcss-light, #2973ff66)var(--lightningcss-dark, #2973ff26)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-button-disabled {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)15%, transparent))
    }
}

.bg-bg-button-progress {
    background-color: #2973ffbf
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-button-progress {
        background-color: color-mix(in srgb, var(--color-base-brand)75%, transparent)
    }
}

.bg-bg-interactive-disabled {
    background-color: var(--lightningcss-light, #191d200a)var(--lightningcss-dark, #fafafa08)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-interactive-disabled {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)4%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)3%, transparent))
    }
}

.bg-bg-overlay {
    background-color: #0000004d
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-overlay {
        background-color: color-mix(in srgb, var(--color-base-light-vanta)30%, transparent)
    }
}

.bg-bg-primary {
    background-color: var(--lightningcss-light, #191d2014)var(--lightningcss-dark, #fafafa1a)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-primary {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)8%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)10%, transparent))
    }
}

.bg-bg-secondary {
    background-color: var(--lightningcss-light, #191d200f)var(--lightningcss-dark, #fafafa14)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-secondary {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)6%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)8%, transparent))
    }
}

.bg-bg-valid {
    background-color: var(--lightningcss-light, #39a6993d)var(--lightningcss-dark, #39a69914)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-bg-valid {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-valid)24%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-valid)8%, transparent))
    }
}

.bg-border-primary {
    background-color: var(--lightningcss-light, #191d2033)var(--lightningcss-dark, #fafafa26)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-border-primary {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
    }
}

.bg-component-modal {
    background-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-gray))
}

.bg-constant-active {
    background-color: var(--color-base-active)
}

.bg-constant-brand {
    background-color: var(--color-base-brand)
}

.bg-constant-dark {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.bg-constant-error {
    background-color: var(--lightningcss-light, var(--color-base-light-error))var(--lightningcss-dark, var(--color-base-dark-error))
}

.bg-constant-gray {
    background-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-gray))
}

.bg-constant-pearl {
    background-color: var(--color-base-light-pearl)
}

.bg-icon-brand {
    background-color: var(--lightningcss-light, #2973ffe6)var(--lightningcss-dark, #2973fff2)
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-icon-brand {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)90%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)95%, transparent))
    }
}

.bg-icon-button-disabled {
    background-color: #fff3
}

@supports (color: color-mix(in lab, red, red)) {
    .bg-icon-button-disabled {
        background-color: color-mix(in srgb, var(--color-base-light-pearl)20%, transparent)
    }
}

.bg-transparent {
    background-color: #0000
}

.bg-linear-to-r {
    --tw-gradient-position: to right
}

@supports (background-image: linear-gradient(in lab, red, red)) {
    .bg-linear-to-r {
        --tw-gradient-position: to right in oklab
    }
}

.bg-linear-to-r {
    background-image: linear-gradient(var(--tw-gradient-stops))
}

.bg-gradient-to-b {
    --tw-gradient-position: to bottom in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops))
}

.bg-\(image\: --gradient-earth\) {
    background-image: var(--gradient-earth)
}

.bg-\[linear-gradient\(90deg\,transparent_0\%\,rgba\(255\,255\,255\,0\)_20\%\,rgba\(255\,255\,255\,0\.4\)_50\%\,rgba\(255\,255\,255\,0\)_80\%\,transparent_100\%\)\] {
    background-image: linear-gradient(90deg, #0000 0%, #fff0 20%, #fff6 50%, #fff0 80%, #0000 100%)
}

.from-\[rgba\(87\,146\,255\,0\.8\)\] {
    --tw-gradient-from: #5792ffcc;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.from-transparent {
    --tw-gradient-from: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.via-bg-secondary {
    --tw-gradient-via: var(--lightningcss-light, #191d200f)var(--lightningcss-dark, #fafafa14)
}

@supports (color: color-mix(in lab, red, red)) {
    .via-bg-secondary {
        --tw-gradient-via: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)6%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)8%, transparent))
    }
}

.via-bg-secondary {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops)
}

.to-\[rgba\(41\,115\,255\,0\.8\)\] {
    --tw-gradient-to: #2973ffcc;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.to-transparent {
    --tw-gradient-to: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
}

.mask-repeat {
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat
}

.fill-bg-bloc {
    fill: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.object-contain {
    object-fit: contain
}

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

.p-2\.5 {
    padding: calc(var(--spacing)*2.5)
}

.p-2xs {
    padding: var(--spacing-2xs)
}

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

.p-\[0px\] {
    padding: 0
}

.p-\[2\.5px\] {
    padding: 2.5px
}

.p-\[2px\] {
    padding: 2px
}

.p-\[3px\] {
    padding: 3px
}

.p-\[7px\] {
    padding: 7px
}

.p-\[10px\] {
    padding: 10px
}

.p-l {
    padding: var(--spacing-l)
}

.p-m {
    padding: var(--spacing-m)
}

.p-s {
    padding: var(--spacing-s)
}

.p-xl {
    padding: var(--spacing-xl)
}

.p-xs {
    padding: var(--spacing-xs)
}

.px-2\.5 {
    padding-inline: calc(var(--spacing)*2.5)
}

.px-2xs {
    padding-inline: var(--spacing-2xs)
}

.px-\[5px\] {
    padding-inline: 5px
}

.px-\[6px\] {
    padding-inline: 6px
}

.px-\[7px\] {
    padding-inline: 7px
}

.px-\[10px\] {
    padding-inline: 10px
}

.px-\[15px\] {
    padding-inline: 15px
}

.px-l {
    padding-inline: var(--spacing-l)
}

.px-m {
    padding-inline: var(--spacing-m)
}

.px-s {
    padding-inline: var(--spacing-s)
}

.px-xl {
    padding-inline: var(--spacing-xl)
}

.px-xs {
    padding-inline: var(--spacing-xs)
}

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

.py-2xs {
    padding-block: var(--spacing-2xs)
}

.py-\[2px\] {
    padding-block: 2px
}

.py-\[3px\] {
    padding-block: 3px
}

.py-\[5px\] {
    padding-block: 5px
}

.py-l {
    padding-block: var(--spacing-l)
}

.py-m {
    padding-block: var(--spacing-m)
}

.py-s {
    padding-block: var(--spacing-s)
}

.py-xl {
    padding-block: var(--spacing-xl)
}

.py-xs {
    padding-block: var(--spacing-xs)
}

.pt-2xs {
    padding-top: var(--spacing-2xs)
}

.pt-s {
    padding-top: var(--spacing-s)
}

.pr-\[3px\] {
    padding-right: 3px
}

.pr-\[5px\] {
    padding-right: 5px
}

.pr-\[7px\] {
    padding-right: 7px
}

.pr-\[10px\] {
    padding-right: 10px
}

.pr-\[15px\] {
    padding-right: 15px
}

.pr-m {
    padding-right: var(--spacing-m)
}

.pr-s {
    padding-right: var(--spacing-s)
}

.pb-2xs {
    padding-bottom: var(--spacing-2xs)
}

.pb-xs {
    padding-bottom: var(--spacing-xs)
}

.pl-\[5px\] {
    padding-left: 5px
}

.pl-\[7px\] {
    padding-left: 7px
}

.pl-\[10px\] {
    padding-left: 10px
}

.pl-\[15px\] {
    padding-left: 15px
}

.pl-m {
    padding-left: var(--spacing-m)
}

.pl-s {
    padding-left: var(--spacing-s)
}

.pl-xs {
    padding-left: var(--spacing-xs)
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-right {
    text-align: right
}

.typo-body-xl {
    font-family: var(--font-fk-grotesk);
    letter-spacing: -.6px;
    color: var(--color-text-primary);
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%
}

.typo-inherit {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit
}

.typo-label-m {
    font-family: var(--font-fk-grotesk-semimono);
    letter-spacing: .52px;
    color: var(--color-text-primary);
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%
}

.typo-label-s {
    font-family: var(--font-fk-grotesk-semimono);
    letter-spacing: .44px;
    color: var(--color-text-primary);
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%
}

.typo-body-2xs {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-3xs {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-4xs {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-l {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-m {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-s {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-body-xs {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.typo-title-l {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 60px;
    font-style: normal;
    font-weight: 300;
    line-height: 110%
}

.typo-title-m {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 48px;
    font-style: normal;
    font-weight: 300;
    line-height: 110%
}

.typo-title-s {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 38px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%
}

.typo-title-xs {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%
}

.text-\[8px\] {
    font-size: 8px
}

.text-\[10px\] {
    font-size: 10px
}

.leading-none {
    --tw-leading: 1;
    line-height: 1
}

.leading-normal {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal)
}

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

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

.text-wrap {
    text-wrap: wrap
}

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

.break-all {
    word-break: break-all
}

.whitespace-nowrap {
    white-space: nowrap
}

.text-constant-active {
    color: var(--color-base-active)
}

.text-constant-error {
    color: var(--lightningcss-light, var(--color-base-light-error))var(--lightningcss-dark, var(--color-base-dark-error))
}

.text-constant-pearl {
    color: var(--color-base-light-pearl)
}

.text-constant-white {
    color: var(--color-base-light-white)
}

.text-constant-white\! {
    color: var(--color-base-light-white) !important
}

.text-constant-yellow {
    color: var(--lightningcss-light, var(--color-base-light-yellow))var(--lightningcss-dark, var(--color-base-dark-yellow))
}

.text-icon-button-disabled {
    color: #fff3
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-button-disabled {
        color: color-mix(in srgb, var(--color-base-light-pearl)20%, transparent)
    }
}

.text-icon-button-primary {
    color: #ffffffe6
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-button-primary {
        color: color-mix(in srgb, var(--color-base-light-pearl)90%, transparent)
    }
}

.text-icon-interactive-error {
    color: var(--lightningcss-light, #c73e59e6)var(--lightningcss-dark, #ff7792e6)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-interactive-error {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)90%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)90%, transparent))
    }
}

.text-icon-interactive-valid {
    color: #39a699e6
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-interactive-valid {
        color: color-mix(in srgb, var(--color-base-valid)90%, transparent)
    }
}

.text-icon-primary {
    color: var(--lightningcss-light, #191d20e6)var(--lightningcss-dark, var(--color-base-dark-pearl))
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-primary {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)90%, transparent))var(--lightningcss-dark, var(--color-base-dark-pearl))
    }
}

.text-icon-secondary {
    color: var(--lightningcss-light, #191d20cc)var(--lightningcss-dark, #fff9)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-secondary {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)80%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)60%, transparent))
    }
}

.text-icon-soft-warning {
    color: var(--lightningcss-light, #f0a224e6)var(--lightningcss-dark, #f0a224e6)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-soft-warning {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-yellow)90%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-yellow)90%, transparent))
    }
}

.text-icon-tertiary {
    color: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #fff6)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-icon-tertiary {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.text-inherit {
    color: inherit
}

.text-text-body {
    color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-body {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
    }
}

.text-text-button-disabled {
    color: var(--lightningcss-light, #ffffff80)var(--lightningcss-dark, #ffffff26)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-button-disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-pearl)50%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)15%, transparent))
    }
}

.text-text-button-primary {
    color: var(--lightningcss-light, var(--color-base-light-pearl))var(--lightningcss-dark, var(--color-base-dark-pearl))
}

.text-text-interactive-active {
    color: #5792fff2
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-interactive-active {
        color: color-mix(in srgb, var(--color-base-active)95%, transparent)
    }
}

.text-text-interactive-disabled {
    color: var(--lightningcss-light, #191d2066)var(--lightningcss-dark, #fff6)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-interactive-disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.text-text-interactive-error {
    color: var(--lightningcss-light, #c73e59f2)var(--lightningcss-dark, #ff7792f2)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-interactive-error {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)95%, transparent))
    }
}

.text-text-interactive-error-disabled {
    color: var(--lightningcss-light, #c73e5959)var(--lightningcss-dark, #ff77924d)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-interactive-error-disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)35%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)30%, transparent))
    }
}

.text-text-interactive-valid {
    color: #39a699f2
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-interactive-valid {
        color: color-mix(in srgb, var(--color-base-valid)95%, transparent)
    }
}

.text-text-primary {
    color: var(--lightningcss-light, var(--color-base-light-vanta))var(--lightningcss-dark, var(--color-base-dark-pearl))
}

.text-text-secondary {
    color: var(--lightningcss-light, #191d20cc)var(--lightningcss-dark, #ffffffb3)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-secondary {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)80%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)70%, transparent))
    }
}

.text-text-tertiary {
    color: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #ffffff80)
}

@supports (color: color-mix(in lab, red, red)) {
    .text-text-tertiary {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)50%, transparent))
    }
}

.capitalize {
    text-transform: capitalize
}

.lowercase {
    text-transform: lowercase
}

.underline {
    text-decoration-line: underline
}

.caret-constant-brand {
    caret-color: var(--color-base-brand)
}

.caret-constant-error {
    caret-color: var(--lightningcss-light, var(--color-base-light-error))var(--lightningcss-dark, var(--color-base-dark-error))
}

.shadow-\[0px_0px_4px_rgba\(255\,255\,255\,0\.8\)\] {
    --tw-shadow: 0px 0px 4px var(--tw-shadow-color, #fffc);
    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_0px_0px_8px_0px_rgba\(255\,255\,255\,0\.65\)\] {
    --tw-shadow: inset 0px 0px 8px 0px var(--tw-shadow-color, #ffffffa6);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-card {
    --tw-shadow: var(--lightningcss-light, 0px 3px 4px 0px #00000017)var(--lightningcss-dark, none);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-dp2 {
    --tw-shadow: 0px -1px 2px 0px var(--tw-shadow-color, #06090b0a), 0px 0px 2px 0px var(--tw-shadow-color, #00000014), 0px 1px 1px 0px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-dp4 {
    --tw-shadow: 0px 3px 4px 0px var(--tw-shadow-color, #00000017);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.shadow-dp8 {
    --tw-shadow: 0px 1px 10px 0px var(--tw-shadow-color, #0000000a), 0px 8px 12px 0px var(--tw-shadow-color, #06090b0d), 0px 4px 8px 0px var(--tw-shadow-color, #00000012);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.ring {
    --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)
}

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

.outline-border-interactive-active {
    outline-color: #2973ffa6
}

@supports (color: color-mix(in lab, red, red)) {
    .outline-border-interactive-active {
        outline-color: color-mix(in srgb, var(--color-base-brand)65%, transparent)
    }
}

.blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.blur-\[7px\] {
    --tw-blur: blur(7px);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.grayscale {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.filter {
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.backdrop-blur-\[8px\] {
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
}

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

.transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.transition-\[background-color\] {
    transition-property: background-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

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

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

.transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration))
}

.duration-150 {
    --tw-duration: .15s;
    transition-duration: .15s
}

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

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

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

.ease-linear {
    --tw-ease: linear;
    transition-timing-function: linear
}

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

.will-change-transform {
    will-change: transform
}

.outline-none {
    --tw-outline-style: none;
    outline-style: none
}

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

.\[perspective\:1000px\] {
    perspective: 1000px
}

.\[text-shadow\: rgba\(50\,49\,73\,0\.55\)_0px_0px_2px\] {
    text-shadow: 0 0 2px #3231498c
}

.\[transform-style\: preserve-3d\] {
    transform-style: preserve-3d
}

.backface-hidden {
    backface-visibility: hidden
}

@media (hover: hover) {
    .group-hover\:text-text-body:is(:where(.group):hover *) {
        color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
    }

    @supports (color: color-mix(in lab, red, red)) {
        .group-hover\:text-text-body:is(:where(.group):hover *) {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
        }
    }
}

.placeholder\: typo-body-2xs::placeholder {
    font-family: var(--font-fk-grotesk);
    color: var(--color-text-primary);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.placeholder\: leading-none::placeholder {
    --tw-leading: 1;
    line-height: 1
}

.placeholder\: text-text-interactive-disabled::placeholder {
    color: var(--lightningcss-light, #191d2066)var(--lightningcss-dark, #fff6)
}

@supports (color: color-mix(in lab, red, red)) {
    .placeholder\:text-text-interactive-disabled::placeholder {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.placeholder\: text-text-tertiary::placeholder {
    color: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #ffffff80)
}

@supports (color: color-mix(in lab, red, red)) {
    .placeholder\:text-text-tertiary::placeholder {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)50%, transparent))
    }
}

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

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

.before\: -left-full:before {
    content: var(--tw-content);
    left: -100%
}

.before\: h-full:before {
    content: var(--tw-content);
    height: 100%
}

.before\: bg-inherit:before {
    content: var(--tw-content);
    background-color: inherit
}

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

@media (hover:hover) {
    .hover\:scale-\[1\.2\]:hover {
        scale: 1.2
    }

    .hover\:transform-none:hover {
        transform: none
    }

    .hover\:bg-bg-button-delete-default:hover {
        background-color: var(--lightningcss-light, #c73e5933)var(--lightningcss-dark, #ff779214)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-button-delete-default:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)8%, transparent))
        }
    }

    .hover\:bg-bg-button-delete-hover:hover {
        background-color: var(--lightningcss-light, #c73e593b)var(--lightningcss-dark, #ff77921f)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-button-delete-hover:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)23%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)12%, transparent))
        }
    }

    .hover\:bg-bg-button-disabled:hover {
        background-color: var(--lightningcss-light, #2973ff66)var(--lightningcss-dark, #2973ff26)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-button-disabled:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)15%, transparent))
        }
    }

    .hover\:bg-bg-button-hover:hover {
        background-color: var(--lightningcss-light, #2973ffeb)var(--lightningcss-dark, #2973fff2)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-button-hover:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)92%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)95%, transparent))
        }
    }

    .hover\:bg-bg-button-progress:hover {
        background-color: #2973ffbf
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-button-progress:hover {
            background-color: color-mix(in srgb, var(--color-base-brand)75%, transparent)
        }
    }

    .hover\:bg-bg-interactive-hover:hover {
        background-color: var(--lightningcss-light, #191d2021)var(--lightningcss-dark, #fafafa21)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-interactive-hover:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)13%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)13%, transparent))
        }
    }

    .hover\:bg-bg-primary:hover {
        background-color: var(--lightningcss-light, #191d2014)var(--lightningcss-dark, #fafafa1a)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-primary:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)8%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)10%, transparent))
        }
    }

    .hover\:bg-bg-secondary:hover {
        background-color: var(--lightningcss-light, #191d200f)var(--lightningcss-dark, #fafafa14)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-secondary:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)6%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)8%, transparent))
        }
    }

    .hover\:bg-bg-tertiary:hover {
        background-color: var(--lightningcss-light, #191d200d)var(--lightningcss-dark, #fafafa0d)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:bg-bg-tertiary:hover {
            background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)5%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)5%, transparent))
        }
    }

    .hover\:bg-constant-dark:hover {
        background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
    }

    .hover\:bg-constant-gray:hover {
        background-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-gray))
    }

    .hover\:bg-transparent:hover {
        background-color: #0000
    }

    .hover\:text-constant-brand:hover {
        color: var(--color-base-brand)
    }

    .hover\:text-icon-button-disabled:hover {
        color: #fff3
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-icon-button-disabled:hover {
            color: color-mix(in srgb, var(--color-base-light-pearl)20%, transparent)
        }
    }

    .hover\:text-icon-button-primary:hover {
        color: #ffffffe6
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-icon-button-primary:hover {
            color: color-mix(in srgb, var(--color-base-light-pearl)90%, transparent)
        }
    }

    .hover\:text-icon-primary:hover {
        color: var(--lightningcss-light, #191d20e6)var(--lightningcss-dark, var(--color-base-dark-pearl))
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-icon-primary:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)90%, transparent))var(--lightningcss-dark, var(--color-base-dark-pearl))
        }
    }

    .hover\:text-icon-tertiary:hover {
        color: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #fff6)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-icon-tertiary:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
        }
    }

    .hover\:text-text-body:hover {
        color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-text-body:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
        }
    }

    .hover\:text-text-button-disabled:hover {
        color: var(--lightningcss-light, #ffffff80)var(--lightningcss-dark, #ffffff26)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-text-button-disabled:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-pearl)50%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)15%, transparent))
        }
    }

    .hover\:text-text-button-primary:hover {
        color: var(--lightningcss-light, var(--color-base-light-pearl))var(--lightningcss-dark, var(--color-base-dark-pearl))
    }

    .hover\:text-text-interactive-disabled:hover {
        color: var(--lightningcss-light, #191d2066)var(--lightningcss-dark, #fff6)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-text-interactive-disabled:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
        }
    }

    .hover\:text-text-interactive-error:hover {
        color: var(--lightningcss-light, #c73e59f2)var(--lightningcss-dark, #ff7792f2)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-text-interactive-error:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)95%, transparent))
        }
    }

    .hover\:text-text-interactive-error-disabled:hover {
        color: var(--lightningcss-light, #c73e5959)var(--lightningcss-dark, #ff77924d)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .hover\:text-text-interactive-error-disabled:hover {
            color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)35%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)30%, transparent))
        }
    }
}

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

.focus-visible\:bg-bg-button-default:focus-visible {
    background-color: var(--lightningcss-light, #2973ffd9)var(--lightningcss-dark, var(--color-base-brand))
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:bg-bg-button-default:focus-visible {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)85%, transparent))var(--lightningcss-dark, var(--color-base-brand))
    }
}

.focus-visible\:bg-bg-button-delete-hover:focus-visible {
    background-color: var(--lightningcss-light, #c73e593b)var(--lightningcss-dark, #ff77921f)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:bg-bg-button-delete-hover:focus-visible {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)23%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)12%, transparent))
    }
}

.focus-visible\:bg-bg-button-progress:focus-visible {
    background-color: #2973ffbf
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:bg-bg-button-progress:focus-visible {
        background-color: color-mix(in srgb, var(--color-base-brand)75%, transparent)
    }
}

.focus-visible\:bg-bg-interactive-pressed:focus-visible {
    background-color: var(--lightningcss-light, #191d2026)var(--lightningcss-dark, #fafafa26)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:bg-bg-interactive-pressed:focus-visible {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)15%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
    }
}

.focus-visible\:bg-constant-dark:focus-visible {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.focus-visible\:text-text-body:focus-visible {
    color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:text-text-body:focus-visible {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
    }
}

.focus-visible\:text-text-button-primary:focus-visible {
    color: var(--lightningcss-light, var(--color-base-light-pearl))var(--lightningcss-dark, var(--color-base-dark-pearl))
}

.focus-visible\:text-text-interactive-error:focus-visible {
    color: var(--lightningcss-light, #c73e59f2)var(--lightningcss-dark, #ff7792f2)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:text-text-interactive-error:focus-visible {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)95%, transparent))
    }
}

.focus-visible\:outline-2:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 2px
}

.focus-visible\:outline-bg-button-disabled:focus-visible {
    outline-color: var(--lightningcss-light, #2973ff66)var(--lightningcss-dark, #2973ff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:outline-bg-button-disabled:focus-visible {
        outline-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)15%, transparent))
    }
}

.focus-visible\:outline-border-interactive-focus:focus-visible {
    outline-color: var(--lightningcss-light, #191d204d)var(--lightningcss-dark, #ffffff40)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:outline-border-interactive-focus:focus-visible {
        outline-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)30%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)25%, transparent))
    }
}

.focus-visible\:outline-border-interactive-selected:focus-visible {
    outline-color: var(--lightningcss-light, #191d204d)var(--lightningcss-dark, #ffffff40)
}

@supports (color:color-mix(in lab, red, red)) {
    .focus-visible\:outline-border-interactive-selected:focus-visible {
        outline-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)30%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)25%, transparent))
    }
}

.focus-visible\:outline-constant-gray:focus-visible {
    outline-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-gray))
}

.active\:cursor-grabbing:active {
    cursor: grabbing
}

.active\:cursor-not-allowed:active {
    cursor: not-allowed
}

.active\:bg-bg-button-delete-active:active {
    background-color: var(--lightningcss-light, #c73e5942)var(--lightningcss-dark, #ff779226)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-button-delete-active:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)26%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)15%, transparent))
    }
}

.active\:bg-bg-button-delete-default:active {
    background-color: var(--lightningcss-light, #c73e5933)var(--lightningcss-dark, #ff779214)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-button-delete-default:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)8%, transparent))
    }
}

.active\:bg-bg-button-disabled:active {
    background-color: var(--lightningcss-light, #2973ff66)var(--lightningcss-dark, #2973ff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-button-disabled:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)15%, transparent))
    }
}

.active\:bg-bg-button-pressed:active {
    background-color: var(--lightningcss-light, var(--color-base-brand))var(--lightningcss-dark, #2973ffe6)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-button-pressed:active {
        background-color: var(--lightningcss-light, var(--color-base-brand))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)90%, transparent))
    }
}

.active\:bg-bg-button-progress:active {
    background-color: #2973ffbf
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-button-progress:active {
        background-color: color-mix(in srgb, var(--color-base-brand)75%, transparent)
    }
}

.active\:bg-bg-interactive-pressed:active {
    background-color: var(--lightningcss-light, #191d2026)var(--lightningcss-dark, #fafafa26)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-interactive-pressed:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)15%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
    }
}

.active\:bg-bg-interactive-selected:active {
    background-color: var(--lightningcss-light, #191d2012)var(--lightningcss-dark, #fafafa1a)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-interactive-selected:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)7%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)10%, transparent))
    }
}

.active\:bg-bg-primary:active {
    background-color: var(--lightningcss-light, #191d2014)var(--lightningcss-dark, #fafafa1a)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-primary:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)8%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)10%, transparent))
    }
}

.active\:bg-bg-secondary:active {
    background-color: var(--lightningcss-light, #191d200f)var(--lightningcss-dark, #fafafa14)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:bg-bg-secondary:active {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)6%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)8%, transparent))
    }
}

.active\:bg-constant-dark:active {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.active\:bg-transparent:active {
    background-color: #0000
}

.active\:text-icon-button-primary:active {
    color: #ffffffe6
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-icon-button-primary:active {
        color: color-mix(in srgb, var(--color-base-light-pearl)90%, transparent)
    }
}

.active\:text-icon-primary:active {
    color: var(--lightningcss-light, #191d20e6)var(--lightningcss-dark, var(--color-base-dark-pearl))
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-icon-primary:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)90%, transparent))var(--lightningcss-dark, var(--color-base-dark-pearl))
    }
}

.active\:text-icon-secondary:active {
    color: var(--lightningcss-light, #191d20cc)var(--lightningcss-dark, #fff9)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-icon-secondary:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)80%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)60%, transparent))
    }
}

.active\:text-icon-tertiary:active {
    color: var(--lightningcss-light, #191d20a6)var(--lightningcss-dark, #fff6)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-icon-tertiary:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)65%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.active\:text-text-body:active {
    color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-text-body:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
    }
}

.active\:text-text-button-disabled:active {
    color: var(--lightningcss-light, #ffffff80)var(--lightningcss-dark, #ffffff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-text-button-disabled:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-pearl)50%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)15%, transparent))
    }
}

.active\:text-text-button-primary:active {
    color: var(--lightningcss-light, var(--color-base-light-pearl))var(--lightningcss-dark, var(--color-base-dark-pearl))
}

.active\:text-text-interactive-disabled:active {
    color: var(--lightningcss-light, #191d2066)var(--lightningcss-dark, #fff6)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-text-interactive-disabled:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.active\:text-text-interactive-error:active {
    color: var(--lightningcss-light, #c73e59f2)var(--lightningcss-dark, #ff7792f2)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-text-interactive-error:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)95%, transparent))
    }
}

.active\:text-text-interactive-error-disabled:active {
    color: var(--lightningcss-light, #c73e5959)var(--lightningcss-dark, #ff77924d)
}

@supports (color:color-mix(in lab, red, red)) {
    .active\:text-text-interactive-error-disabled:active {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)35%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)30%, transparent))
    }
}

.disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed
}

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

.disabled\:border-constant-gray:disabled {
    border-color: var(--lightningcss-light, var(--color-base-light-gray))var(--lightningcss-dark, var(--color-base-dark-gray))
}

.disabled\:bg-bg-button-delete-disabled:disabled {
    background-color: var(--lightningcss-light, #c73e5908)var(--lightningcss-dark, #ff779208)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:bg-bg-button-delete-disabled:disabled {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)3%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)3%, transparent))
    }
}

.disabled\:bg-bg-button-disabled:disabled {
    background-color: var(--lightningcss-light, #2973ff66)var(--lightningcss-dark, #2973ff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:bg-bg-button-disabled:disabled {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-brand)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-brand)15%, transparent))
    }
}

.disabled\:bg-bg-interactive-disabled:disabled {
    background-color: var(--lightningcss-light, #191d200a)var(--lightningcss-dark, #fafafa08)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:bg-bg-interactive-disabled:disabled {
        background-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)4%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)3%, transparent))
    }
}

.disabled\:bg-constant-dark:disabled {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.disabled\:bg-transparent:disabled {
    background-color: #0000
}

.disabled\:text-icon-button-disabled:disabled {
    color: #fff3
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:text-icon-button-disabled:disabled {
        color: color-mix(in srgb, var(--color-base-light-pearl)20%, transparent)
    }
}

.disabled\:text-icon-interactive-disabled:disabled {
    color: var(--lightningcss-light, #191d2040)var(--lightningcss-dark, #ffffff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:text-icon-interactive-disabled:disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)25%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)15%, transparent))
    }
}

.disabled\:text-text-button-disabled:disabled {
    color: var(--lightningcss-light, #ffffff80)var(--lightningcss-dark, #ffffff26)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:text-text-button-disabled:disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-pearl)50%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)15%, transparent))
    }
}

.disabled\:text-text-interactive-disabled:disabled {
    color: var(--lightningcss-light, #191d2066)var(--lightningcss-dark, #fff6)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:text-text-interactive-disabled:disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)40%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)40%, transparent))
    }
}

.disabled\:text-text-interactive-error-disabled:disabled {
    color: var(--lightningcss-light, #c73e5959)var(--lightningcss-dark, #ff77924d)
}

@supports (color:color-mix(in lab, red, red)) {
    .disabled\:text-text-interactive-error-disabled:disabled {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-error)35%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-error)30%, transparent))
    }
}

.disabled\:opacity-100:disabled {
    opacity: 1
}

.data-\[disabled\]\:cursor-not-allowed[data-disabled] {
    cursor: not-allowed
}

.data-\[disabled\]\:opacity-50[data-disabled] {
    opacity: .5
}

.data-\[highlighted\]\:bg-constant-dark[data-highlighted] {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.data-\[highlighted\]\:text-text-body[data-highlighted] {
    color: var(--lightningcss-light, #191d20f2)var(--lightningcss-dark, #fffffff2)
}

@supports (color:color-mix(in lab, red, red)) {
    .data-\[highlighted\]\:text-text-body[data-highlighted] {
        color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)95%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-pearl)95%, transparent))
    }
}

.data-\[selected\=true\]\:bg-constant-dark[data-selected=true] {
    background-color: var(--lightningcss-light, var(--color-base-light-dark))var(--lightningcss-dark, var(--color-base-dark-dark))
}

.data-\[state\=delayed-open\]\:data-\[side\=bottom\]\:animate-slide-down-and-fade[data-state=delayed-open][data-side=bottom] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-down-and-fade
}

.data-\[state\=delayed-open\]\:data-\[side\=left\]\:animate-slide-right-and-fade[data-state=delayed-open][data-side=left] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-right-and-fade
}

.data-\[state\=delayed-open\]\:data-\[side\=right\]\:animate-slide-left-and-fade[data-state=delayed-open][data-side=right] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-left-and-fade
}

.data-\[state\=delayed-open\]\:data-\[side\=top\]\:animate-slide-up-and-fade[data-state=delayed-open][data-side=top] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-up-and-fade
}

.data-\[state\=open\]\:animate-slide-down-and-fade[data-state=open] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-down-and-fade
}

.data-\[state\=open\]\:animate-toast-slide-in[data-state=open] {
    animation: .5s cubic-bezier(.16, 1, .3, 1) toast-slide-in
}

.data-\[state\=open\]\:data-\[side\=bottom\]\:animate-slide-down-and-fade[data-state=open][data-side=bottom] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-down-and-fade
}

.data-\[state\=open\]\:data-\[side\=left\]\:animate-slide-right-and-fade[data-state=open][data-side=left] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-right-and-fade
}

.data-\[state\=open\]\:data-\[side\=right\]\:animate-slide-left-and-fade[data-state=open][data-side=right] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-left-and-fade
}

.data-\[state\=open\]\:data-\[side\=top\]\:animate-slide-up-and-fade[data-state=open][data-side=top] {
    animation: .3s cubic-bezier(.16, 1, .3, 1) slide-up-and-fade
}

@media not all and (min-width:1189px) {
    .max-content-l\:gap-l {
        gap: var(--spacing-l)
    }
}

@media not all and (min-width:1024px) {
    .max-md\:flex {
        display: flex
    }

    .max-md\:w-\[calc\(100vw-40px\)\] {
        width: calc(100vw - 40px)
    }

    .max-md\:gap-\[18px\] {
        gap: 18px
    }
}

@media not all and (min-width:1004px) {
    .max-content-m\:flex-col {
        flex-direction: column
    }

    .max-content-m\:justify-between {
        justify-content: space-between
    }

    .max-content-m\:gap-0 {
        gap: calc(var(--spacing)*0)
    }
}

@media not all and (min-width:768px) {
    .max-sm\:-top-\[5px\] {
        top: -5px
    }

    .max-sm\:-right-\[5px\] {
        right: -5px
    }

    .max-sm\:mx-\[calc\(\(var\(--radix-popover-content-available-width\)-70vw\)\/2\)\] {
        margin-inline: calc((var(--radix-popover-content-available-width) - 70vw)/2)
    }

    .max-sm\:w-\[70vw\] {
        width: 70vw
    }

    .max-sm\:max-w-\[180px\] {
        max-width: 180px
    }

    .max-sm\:overflow-hidden {
        overflow: hidden
    }

    .max-sm\:text-ellipsis {
        text-overflow: ellipsis
    }

    .max-sm\:whitespace-nowrap {
        white-space: nowrap
    }
}

@media not all and (min-width:576px) {
    .max-xs\:w-\[var\(--radix-popover-content-available-width\)\] {
        width: var(--radix-popover-content-available-width)
    }
}

@media (min-width:768px) {
    .sm\:mt-0 {
        margin-top: calc(var(--spacing)*0)
    }

    .sm\:block {
        display: block
    }

    .sm\:hidden {
        display: none
    }

    .sm\:inline {
        display: inline
    }

    .sm\:inline-flex {
        display: inline-flex
    }

    .sm\:max-h-\[calc\(50svh-var\(--spacing-s\)\)\] {
        max-height: calc(50svh - var(--spacing-s))
    }

    .sm\:flex-row {
        flex-direction: row
    }

    .sm\:gap-s {
        gap: var(--spacing-s)
    }

    .sm\:gap-xl {
        gap: var(--spacing-xl)
    }

    @media not all and (min-width:1024px) {
        .sm\:max-md\:inset-0 {
            inset: calc(var(--spacing)*0)
        }

        .sm\:max-md\:h-auto {
            height: auto
        }

        .sm\:max-md\:max-h-none {
            max-height: none
        }

        .sm\:max-md\:w-\[calc\(100vw-20px\)\] {
            width: calc(100vw - 20px)
        }

        .sm\:max-md\:w-auto {
            width: auto
        }

        .sm\:max-md\:max-w-none {
            max-width: none
        }

        .sm\:max-md\:translate-x-0 {
            --tw-translate-x: calc(var(--spacing)*0);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .sm\:max-md\:translate-y-0 {
            --tw-translate-y: calc(var(--spacing)*0);
            translate: var(--tw-translate-x)var(--tw-translate-y)
        }

        .sm\:max-md\:animate-dialog-in-full-size {
            animation: .3s cubic-bezier(.16, 1, .3, 1) dialog-in-full-size
        }

        .sm\:max-md\:rounded-none {
            border-radius: 0
        }
    }
}

@media (min-width:1004px) {
    .content-m\:size-22 {
        width: calc(var(--spacing)*22);
        height: calc(var(--spacing)*22)
    }

    .content-m\:px-6 {
        padding-inline: calc(var(--spacing)*6)
    }
}

@media (min-width:1024px) {
    .md\:flex {
        display: flex
    }

    .md\:hidden {
        display: none
    }

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

@media (prefers-color-scheme:dark) {
    .dark\:block:where(:not(.light, .light *)) {
        display: block
    }
}

.dark\:block:where(.dark, .dark *) {
    display: block
}

@media (prefers-color-scheme:dark) {
    .dark\:hidden:where(:not(.light, .light *)) {
        display: none
    }
}

.dark\:hidden:where(.dark, .dark *) {
    display: none
}

@media (prefers-color-scheme:light) {
    .light\:block:where(:not(.dark, .dark *)) {
        display: block
    }
}

.light\:block:where(.light, .light *) {
    display: block
}

@media (prefers-color-scheme:light) {
    .light\:hidden:where(:not(.dark, .dark *)) {
        display: none
    }
}

.light\:hidden:where(.light, .light *) {
    display: none
}

@media (prefers-color-scheme:light) {
    .light\:border-hairline:where(:not(.dark, .dark *)) {
        border-style: solid;
        border-width: var(--v6-hairline)
    }
}

.light\:border-hairline:where(.light, .light *) {
    border-style: solid;
    border-width: var(--v6-hairline)
}

@media (prefers-color-scheme:light) {
    .light\:border-border-primary:where(:not(.dark, .dark *)) {
        border-color: var(--lightningcss-light, #191d2033)var(--lightningcss-dark, #fafafa26)
    }

    @supports (color:color-mix(in lab, red, red)) {
        .light\:border-border-primary:where(:not(.dark, .dark *)) {
            border-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
        }
    }
}

.light\:border-border-primary:where(.light, .light *) {
    border-color: var(--lightningcss-light, #191d2033)var(--lightningcss-dark, #fafafa26)
}

@supports (color:color-mix(in lab, red, red)) {
    .light\:border-border-primary:where(.light, .light *) {
        border-color: var(--lightningcss-light, color-mix(in srgb, var(--color-base-light-black)20%, transparent))var(--lightningcss-dark, color-mix(in srgb, var(--color-base-dark-white)15%, transparent))
    }
}

.\[\&_\[data-radix-popper-content-wrapper\]\]\:\!relative [data-radix-popper-content-wrapper] {
    position: relative !important
}

.\[\&_\[data-radix-popper-content-wrapper\]\]\:\!transform-none [data-radix-popper-content-wrapper] {
    transform: none !important
}

.\[\&_\[data-radix-popper-content-wrapper\]\]\:\!will-change-auto [data-radix-popper-content-wrapper] {
    will-change: auto !important
}

.\[\&\>\*\]\:size-full>* {
    width: 100%;
    height: 100%
}

.\[\&\>\*\]\:w-full>* {
    width: 100%
}

.\[\&\>\*\]\:shrink>* {
    flex-shrink: 1
}

:root {
    --v6-hairline: 1px
}

@media (-webkit-min-device-pixel-ratio:2) {
    :root {
        --v6-hairline: .5px
    }
}

@media (-webkit-min-device-pixel-ratio:3) {
    :root {
        --v6-hairline: .7px
    }
}

@media (max-width:1208px) {
    :root {
        --bundler-width: 360px;
        --bundler-position: 360px
    }
}

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

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

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

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

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

    to {
        opacity: 1;
        transform: translate(0)
    }
}

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

    to {
        opacity: 1;
        transform: translate(0)
    }
}

@keyframes toast-slide-in {
    0% {
        transform: translateY(calc(-100% - 100px))
    }

    to {
        transform: translateY(0)
    }
}

@keyframes skeleton-wave {
    0% {
        transform: translate(-100%)
    }

    50% {
        transform: translate(0%)
    }

    to {
        transform: translate(100%)
    }
}

@keyframes v2badge-rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(-360deg)
    }
}

@keyframes v2badge-pulse {

    0%,
    to {
        transform: scale(1)
    }

    50% {
        transform: scale(1.5)
    }
}

@keyframes v2badge-shine {
    0% {
        transform: skew(20deg)translate(-300%)
    }

    to {
        transform: skew(20deg)translate(300%)
    }
}

@keyframes dialog-in {
    0% {
        opacity: 0;
        scale: .96
    }

    to {
        opacity: 1;
        scale: 1
    }
}

@keyframes dialog-in-full-size {
    0% {
        opacity: 0;
        transform: scale(.95)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes bounce-from-left {
    0% {
        opacity: 0;
        transform: translate(-10px)
    }

    60% {
        transform: translate(3px)
    }

    80% {
        transform: translate(-1px)
    }

    to {
        opacity: 1;
        transform: translate(0)
    }
}

:root {
    --lightningcss-light: initial;
    --lightningcss-dark: ;
    color-scheme: light
}

@media (prefers-color-scheme:dark) {
    :root:not(.light) {
        --lightningcss-light: ;
        --lightningcss-dark: initial;
        color-scheme: dark
    }
}

.dark {
    --lightningcss-light: ;
    --lightningcss-dark: initial;
    color-scheme: dark
}

.light {
    --lightningcss-light: initial;
    --lightningcss-dark: ;
    color-scheme: light
}

:root {
    --font-fk-grotesk: "FK Grotesk", sans-serif;
    --font-fk-grotesk-semimono: "FK Grotesk SemiMono", sans-serif
}

html,
body {
    font-display: block;
    background-color: var(--colors-background-base);
    font-family: sans-serif
}

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

main {
    min-height: 100vh
}

@media (max-width:768px) {
    main {
        min-height: 100svh
    }
}

@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-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-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@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-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*# sourceMappingURL=6a4b6836a699456c.css.map*/