body {
    --max-width: 820px;
    --max-width-wide-page: 960px;
    --max-width-extra-wide-page: 1080px;
    --horizontal-padding: 1rem;
    --small-border-radius: 0.25rem;
    --border-radius: 0.5rem;
    --large-border-radius: 1rem;
    --modal-border-radius: var(--large-border-radius);
    --card-border-radius: 0.75rem;
    --content-card-vertical-padding: 1rem;
    --content-card-horizontal-padding: 1.125rem;
    --event-row-padding: 0.75rem 1rem;
    --event-row-leading-padding: 1rem;
    --event-row-margin: 0;
    --event-row-border-radius: 0;
    --chat-z-index: 900;
    --overlay-z-index: 1000;
    --base-list-row-vertical-padding: 0.75rem;
    --base-list-row-horizontal-padding: 1rem;
    --base-list-row-default-padding: var(--base-list-row-vertical-padding) var(--base-list-row-horizontal-padding);
    --base-list-divider-left-offset: 0;
    --dt-left-border-radius: var(--border-radius);
    --dt-right-border-radius: var(--border-radius)
}

@media(max-width: 450px) {
    body {
        --base-list-row-vertical-padding:0.6875rem;
        --base-list-row-horizontal-padding: 0.875rem
    }
}

.theme-root,.tint-root {
    --white: #fff;
    --gray-10: #f4f5f6;
    --gray-20: #ebeced;
    --gray-30: #dee0e2;
    --gray-40: #d2d4d7;
    --gray-50: #b3b5b7;
    --gray-60: #939597;
    --gray-70: #737577;
    --gray-80: #535557;
    --gray-90: #333537;
    --gray-100: #212325;
    --gray-100-base-rgb: 33,35,37;
    --black-base-rgb: 19,21,23;
    --black: rgb(var(--black-base-rgb));
    --pure-black: #000;
    --white-transparent: #ffffff00;
    --gray-10-transparent: #f4f5f600;
    --gray-20-transparent: #ebeced00;
    --gray-30-transparent: #dee0e200;
    --gray-40-transparent: #d2d4d700;
    --gray-50-transparent: #b3b5b700;
    --gray-80-transparent: #53555700;
    --gray-90-transparent: #33353700;
    --gray-100-transparent: #21232500;
    --black-transparent: rgba(var(--black-base-rgb),0);
    --gray-10-thick-translucent: #f4f5f6cc;
    --gray-20-translucent: #eaecee40;
    --gray-100-thick-translucent: #212325cc;
    --white-translucent: #ffffff40;
    --white-thick-translucent: #fffd;
    --black-translucent: rgba(var(--black-base-rgb),0.25);
    --black-thick-translucent: rgba(var(--black-base-rgb),0.8);
    --darker-pale-gray: #93959744;
    --pale-gray: #93959722;
    --faint-gray: #93959711;
    --pale-white: #fff2;
    --half-white: #fff9;
    --half-gray: #b3b5b799;
    --half-black: #0009;
    --cranberry-5: #fef4f9;
    --cranberry-10: #fde2ef;
    --cranberry-20: #fcc6de;
    --cranberry-30: #f98dbe;
    --cranberry-40: #f6539d;
    --cranberry-50: #f31a7c;
    --cranberry-60: #d5176d;
    --cranberry-70: #b6145d;
    --cranberry-80: #98104e;
    --cranberry-90: #790d3e;
    --pale-cranberry: #f31a7c22;
    --faint-cranberry: #f31a7c11;
    --barney-5: #faeeff;
    --barney-10: #f0d3ff;
    --barney-20: #e1a8fe;
    --barney-30: #d27cfe;
    --barney-40: #c350fd;
    --barney-50: #ab46dd;
    --barney-60: #923cbe;
    --barney-70: #7a329e;
    --barney-80: #62287f;
    --barney-90: #491e5f;
    --pale-barney: #ab46dd22;
    --faint-barney: #ab46dd11;
    --purple-5: #f4f3fe;
    --purple-10: #e3defd;
    --purple-20: #d4c4ff;
    --purple-30: #b596ff;
    --purple-40: #7b49ff;
    --purple-50: #682fff;
    --purple-60: #5b29df;
    --purple-70: #4b23bf;
    --purple-80: #2f1880;
    --purple-90: #231260;
    --pale-purple: #682fff22;
    --faint-purple: #682fff11;
    --blue-5: #eff5ff;
    --blue-10: #d4e5ff;
    --blue-20: #b6d3ff;
    --blue-30: #76adff;
    --blue-40: #287eff;
    --blue-50: #146aeb;
    --blue-60: #125dce;
    --blue-70: #0546a6;
    --blue-80: #033889;
    --blue-90: #002b6b;
    --pale-blue: #325ffa22;
    --faint-blue: #324ffa11;
    --transparent-blue: #325ffa00;
    --chat-blue: #287eff;
    --pale-chat-blue: #287effcc;
    --faint-chat-blue: #287eff55;
    --green-5: #e7f7e5;
    --green-10: #ccf0c7;
    --green-20: #99e290;
    --green-30: #77d86b;
    --green-40: #54c546;
    --green-50: #3cbd2c;
    --green-60: #35a527;
    --green-70: #2d8e21;
    --green-80: #25761b;
    --green-90: #14550c;
    --darker-pale-green: #3cbd2c44;
    --pale-green: #3cbd2c22;
    --faint-green: #3cbd2c11;
    --yellow-5: #fcf4e4;
    --yellow-10: #faeac9;
    --yellow-20: #f7dfae;
    --yellow-30: #f2ca77;
    --yellow-40: #edb541;
    --yellow-50: #eaab26;
    --yellow-60: #d69712;
    --yellow-70: #b98a27;
    --yellow-80: #926b18;
    --yellow-90: #755513;
    --pale-yellow: #d6971222;
    --faint-yellow: #d6971211;
    --orange-5: #feede4;
    --orange-10: #fddbca;
    --orange-20: #fccaaf;
    --orange-30: #fba67a;
    --orange-40: #f98346;
    --orange-50: #f8712b;
    --orange-60: #d96326;
    --orange-70: #ba5520;
    --orange-80: #9b471b;
    --orange-90: #722e0b;
    --pale-orange: #d9632622;
    --faint-orange: #d9632611;
    --red-5: #ffeeef;
    --red-10: #fde4e5;
    --red-20: #f8afb2;
    --red-30: #ff766d;
    --red-40: #f9524e;
    --red-50: #ed2b32;
    --red-60: #cf2c31;
    --red-70: #b1262a;
    --red-80: #93080c;
    --red-90: #750000;
    --darker-pale-red: #ed2b3244;
    --pale-red: #ed2b3222;
    --faint-red: #ed2b3211;
    --half-red: #ed2b3277;
    --black-opacity-0: rgba(var(--black-base-rgb),0);
    --black-opacity-2: rgba(var(--black-base-rgb),0.02);
    --black-opacity-4: rgba(var(--black-base-rgb),0.04);
    --black-opacity-8: rgba(var(--black-base-rgb),0.08);
    --black-opacity-16: rgba(var(--black-base-rgb),0.16);
    --black-opacity-24: rgba(var(--black-base-rgb),0.24);
    --black-opacity-32: rgba(var(--black-base-rgb),0.32);
    --black-opacity-48: rgba(var(--black-base-rgb),0.48);
    --black-opacity-64: rgba(var(--black-base-rgb),0.64);
    --black-opacity-80: rgba(var(--black-base-rgb),0.8);
    --white-base-rgb: 255,255,255;
    --white-opacity-0: rgba(var(--white-base-rgb),0);
    --white-opacity-2: rgba(var(--white-base-rgb),0.02);
    --white-opacity-4: rgba(var(--white-base-rgb),0.04);
    --white-opacity-8: rgba(var(--white-base-rgb),0.08);
    --white-opacity-16: rgba(var(--white-base-rgb),0.16);
    --white-opacity-24: rgba(var(--white-base-rgb),0.24);
    --white-opacity-32: rgba(var(--white-base-rgb),0.32);
    --white-opacity-48: rgba(var(--white-base-rgb),0.48);
    --white-opacity-64: rgba(var(--white-base-rgb),0.64);
    --white-opacity-80: rgba(var(--white-base-rgb),0.8);
    --default-gradient: linear-gradient(-45deg,#8a18a8,#ce2756 51.59%,#cf2a55 51.6%,#e7a90d 100.05%);
    --pure-black-or-white: var(--pure-black);
    --outline-color: -webkit-focus-ring-color
}

.theme-root,.theme-root.dark .tint-root.light,.tint-root {
    --gray: var(--gray-60);
    --gray-content: var(--gray-60);
    --gray-active: var(--gray-70);
    --gray-background: var(--gray-60);
    --gray-background-active: var(--gray-70);
    --barney: var(--barney-50);
    --barney-content: var(--barney-50);
    --barney-active: var(--barney-60);
    --barney-background: var(--barney-50);
    --barney-background-active: var(--barney-60);
    --blue: var(--blue-50);
    --blue-content: var(--blue-50);
    --blue-active: var(--blue-60);
    --blue-background: var(--blue-50);
    --blue-background-active: var(--blue-60);
    --cranberry: var(--cranberry-50);
    --cranberry-content: var(--cranberry-50);
    --cranberry-active: var(--cranberry-60);
    --cranberry-background: var(--cranberry-50);
    --cranberry-background-active: var(--cranberry-60);
    --green: var(--green-50);
    --green-content: var(--green-50);
    --green-active: var(--green-60);
    --green-background: var(--green-50);
    --green-background-active: var(--green-60);
    --orange: var(--orange-50);
    --orange-content: var(--orange-50);
    --orange-active: var(--orange-60);
    --orange-background: var(--orange-50);
    --orange-background-active: var(--orange-60);
    --purple: var(--purple-50);
    --purple-content: var(--purple-50);
    --purple-active: var(--purple-60);
    --purple-background: var(--purple-50);
    --purple-background-active: var(--purple-60);
    --red: var(--red-50);
    --red-content: var(--red-50);
    --red-active: var(--red-60);
    --red-background: var(--red-50);
    --red-background-active: var(--red-60);
    --yellow: var(--yellow-60);
    --yellow-content: var(--yellow-50);
    --yellow-active: var(--yellow-70);
    --yellow-background: var(--yellow-60);
    --yellow-background-active: var(--yellow-70);
    --brand-color: var(--cranberry);
    --brand-content-color: var(--cranberry-content);
    --brand-bg-color: var(--cranberry-background);
    --brand-active-color: var(--cranberry-active);
    --brand-active-bg-color: var(--cranberry-background-active);
    --brand-pale-bg-color: var(--pale-cranberry);
    --success-color: var(--green);
    --success-content-color: var(--green-content);
    --success-bg-color: var(--green-background);
    --success-active-color: var(--green-active);
    --success-active-bg-color: var(--green-background-active);
    --success-pale-bg-color: var(--pale-green);
    --success-faint-bg-color: var(--faint-green);
    --error-color: var(--red);
    --error-content-color: var(--red-content);
    --error-bg-color: var(--red-background);
    --error-active-color: var(--red-active);
    --error-active-bg-color: var(--red-background-active);
    --error-pale-bg-color: var(--pale-red);
    --error-faint-bg-color: var(--faint-red);
    --warning-color: var(--yellow);
    --warning-content-color: var(--yellow-content);
    --warning-bg-color: var(--yellow-background);
    --warning-active-color: var(--yellow-active);
    --warning-active-bg-color: var(--yellow-background-active);
    --warning-pale-bg-color: var(--pale-yellow);
    --warning-faint-bg-color: var(--faint-yellow);
    --primary-color: var(--black);
    --primary-color-rgb: var(--black-base-rgb);
    --secondary-color: var(--gray-70);
    --secondary-color-alpha: rgba(var(--black-base-rgb),0.64);
    --tertiary-color: var(--gray-50);
    --tertiary-color-alpha: rgba(var(--black-base-rgb),0.36);
    --quaternary-color: var(--gray-30);
    --quaternary-color-alpha: rgba(var(--black-base-rgb),0.2);
    --primary-or-tinted-color: var(--primary-color);
    --primary-bg-color: var(--white);
    --primary-bg-color-rgb: var(--white-base-rgb);
    --primary-bg-color-translucent: var(--white-opacity-64);
    --primary-bg-color-thick-translucent: var(--white-thick-translucent);
    --primary-bg-color-transparent: var(--white-transparent);
    --secondary-bg-color: var(--gray-10);
    --secondary-bg-color-translucent: var(--gray-10-thick-translucent);
    --secondary-bg-color-transparent: var(--gray-10-transparent);
    --tertiary-bg-color: var(--gray-20);
    --quaternary-bg-color: var(--gray-30);
    --elevated-on-secondary-bg-color: var(--primary-bg-color);
    --depressed-secondary-bg-color: var(--secondary-bg-color);
    --elevated-primary-bg-color: var(--primary-bg-color);
    --elevated-secondary-bg-color: var(--secondary-bg-color);
    --elevated-tertiary-bg-color: var(--tertiary-bg-color);
    --nav-bg-color: transparent;
    --translucent-bg-color: #fff8;
    --slight-translucent-bg-color: #fffd;
    --translucent-elevated-bg-color: #fff8;
    --slight-translucent-elevated-bg-color: #fffd;
    --translucent-sheet-bg-color: var(--bg-opacity-48);
    --primary-border-color: var(--gray-40);
    --secondary-border-color: var(--gray-20);
    --active-border-color: var(--black);
    --opacity-0: var(--black-opacity-0);
    --opacity-2: var(--black-opacity-2);
    --opacity-4: var(--black-opacity-4);
    --opacity-8: var(--black-opacity-8);
    --opacity-16: var(--black-opacity-16);
    --opacity-24: var(--black-opacity-24);
    --opacity-32: var(--black-opacity-32);
    --opacity-48: var(--black-opacity-48);
    --opacity-64: var(--black-opacity-64);
    --opacity-80: var(--black-opacity-80);
    --opacity-light: var(--black-opacity-4);
    --opacity-second-light: var(--black-opacity-8);
    --bg-opacity-0: var(--white-opacity-0);
    --bg-opacity-2: var(--white-opacity-2);
    --bg-opacity-4: var(--white-opacity-4);
    --bg-opacity-8: var(--white-opacity-8);
    --bg-opacity-16: var(--white-opacity-16);
    --bg-opacity-24: var(--white-opacity-24);
    --bg-opacity-32: var(--white-opacity-32);
    --bg-opacity-48: var(--white-opacity-48);
    --bg-opacity-64: var(--white-opacity-64);
    --bg-opacity-80: var(--white-opacity-80);
    --bg-opacity-light: var(--white-opacity-4);
    --primary-divider-color: var(--gray-90);
    --secondary-divider-color: var(--gray-50);
    --tertiary-divider-color: var(--opacity-8);
    --primary-divider-color-transparent: var(--gray-90-transparent);
    --secondary-divider-color-transparent: var(--gray-50-transparent);
    --tertiary-divider-color-transparent: var(--opacity-0);
    --overlay-color: var(--half-gray);
    --divider-color: var(--tertiary-divider-color);
    --gradient-divider: linear-gradient(to right,var(--tertiary-divider-color-transparent),var(--tertiary-divider-color) 50%,var(--tertiary-divider-color-transparent));
    --hover-bg-color: var(--pale-gray);
    --disabled-bg-color: var(--gray-20);
    --disabled-bg-color-translucent: var(--gray-20-translucent);
    --toast-default-color: var(--primary-bg-color);
    --unread-badge-bg-color: var(--red-50);
    --unread-badge-border-color: var(--bg-opacity-16);
    --map-tooltip-shadow: 0 6px 16px rgba(30,53,77,.5);
    --map-tooltip-bg-color: #fff9;
    --banner-color: var(--secondary-color);
    --banner-bg-color: var(--opacity-light);
    --banner-border-color: var(--divider-color);
    --event-calendar-border-color: var(--tertiary-bg-color);
    --event-calendar-bg-color: var(--primary-bg-color);
    --event-calendar-month-color: var(--tertiary-color-alpha);
    --event-calendar-month-bg-color: var(--tertiary-bg-color)
}

.theme-root .tint-root.dark,.theme-root.dark,.theme-root.dark .tint-root {
    --gray: var(--gray-40);
    --gray-content: var(--gray-50);
    --gray-active: var(--gray-50);
    --barney: var(--barney-30);
    --barney-content: var(--barney-40);
    --barney-active: var(--barney-40);
    --blue: var(--blue-30);
    --blue-content: var(--blue-40);
    --blue-active: var(--blue-50);
    --cranberry: var(--cranberry-30);
    --cranberry-content: var(--cranberry-40);
    --cranberry-active: var(--cranberry-40);
    --green: var(--green-30);
    --green-content: var(--green-40);
    --green-active: var(--green-40);
    --orange: var(--orange-30);
    --orange-content: var(--orange-40);
    --orange-active: var(--orange-40);
    --purple: var(--purple-30);
    --purple-content: var(--purple-40);
    --purple-active: var(--purple-40);
    --red: var(--red-30);
    --red-content: var(--red-40);
    --red-active: var(--red-40);
    --yellow: var(--yellow-30);
    --yellow-content: var(--yellow-40);
    --yellow-active: var(--yellow-40);
    --brand-color: var(--cranberry);
    --brand-content-color: var(--cranberry-content);
    --brand-active-color: var(--cranberry-active);
    --default-gradient: linear-gradient(-45deg,#d118ff,#f32861 51.59%,#f8245d 51.6%,#ffbe19 100.05%);
    --primary-color: var(--white);
    --primary-color-rgb: var(--white-base-rgb);
    --secondary-color: var(--gray-40);
    --secondary-color-alpha: hsla(0,0%,100%,.79);
    --tertiary-color: var(--gray-60);
    --tertiary-color-alpha: hsla(0,0%,100%,.5);
    --quaternary-color: var(--gray-80);
    --quaternary-color-alpha: hsla(0,0%,100%,.32);
    --primary-bg-color: var(--black);
    --primary-bg-color-rgb: var(--black-base-rgb);
    --primary-bg-color-thick-translucent: var(--black-thick-translucent);
    --primary-bg-color-translucent: var(--black-opacity-64);
    --primary-bg-color-transparent: var(--black-transparent);
    --secondary-bg-color: var(--gray-100);
    --secondary-bg-color-translucent: var(--gray-100-thick-translucent);
    --secondary-bg-color-transparent: var(--gray-100-transparent);
    --tertiary-bg-color: var(--gray-90);
    --quaternary-bg-color: var(--gray-80);
    --elevated-on-secondary-bg-color: var(--opacity-4);
    --depressed-secondary-bg-color: var(--primary-bg-color);
    --elevated-primary-bg-color: var(--secondary-bg-color);
    --elevated-secondary-bg-color: var(--tertiary-bg-color);
    --elevated-tertiary-bg-color: var(--quaternary-bg-color);
    --translucent-bg-color: rgba(var(--black-base-rgb),0.53);
    --slight-translucent-bg-color: rgba(var(--black-base-rgb),0.8);
    --translucent-elevated-bg-color: rgba(var(--gray-100-base-rgb),0.53);
    --slight-translucent-elevated-bg-color: rgba(var(--gray-100-base-rgb),0.8);
    --opacity-0: var(--white-opacity-0);
    --opacity-2: var(--white-opacity-2);
    --opacity-4: var(--white-opacity-4);
    --opacity-8: var(--white-opacity-8);
    --opacity-16: var(--white-opacity-16);
    --opacity-24: var(--white-opacity-24);
    --opacity-32: var(--white-opacity-32);
    --opacity-48: var(--white-opacity-48);
    --opacity-64: var(--white-opacity-64);
    --opacity-80: var(--white-opacity-80);
    --opacity-light: var(--white-opacity-8);
    --opacity-second-light: var(--white-opacity-16);
    --bg-opacity-0: var(--black-opacity-0);
    --bg-opacity-2: var(--black-opacity-2);
    --bg-opacity-4: var(--black-opacity-4);
    --bg-opacity-8: var(--black-opacity-8);
    --bg-opacity-16: var(--black-opacity-16);
    --bg-opacity-24: var(--black-opacity-24);
    --bg-opacity-32: var(--black-opacity-32);
    --bg-opacity-48: var(--black-opacity-48);
    --bg-opacity-64: var(--black-opacity-64);
    --bg-opacity-80: var(--black-opacity-80);
    --bg-opacity-light: var(--black-opacity-8);
    --primary-border-color: var(--gray-60);
    --secondary-border-color: var(--gray-90);
    --active-border-color: var(--white);
    --primary-divider-color: var(--gray-10);
    --secondary-divider-color: var(--gray-60);
    --tertiary-divider-color: var(--opacity-8);
    --primary-divider-color-transparent: var(--gray-10-transparent);
    --secondary-divider-color-transparent: var(--gray-60-transparent);
    --tertiary-divider-color-transparent: var(--gray-100-transparent);
    --overlay-color: var(--half-black);
    --divider-color: var(--tertiary-divider-color);
    --hover-bg-color: var(--pale-gray);
    --disabled-bg-color: var(--gray-80);
    --disabled-bg-color-translucent: var(--gray-80-translucent);
    --pure-black-or-white: var(--white);
    --unread-badge-bg-color: var(--red-40);
    --map-tooltip-shadow: 0 6px 16px rgba(0,0,0,.5);
    --map-tooltip-bg-color: #0009
}

.variant-color-green {
    --variant-color: var(--green);
    --variant-color-content: var(--green-content);
    --variant-color-pale: var(--pale-green);
    --variant-color-faint: var(--faint-green);
    --variant-color-active: var(--green-active);
    --variant-color-bg: var(--green-background);
    --variant-color-bg-active: var(--green-background-active)
}

.variant-color-barney {
    --variant-color: var(--barney);
    --variant-color-content: var(--barney-content);
    --variant-color-pale: var(--pale-barney);
    --variant-color-faint: var(--faint-barney);
    --variant-color-active: var(--barney-active);
    --variant-color-bg: var(--barney-background);
    --variant-color-bg-active: var(--barney-background-active)
}

.variant-color-red {
    --variant-color: var(--red);
    --variant-color-content: var(--red-content);
    --variant-color-pale: var(--pale-red);
    --variant-color-faint: var(--faint-red);
    --variant-color-active: var(--red-active);
    --variant-color-bg: var(--red-background);
    --variant-color-bg-active: var(--red-background-active)
}

.variant-color-cranberry {
    --variant-color: var(--cranberry);
    --variant-color-content: var(--cranberry-content);
    --variant-color-pale: var(--pale-cranberry);
    --variant-color-faint: var(--faint-cranberry);
    --variant-color-active: var(--cranberry-active);
    --variant-color-bg: var(--cranberry-background);
    --variant-color-bg-active: var(--cranberry-background-active)
}

.variant-color-yellow {
    --variant-color: var(--yellow);
    --variant-color-content: var(--yellow-content);
    --variant-color-pale: var(--pale-yellow);
    --variant-color-faint: var(--faint-yellow);
    --variant-color-active: var(--yellow-active);
    --variant-color-bg: var(--yellow-background);
    --variant-color-bg-active: var(--yellow-background-active)
}

.variant-color-orange {
    --variant-color: var(--orange);
    --variant-color-content: var(--orange-content);
    --variant-color-pale: var(--pale-orange);
    --variant-color-faint: var(--faint-orange);
    --variant-color-active: var(--orange-active);
    --variant-color-bg: var(--orange-background);
    --variant-color-bg-active: var(--orange-background-active)
}

.variant-color-purple {
    --variant-color: var(--purple);
    --variant-color-content: var(--purple-content);
    --variant-color-pale: var(--pale-purple);
    --variant-color-faint: var(--faint-purple);
    --variant-color-active: var(--purple-active);
    --variant-color-bg: var(--purple-background);
    --variant-color-bg-active: var(--purple-background-active)
}

.variant-color-blue {
    --variant-color: var(--blue);
    --variant-color-content: var(--blue-content);
    --variant-color-pale: var(--pale-blue);
    --variant-color-faint: var(--faint-blue);
    --variant-color-active: var(--blue-active);
    --variant-color-bg: var(--blue-background);
    --variant-color-bg-active: var(--blue-background-active)
}

.variant-color-warning {
    --variant-color: var(--yellow);
    --variant-color-content: var(--yellow-content);
    --variant-color-pale: var(--pale-yellow);
    --variant-color-faint: var(--faint-yellow);
    --variant-color-active: var(--yellow-active);
    --variant-color-bg: var(--yellow-background);
    --variant-color-bg-active: var(--yellow-background-active)
}

.variant-color-error {
    --variant-color: var(--red);
    --variant-color-content: var(--red-content);
    --variant-color-pale: var(--pale-red);
    --variant-color-faint: var(--faint-red);
    --variant-color-active: var(--red-active);
    --variant-color-bg: var(--red-background);
    --variant-color-bg-active: var(--red-background-active)
}

.variant-color-success {
    --variant-color: var(--green);
    --variant-color-content: var(--green-content);
    --variant-color-pale: var(--pale-green);
    --variant-color-faint: var(--faint-green);
    --variant-color-active: var(--green-active);
    --variant-color-bg: var(--green-background);
    --variant-color-bg-active: var(--green-background-active)
}

.variant-color-gray {
    --variant-color: var(--gray);
    --variant-color-content: var(--gray-content);
    --variant-color-pale: var(--pale-gray);
    --variant-color-faint: var(--faint-gray);
    --variant-color-active: var(--gray-active);
    --variant-color-bg: var(--gray-background);
    --variant-color-bg-active: var(--gray-background-active)
}

.theme-root {
    --ig-gradient: linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888);
    --tiktok-gradient: linear-gradient(45deg,#68c9d0,#ef1c51);
    --discord-fg-color: #5865f2;
    --discord-bg-color: #5865f2;
    --discord-active-fg-color: #2738f3;
    --discord-active-bg-color: #2738f3;
    --discord-contrast-color: #fff;
    --ethereum-fg-color: #954fff;
    --ethereum-bg-color: #954fff;
    --ethereum-active-fg-color: #60f;
    --ethereum-active-bg-color: #60f;
    --ethereum-contrast-color: #fff;
    --glow-fg-color: #de3163;
    --glow-bg-color: #de3163;
    --glow-active-fg-color: #c22b57;
    --glow-active-bg-color: #c22b57;
    --glow-contrast-color: #fff;
    --google-fg-color: #4285f4;
    --google-bg-color: #4285f4;
    --google-active-fg-color: #0d6aff;
    --google-active-bg-color: #0d6aff;
    --google-contrast-color: #fff;
    --slack-fg-color: #7a2d83;
    --slack-bg-color: #7a2d83;
    --slack-active-fg-color: #650070;
    --slack-active-bg-color: #650070;
    --slack-contrast-color: #fff;
    --twitter-fg-color: #333;
    --twitter-bg-color: #333;
    --twitter-active-fg-color: #000;
    --twitter-active-bg-color: #000;
    --twitter-contrast-color: #fff;
    --solana-fg-color: #00c070;
    --solana-bg-color: #00c070;
    --solana-active-fg-color: #00814b;
    --solana-active-bg-color: #00814b;
    --solana-contrast-color: #fff;
    --youtube-fg-color: red;
    --youtube-bg-color: red;
    --youtube-active-fg-color: #be0000;
    --youtube-active-bg-color: #be0000;
    --youtube-contrast-color: #fff;
    --zoom-fg-color: #2d8cff;
    --zoom-bg-color: #2d8cff;
    --zoom-active-fg-color: #006cf0;
    --zoom-active-bg-color: #006cf0;
    --zoom-contrast-color: #fff;
    --microsoft-fg-color: #00a4ef;
    --microsoft-bg-color: #00a4ef;
    --microsoft-active-fg-color: #0083bf;
    --microsoft-active-bg-color: #0083bf;
    --microsoft-contrast-color: #fff
}

.theme-root.dark {
    --discord-fg-color: #7883fd;
    --discord-active-fg-color: #98a0ff;
    --ethereum-fg-color: #a66bff;
    --ethereum-active-fg-color: #b583ff;
    --glow-fg-color: #e66288;
    --glow-active-fg-color: #ee98b1;
    --google-fg-color: #6ca4ff;
    --google-active-fg-color: #a9c9ff;
    --slack-fg-color: #00de82;
    --slack-active-fg-color: #14fe9d;
    --twitter-fg-color: #ccc;
    --twitter-active-fg-color: #eee;
    --twitter-bg-color: #555;
    --twitter-active-bg-color: #333;
    --youtube-fg-color: #ff3a3a;
    --youtube-active-fg-color: #f66;
    --zoom-fg-color: #4d9dff;
    --zoom-active-fg-color: #6aadff;
    --microsoft-fg-color: #1ab7ff;
    --microsoft-active-fg-color: #33bfff
}

*,:after,:before {
    box-sizing: border-box
}

.theme-root {
    font-family: var(--font);
    line-height: var(--default-line-height)
}

body.scroll-locked {
    overflow: hidden
}

.button-reset {
    all: unset
}

.button-reset:focus,.button-reset:focus-visible {
    outline-offset: 1px;
    outline: var(--outline-color) auto 1px
}

a {
    text-decoration: none
}

h1,h2,h3,h4,h5,h6 {
    line-height: var(--title-line-height);
    font-weight: var(--font-weight-bold);
    margin-top: 0;
    margin-bottom: 1rem
}

h3 {
    font-size: var(--font-size-lg)
}

p {
    margin-top: 0
}

figure {
    margin: 0
}

img,svg {
    vertical-align: middle
}

button {
    background-color: transparent;
    border: 1px solid transparent;
    line-height: var(--default-line-height);
    font-size: inherit
}

button:disabled {
    opacity: .5
}

button:focus:not(:focus-visible) {
    outline: 0
}

button,input,select,textarea {
    margin: 0;
    font-family: inherit
}

[role=button] {
    cursor: pointer
}

select {
    word-wrap: normal
}

[type=button],[type=reset],[type=submit],button {
    -webkit-appearance: button
}

[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled) {
    cursor: pointer
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
    padding: 0;
    border-style: none
}

input,textarea {
    font-size: inherit
}

textarea {
    resize: vertical
}

img:-moz-loading {
    visibility: hidden
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    font: inherit;
    -webkit-appearance: button
}

th {
    text-align: left
}

hr {
    border-style: solid;
    border-color: var(--divider-color);
    border-width: 0 0 1px
}

code {
    word-wrap: break-word
}

code,pre {
    font-size: 87.5%
}

pre {
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

iframe {
    border: none
}

.border-all {
    border: 1px solid var(--divider-color)
}

.border-top {
    border-top: 1px solid var(--divider-color)
}

.border-left {
    border-left: 1px solid var(--divider-color)
}

.border-right {
    border-right: 1px solid var(--divider-color)
}

.border-bottom {
    border-bottom: 1px solid var(--divider-color)
}

.zm-container {
    max-width: var(--max-width);
    margin: 0 auto
}

.align-center {
    text-align: center
}

.align-right {
    text-align: right
}

.strikethrough {
    text-decoration: line-through
}

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

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

.overflow-auto {
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.overflow-hidden {
    overflow: hidden
}

svg {
    width: 1rem;
    height: 1rem
}

.with-svg {
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.with-svg svg {
    height: 1rem
}

.with-svg.svg-left svg {
    margin-right: .5rem
}

.with-svg.svg-right svg {
    margin-left: .5rem
}

.well {
    background-color: var(--opacity-light);
    border-radius: var(--border-radius);
    padding: 1rem 1.25rem
}

.empty-wrapper {
    padding: 3rem;
    text-align: center
}

.empty-wrapper .empty-icon-wrapper {
    display: inline-flex;
    background-color: var(--brand-pale-bg-color);
    border-radius: 150px;
    margin: 1rem 0 2rem;
    width: 90px;
    height: 90px;
    align-items: center;
    justify-content: space-around
}

.empty-wrapper .empty-icon-wrapper svg {
    width: 3rem;
    height: 3rem;
    color: var(--brand-color)
}

.empty-wrapper .action-btn {
    display: inline-flex
}

.a,a {
    color: var(--brand-color);
    cursor: pointer;
    transition: color var(--transition-duration) var(--transition-fn)
}

.a:hover,a:hover {
    text-decoration: none;
    color: var(--brand-active-color)
}

.a.text-primary,a.text-primary {
    color: var(--primary-color)
}

.a.text-primary:hover,a.text-primary:hover {
    color: var(--brand-active-color)
}

@media(max-width: 650px) {
    .empty-wrapper {
        padding:2rem
    }

    .empty-wrapper .empty-icon-wrapper {
        margin: 1rem 0 1.5rem;
        width: 80px;
        height: 80px
    }

    .empty-wrapper .empty-icon-wrapper svg {
        width: 2.5rem;
        height: 2.5rem
    }

    .empty-wrapper h4 {
        font-size: 1.25rem
    }
}

@media(max-width: 450px) {
    .empty-wrapper {
        padding:1rem 1rem 1.5rem;
        font-size: var(--font-size-sm)
    }

    .empty-wrapper .empty-icon-wrapper {
        margin-top: 1rem
    }

    .empty-wrapper h4 {
        font-size: 1.1rem
    }
}

.mirror-content {
    word-break: break-word
}

.mirror-content h1 {
    font-size: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 1.5rem;
    font-weight: var(--font-weight-bold)
}

.mirror-content h2 {
    font-size: 1.25rem;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    font-weight: var(--font-weight-bold)
}

.mirror-content .add-block-menu:first-child+h1,.mirror-content .add-block-menu:first-child+h2,.mirror-content h1:first-child,.mirror-content h2:first-child {
    margin-top: 0
}

.mirror-content blockquote {
    -webkit-margin-start: 2px;
    margin-inline-start:2px;-webkit-margin-end: 0;
    margin-inline-end:0;border-left: 2px solid var(--opacity-8);
    padding: 0 1rem
}

.mirror-content pre {
    padding: 1rem;
    border-radius: var(--border-radius);
    background-color: var(--secondary-bg-color)
}

.mirror-content .image {
    display: block;
    max-width: 100%;
    max-height: 25rem;
    margin: 1rem auto
}

.mirror-content .attachment-link:hover {
    background-color: var(--opacity-16,#f1f3f5)!important
}

.mirror-content ol,.mirror-content p,.mirror-content ul {
    margin-bottom: 1.25rem
}

.mirror-content ol,.mirror-content ul {
    -webkit-padding-start: 2rem;
    padding-inline-start:2rem}

.mirror-content :last-child,.mirror-content li p {
    margin-bottom: 0
}

.mirror-content hr {
    margin: 0 0 1.25rem;
    border-bottom: 1px solid var(--divider-color)
}

.mirror-content u {
    -webkit-text-decoration-color: var(--opacity-second-light);
    text-decoration-color: var(--opacity-second-light)
}

.mirror-content .variable {
    color: var(--brand-color);
    background-color: var(--brand-pale-bg-color);
    border-radius: var(--small-border-radius);
    padding: 0 .25rem
}

.bg-primary {
    background-color: var(--primary-bg-color)
}

.bg-primary-elevated {
    background-color: var(--elevated-primary-bg-color)
}

.bg-hover {
    transition: background-color var(--transition-duration) var(--transition-fn)
}

.bg-hover:hover {
    background-color: var(--hover-bg-color)
}

.bg-secondary {
    background-color: var(--secondary-bg-color)
}

.bg-tertiary {
    background-color: var(--tertiary-bg-color)
}

.hidden {
    display: none
}

.opacity-0 {
    opacity: 0
}

.opacity-100 {
    opacity: 1
}

.card-bg-color {
    background: var(--card-bg-color)
}

.flex {
    display: flex
}

.flex-baseline,.flex-baseline-center {
    display: flex;
    align-items: baseline
}

.flex-baseline-center {
    justify-content: center
}

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

.flex-stretch {
    display: flex;
    align-items: stretch
}

.flex-center-center {
    display: flex;
    align-items: center;
    justify-content: center
}

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

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

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

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

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

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

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

.flex-1 {
    flex: 1 1
}

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

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

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

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

.align-self-center {
    align-self: center
}

.spread {
    display: flex;
    justify-content: space-between
}

.stretch {
    align-items: stretch
}

.space-around {
    display: flex;
    justify-content: space-around
}

.full-width {
    width: 100%
}

.full-height {
    min-height: 100%
}

.min-width-0 {
    min-width: 0
}

.min-height-0 {
    min-height: 0
}

.max-height-100 {
    max-height: 100%
}

.force-full-height {
    height: 100%
}

.inline {
    display: inline
}

.inline-block {
    display: inline-block
}

.block {
    display: block
}

.flex-inline {
    display: inline-flex
}

.relative {
    position: relative
}

.m-0 {
    margin: 0!important
}

.mt-0,.my-0 {
    margin-top: 0!important
}

.mr-0,.mx-0 {
    margin-right: 0!important
}

.mb-0,.my-0 {
    margin-bottom: 0!important
}

.ml-0,.mx-0 {
    margin-left: 0!important
}

.m-1 {
    margin: .25rem!important
}

.mt-1,.my-1 {
    margin-top: .25rem!important
}

.mr-1,.mx-1 {
    margin-right: .25rem!important
}

.mb-1,.my-1 {
    margin-bottom: .25rem!important
}

.ml-1,.mx-1 {
    margin-left: .25rem!important
}

.m-2 {
    margin: .5rem!important
}

.mt-2,.my-2 {
    margin-top: .5rem!important
}

.mr-2,.mx-2 {
    margin-right: .5rem!important
}

.mb-2,.my-2 {
    margin-bottom: .5rem!important
}

.ml-2,.mx-2 {
    margin-left: .5rem!important
}

.m-25 {
    margin: .75rem!important
}

.mt-25,.my-25 {
    margin-top: .75rem!important
}

.mr-25,.mx-25 {
    margin-right: .75rem!important
}

.mb-25,.my-25 {
    margin-bottom: .75rem!important
}

.ml-25,.mx-25 {
    margin-left: .75rem!important
}

.m-3 {
    margin: 1rem!important
}

.mt-3,.my-3 {
    margin-top: 1rem!important
}

.mr-3,.mx-3 {
    margin-right: 1rem!important
}

.mb-3,.my-3 {
    margin-bottom: 1rem!important
}

.ml-3,.mx-3 {
    margin-left: 1rem!important
}

.m-4 {
    margin: 1.5rem!important
}

.mt-4,.my-4 {
    margin-top: 1.5rem!important
}

.mr-4,.mx-4 {
    margin-right: 1.5rem!important
}

.mb-4,.my-4 {
    margin-bottom: 1.5rem!important
}

.ml-4,.mx-4 {
    margin-left: 1.5rem!important
}

.m-5 {
    margin: 3rem!important
}

.mt-5,.my-5 {
    margin-top: 3rem!important
}

.mr-5,.mx-5 {
    margin-right: 3rem!important
}

.mb-5,.my-5 {
    margin-bottom: 3rem!important
}

.ml-5,.mx-5 {
    margin-left: 3rem!important
}

.p-0 {
    padding: 0!important
}

.pt-0,.py-0 {
    padding-top: 0!important
}

.pr-0,.px-0 {
    padding-right: 0!important
}

.pb-0,.py-0 {
    padding-bottom: 0!important
}

.pl-0,.px-0 {
    padding-left: 0!important
}

.p-1 {
    padding: .25rem!important
}

.pt-1,.py-1 {
    padding-top: .25rem!important
}

.pr-1,.px-1 {
    padding-right: .25rem!important
}

.pb-1,.py-1 {
    padding-bottom: .25rem!important
}

.pl-1,.px-1 {
    padding-left: .25rem!important
}

.p-2 {
    padding: .5rem!important
}

.pt-2,.py-2 {
    padding-top: .5rem!important
}

.pr-2,.px-2 {
    padding-right: .5rem!important
}

.pb-2,.py-2 {
    padding-bottom: .5rem!important
}

.pl-2,.px-2 {
    padding-left: .5rem!important
}

.p-25 {
    padding: .75rem!important
}

.pt-25,.py-25 {
    padding-top: .75rem!important
}

.pr-25,.px-25 {
    padding-right: .75rem!important
}

.pb-25,.py-25 {
    padding-bottom: .75rem!important
}

.pl-25,.px-25 {
    padding-left: .75rem!important
}

.p-3 {
    padding: 1rem!important
}

.pt-3,.py-3 {
    padding-top: 1rem!important
}

.pr-3,.px-3 {
    padding-right: 1rem!important
}

.pb-3,.py-3 {
    padding-bottom: 1rem!important
}

.pl-3,.px-3 {
    padding-left: 1rem!important
}

.p-4 {
    padding: 1.5rem!important
}

.pt-4,.py-4 {
    padding-top: 1.5rem!important
}

.pr-4,.px-4 {
    padding-right: 1.5rem!important
}

.pb-4,.py-4 {
    padding-bottom: 1.5rem!important
}

.pl-4,.px-4 {
    padding-left: 1.5rem!important
}

.p-5 {
    padding: 3rem!important
}

.pt-5,.py-5 {
    padding-top: 3rem!important
}

.pr-5,.px-5 {
    padding-right: 3rem!important
}

.pb-5,.py-5 {
    padding-bottom: 3rem!important
}

.pl-5,.px-5 {
    padding-left: 3rem!important
}

.cgap-0 {
    column-gap: 0
}

.cgap-1 {
    column-gap: .25rem
}

.cgap-2 {
    column-gap: .5rem
}

.cgap-25 {
    column-gap: .75rem
}

.cgap-3 {
    column-gap: 1rem
}

.cgap-4 {
    column-gap: 1.5rem
}

.cgap-5 {
    column-gap: 3rem
}

.rgap-0 {
    row-gap: 0
}

.rgap-1 {
    row-gap: .25rem
}

.rgap-2 {
    row-gap: .5rem
}

.rgap-25 {
    row-gap: .75rem
}

.rgap-3 {
    row-gap: 1rem
}

.rgap-4 {
    row-gap: 1.5rem
}

.rgap-5 {
    row-gap: 3rem
}

.gap-0 {
    gap: 0
}

.gap-1 {
    gap: .25rem
}

.gap-2 {
    gap: .5rem
}

.gap-25 {
    gap: .75rem
}

.gap-3 {
    gap: 1rem
}

.gap-4 {
    gap: 1.5rem
}

.gap-5 {
    gap: 3rem
}

.theme-root {
    --font: -apple-system,BlinkMacSystemFont,"Apple Color Emoji",Inter,Roboto,Segoe UI,Helvetica Neue,Arial,Noto Sans,sans-serif;
    --mono-font: "SF Mono",menlo,monaco,consolas,"Courier New",Courier,monospace;
    --default-line-height: 1.5;
    --reduced-line-height: 1.3;
    --title-line-height: 1.2;
    --reduced-title-line-height: 1.15;
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 600;
    --font-size-xxxl: 1.5rem;
    --font-size-xxl: 1.375rem;
    --font-size-xl: 1.25rem;
    --font-size-lg: 1.125rem;
    --font-size-md: 1rem;
    --font-size-sm: 0.875rem;
    --font-size-xs: 0.8125rem;
    --font-size-xxs: 0.75rem;
    --font-size-xxxs: 0.625rem;
    --section-title-font-size: var(--font-size-xl);
    --section-subtitle-font-size: var(--font-size-md);
    --small-section-title-font-size: var(--font-size-lg);
    --small-section-subtitle-font-size: var(--font-size-sm)
}

@media(max-width: 450px) {
    .theme-root {
        --section-title-font-size:var(--font-size-lg);
        --section-subtitle-font-size: var(--font-size-sm);
        --small-section-title-font-size: var(--font-size-md);
        --small-section-subtitle-font-size: var(--font-size-xs)
    }
}

.text-primary {
    color: var(--primary-color)
}

.text-secondary {
    color: var(--secondary-color)
}

.text-secondary-alpha {
    color: var(--secondary-color-alpha)
}

.text-tertiary {
    color: var(--tertiary-color)
}

.text-tertiary-alpha {
    color: var(--tertiary-color-alpha)
}

.text-quaternary-alpha {
    color: var(--quaternary-color-alpha)
}

.text-success {
    color: var(--success-color)
}

.text-warning {
    color: var(--warning-color)
}

.text-error {
    color: var(--error-color)
}

.fs-xxxl {
    font-size: var(--font-size-xxxl)
}

.fs-xxl {
    font-size: var(--font-size-xxl)
}

.fs-xl {
    font-size: var(--font-size-xl)
}

.fs-lg {
    font-size: var(--font-size-lg)
}

.fs-md {
    font-size: var(--font-size-md)
}

.fs-sm {
    font-size: var(--font-size-sm)
}

.fs-xs {
    font-size: var(--font-size-xs)
}

.fs-xxs {
    font-size: var(--font-size-xxs)
}

.fs-xxxs {
    font-size: var(--font-size-xxxs)
}

.reduced-line-height {
    line-height: var(--reduced-line-height)
}

.line-height-1 {
    line-height: 1
}

.text-uppercase {
    text-transform: uppercase
}

.b,b,strong {
    font-weight: var(--font-weight-bold)
}

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

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

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

.nowrap {
    white-space: nowrap
}

.pre-line {
    white-space: pre-line
}

.whitespace-pre {
    white-space: pre
}

.fw-regular {
    font-weight: var(--font-weight-regular)
}

.fw-medium {
    font-weight: var(--font-weight-medium)
}

.fw-bold {
    font-weight: var(--font-weight-bold)
}

.text-center {
    text-align: center
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.mono-number {
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums
}

.high-legibility {
    font-feature-settings: "ss06" on
}

.text-datetime {
    font-feature-settings: "ss01" on,"ss02" on
}

.text-cranberry {
    color: var(--cranberry)
}

.text-white {
    color: var(--white)
}

.text-gray {
    color: var(--gray)
}

.text-barney {
    color: var(--barney)
}

.text-red {
    color: var(--red)
}

.text-green {
    color: var(--green)
}

.text-blue {
    color: var(--blue)
}

.text-purple {
    color: var(--purple)
}

.text-yellow {
    color: var(--yellow)
}

.text-orange {
    color: var(--orange)
}

.text-brand {
    color: var(--brand-color)
}

.text-balance {
    text-wrap: balance
}

.lux-line-clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

svg {
    display: block
}

.svg-xs svg,svg.svg-xs {
    width: var(--font-size-xs);
    height: var(--font-size-xs)
}

.svg-sm svg,svg.svg-sm {
    width: var(--font-size-sm);
    height: var(--font-size-sm)
}

.svg-lg svg,svg.svg-lg {
    width: var(--font-size-lg);
    height: var(--font-size-lg)
}

.svg-xl svg,svg.svg-xl {
    width: var(--font-size-xl);
    height: var(--font-size-xl)
}

.svg-15rem svg,svg.svg-15rem {
    width: 1.5rem;
    height: 1.5rem
}

.svg-2rem svg,svg.svg-2rem {
    width: 2rem;
    height: 2rem
}

.theme-root {
    --transition-duration: 0.3s;
    --fast-transition-duration: 0.2s;
    --slow-transition-duration: 0.6s;
    --transition-fn: cubic-bezier(0.4,0,0.2,1);
    --bounce-transition-fn: cubic-bezier(0.54,1.12,0.38,1.11);
    --transition: all var(--transition-duration) var(--transition-fn);
    --bounce-transition: all var(--transition-duration) var(--bounce-transition-fn);
    --fast-transition: all var(--fast-transition-duration) var(--transition-fn);
    --slow-transition: all var(--slow-transition-duration) var(--transition-fn)
}

@keyframes shake {
    0% {
        transform: translate(1px,1px)
    }

    10% {
        transform: translate(-1px,-2px)
    }

    20% {
        transform: translate(-3px)
    }

    30% {
        transform: translate(3px,2px)
    }

    40% {
        transform: translate(1px,-1px)
    }

    50% {
        transform: translate(-1px,2px)
    }

    60% {
        transform: translate(-3px,1px)
    }

    70% {
        transform: translate(3px,1px)
    }

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

    90% {
        transform: translate(1px,2px)
    }

    to {
        transform: translate(1px,-2px)
    }
}

.theme-root .shake {
    animation: shake .2s;
    animation-iteration-count: infinite
}

@keyframes pulsate-color {
    50% {
        color: #fff;
        background-color: var(--orange)
    }
}

.theme-root .pulsate-2 {
    animation: pulsate-color 2.25s;
    animation-iteration-count: 2
}

.btn {
    font-weight: var(--font-weight-medium);
    border-radius: var(--border-radius)
}

.btn-sm.with-svg svg {
    width: var(--font-size-sm);
    height: var(--font-size-sm)
}

.btn-sm.with-svg.svg-left svg {
    margin-right: .25rem
}

.btn-sm.with-svg.svg-right svg {
    margin-left: .25rem
}

.btn-a,.btn-link {
    color: var(--brand-color);
    cursor: pointer
}

.btn-a:active,.btn-a:focus,.btn-a:hover,.btn-link:active,.btn-link:focus,.btn-link:hover {
    text-decoration: none;
    color: var(--brand-active-color)
}

.btn-a {
    font-size: inherit;
    vertical-align: inherit;
    font-weight: inherit;
    line-height: inherit;
    border: 0;
    padding: 0;
    display: inline-block
}

.btn-link-gray {
    color: var(--tertiary-color)
}

.btn-link-gray:hover {
    color: var(--secondary-color)
}

.theme-root,.tint-root {
    --chat-main-button-color: var(--primary-bg-color);
    --chat-main-button-bg-color: var(--opacity-80);
    --chat-main-button-bg-hover-color: var(--primary-color);
    --chat-main-button-bg-active-color: var(--primary-color);
    --chat-box-shadow: var(--light-shadow-sm);
    --chat-conversation-head-bg-hover-color: var(--opacity-8);
    --chat-conversation-head-bg-active-color: var(--opacity-8);
    --chat-conversation-head-active-ring-color: var(--active-border-color);
    --chat-get-support-bg-color: var(--translucent-bg-color);
    --chat-intercom-bg-color: var(--black);
    --chat-session-time-margin: 0.5rem 0.25rem 0.25rem;
    --chat-message-margin-bottom: 0.5rem;
    --chat-message-margin-bottom-same-author: 2px;
    --chat-message-padding-inner: 0.75rem;
    --chat-message-padding-outer: 0.75rem;
    --chat-message-avatar-size: 24px;
    --chat-message-avatar-margin-right: 0.5rem;
    --chat-message-bubble-padding-horizontal: 0.75rem;
    --chat-message-bubble-padding-vertical: 0.5rem;
    --chat-message-bubble-line-height: 1.4;
    --chat-message-bubble-border-radius: calc((1rem * var(--chat-message-bubble-line-height) + 2 * var(--chat-message-bubble-padding-vertical)) / 2);
    --chat-message-bubble-emoji-font-size: 3.5rem;
    --chat-message-bubble-emoji-line-height: 1.3;
    --chat-message-bubble-emoji-letter-spacing: 0.5rem;
    --chat-message-bubble-me-bg-color: var(--chat-blue);
    --chat-message-bubble-me-color: var(--white);
    --chat-message-bubble-other-bg-color: var(--opacity-4);
    --chat-message-bubble-other-color: var(--primary-color);
    --chat-message-image-background: var(--modal-bg-color);
    --chat-message-read-indicator-margin-right: var(--chat-message-padding-inner);
    --chat-button-color: var(--white);
    --chat-window-background: var(--bg-opacity-64)
}

.theme-root.dark,.theme-root.dark .tint-root {
    --chat-main-button-color: var(--opacity-80);
    --chat-main-button-bg-color: var(--bg-opacity-48);
    --chat-main-button-bg-hover-color: var(--opacity-16);
    --chat-main-button-bg-active-color: var(--primary-color);
    --chat-box-shadow: var(--light-shadow-lg);
    --chat-message-bubble-me-bg-color: var(--chat-blue);
    --chat-message-bubble-other-bg-color: var(--opacity-8);
    --chat-window-background: var(--bg-opacity-48);
    --chat-intercom-bg-color: var(--gray-90)
}

.form-control::placeholder,.with-placeholder::placeholder {
    color: var(--placeholder-color);
    opacity: 1
}

.form-control:-ms-input-placeholder,.with-placeholder:-ms-input-placeholder {
    color: var(--placeholder-color)
}

.form-control::-ms-input-placeholder,.with-placeholder::-ms-input-placeholder {
    color: var(--placeholder-color)
}

.form-control:-moz-focusring,.with-placeholder:-moz-focusring {
    text-shadow: none
}

.invalid+.invalid-feedback {
    display: inherit
}

.disabled,.no-pointer {
    pointer-events: none
}

.disabled {
    opacity: .5
}

.theme-root,.tint-root {
    --modal-header-footer-padding: 0.75rem 1.25rem;
    --modal-vertical-padding: 1rem;
    --modal-horizontal-padding: 1.25rem;
    --modal-padding: var(--modal-vertical-padding) var(--modal-horizontal-padding);
    --modal-header-bg-color: var(--elevated-secondary-bg-color);
    --modal-bg-color: var(--slight-translucent-elevated-bg-color);
    --menu-bg-color: var(--slight-translucent-elevated-bg-color);
    --menu-inverted-bg-color: var(--primary-color);
    --menu-inverted-border-color: var(--bg-opacity-light);
    --menu-header-color: var(--tertiary-color-alpha);
    --menu-item-color: var(--primary-color);
    --menu-item-secondary-color: var(--tertiary-color-alpha);
    --menu-item-hover-color: var(--primary-color);
    --menu-item-hover-bg-color: var(--hover-bg-color);
    --menu-item-icon-color: var(--tertiary-color-alpha);
    --menu-item-icon-hover-color: var(--tertiary-color-alpha);
    --menu-search-bg-color: var(--slight-translucent-elevated-bg-color);
    --menu-search-divider-color: var(--divider-color);
    --menu-no-result-color: var(--tertiary-color-alpha);
    --menu-border-color: var(--opacity-light)
}

.theme-root {
    --light-shadow-xs: 0 1px 4px rgba(0,0,0,.1);
    --light-shadow-sm: 0 0.7px 2.7px rgba(0,0,0,.02),0 1.7px 6.9px rgba(0,0,0,.03),0 3.5px 14.2px rgba(0,0,0,.04),0 7.3px 29.2px rgba(0,0,0,.05),0 20px 80px rgba(0,0,0,.06);
    --light-shadow: 0 1.6px 2.7px rgba(0,0,0,.02),0 4.2px 6.9px rgba(0,0,0,.03),0 8.5px 14.2px rgba(0,0,0,.04),0 17.5px 29.2px rgba(0,0,0,.05),0 48px 80px rgba(0,0,0,.06);
    --light-shadow-lg: 0 3.3px 2.7px rgba(0,0,0,.03),0 8.3px 6.9px rgba(0,0,0,.04),0 17px 14.2px rgba(0,0,0,.05),0 35px 29.2px rgba(0,0,0,.06),0 96px 80px rgba(0,0,0,.07);
    --light-shadow-xl: 0 4.5px 2.7px rgba(0,0,0,.04),0 11.3px 6.9px rgba(0,0,0,.06),0 23px 14.2px rgba(0,0,0,.08),0 47.5px 29.2px rgba(0,0,0,.1),0 130px 80px rgba(0,0,0,.14);
    --medium-shadow-xs: 0 1px 4px rgba(0,0,0,.15);
    --medium-shadow-sm: 0 0.7px 2.7px rgba(0,0,0,.1),0 1.7px 6.9px rgba(0,0,0,.13),0 3.5px 14.2px rgba(0,0,0,.17),0 7.3px 29.2px rgba(0,0,0,.22);
    --medium-shadow: 0 1.6px 2.7px rgba(0,0,0,.1),0 4.2px 6.9px rgba(0,0,0,.13),0 8.5px 14.2px rgba(0,0,0,.17),0 17.5px 29.2px rgba(0,0,0,.22);
    --medium-shadow-lg: 0 3.3px 2.7px rgba(0,0,0,.1),0 8.3px 6.9px rgba(0,0,0,.13),0 17px 14.2px rgba(0,0,0,.17),0 35px 29.2px rgba(0,0,0,.22);
    --medium-shadow-xl: 0 4.5px 2.7px rgba(0,0,0,.1),0 11.3px 6.9px rgba(0,0,0,.13),0 23px 14.2px rgba(0,0,0,.17),0 47.5px 29.2px rgba(0,0,0,.22);
    --shadow-xs: var(--light-shadow-xs);
    --shadow-sm: var(--light-shadow-sm);
    --shadow: var(--light-shadow);
    --shadow-lg: var(--light-shadow-lg);
    --shadow-xl: var(--light-shadow-xl);
    --shadow-modal: 0 0 0 1px var(--opacity-8),var(--shadow-lg),0px -4px 4px 0px rgba(0,0,0,.04) inset;
    --backdrop-blur: blur(16px);
    --high-legibility-backdrop-blur: blur(24px) contrast(50%) brightness(130%)
}

.theme-root.dark {
    --shadow-xs: 0 1px 4px rgba(0,0,0,.25);
    --shadow-sm: 0 0.7px 2.7px rgba(0,0,0,.25),0 1.7px 6.9px rgba(0,0,0,.3),0 3.5px 14.2px rgba(0,0,0,.35),0 7.3px 29.2px rgba(0,0,0,.4);
    --shadow: 0 1.6px 2.7px rgba(0,0,0,.25),0 4.2px 6.9px rgba(0,0,0,.3),0 8.5px 14.2px rgba(0,0,0,.35),0 17.5px 29.2px rgba(0,0,0,.4);
    --shadow-lg: 0 3.3px 2.7px rgba(0,0,0,.3),0 8.3px 6.9px rgba(0,0,0,.3),0 17px 14.2px rgba(0,0,0,.35),0 35px 29.2px rgba(0,0,0,.4);
    --shadow-xl: 0 4.5px 2.7px rgba(0,0,0,.3),0 11.3px 6.9px rgba(0,0,0,.3),0 23px 14.2px rgba(0,0,0,.35),0 47.5px 29.2px rgba(0,0,0,.4);
    --high-legibility-backdrop-blur: blur(24px) contrast(50%) brightness(70%)
}

.theme-root,.tint-root {
    --shimmer-color: var(--pale-gray);
    --shimmer-gradient: linear-gradient(to right,var(--pale-gray) 8%,var(--faint-gray) 18%,var(--pale-gray) 33%)
}

@keyframes shimmer {
    0% {
        background-position: -568px 0
    }

    to {
        background-position: 568px 0
    }
}

.shimmer,.shimmer-wrapper,.text-shimmer-wrapper {
    position: relative
}

.shimmer {
    animation-duration: 1.2s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: var(--shimmer-color);
    background: var(--shimmer-gradient);
    background-size: 1200px 104px;
    height: 1rem;
    margin-bottom: .5rem
}

.shimmer-round {
    border-radius: var(--border-radius)
}

.shimmer-circle {
    border-radius: 100%
}

.shimmer-pill {
    border-radius: 100px
}

.text-shimmer-wrapper {
    --text-shimmer-text-ratio: 0.625;
    --text-shimmer-padding-ratio: calc(1 - var(--text-shimmer-text-ratio));
    --text-shimmer-padding-vertical: calc(var(--text-shimmer-height) * var(--text-shimmer-padding-ratio) / 2);
    padding-top: var(--text-shimmer-padding-vertical);
    padding-bottom: var(--text-shimmer-padding-vertical)
}

.text-shimmer-wrapper .shimmer {
    height: calc(var(--text-shimmer-height)*var(--text-shimmer-text-ratio));
    margin-bottom: 0;
    margin-top: 0
}

.theme-root,.tint-root {
    --rich-text-toolbar-button-color: var(--tertiary-color);
    --rich-text-toolbar-button-hover-color: var(--primary-color);
    --rich-text-toolbar-button-hover-bg-color: var(--hover-bg-color);
    --rich-text-toolbar-button-active-color: var(--brand-color);
    --rich-text-toolbar-button-active-hover-bg-color: var(--hover-bg-color);
    --editor-selected-text-bg-color: var(--brand-pale-bg-color);
    --editor-selected-node-border-color: var(--brand-pale-bg-color);
    --editor-resize-control-color: var(--brand-color);
    --table-header-color: var(--secondary-color);
    --table-header-divider-color: var(--divider-color);
    --table-divider-color: var(--divider-color);
    --table-mobile-divider-color: var(--divider-color);
    --table-hover-bg-color: var(--hover-bg-color);
    --table-empty-color: var(--tertiary-color);
    --table-expanded-row-bg-color: var(--secondary-bg-color)
}

.mobile-only {
    display: none
}

@media(max-width: 650px) {
    .mobile-only {
        display:block
    }

    .desktop-only {
        display: none
    }
}

.inverted-filter,.theme-root.dark .adaptive-inverted-filter {
    filter: invert(.95) hue-rotate(180deg)
}

.theme-root.dark .tint-root.light .adaptive-inverted-filter {
    filter: none
}

.theme-root,.tint-root {
    --input-horizontal-padding: 0.875rem;
    --input-vertical-padding: 0.625rem;
    --input-padding: var(--input-vertical-padding) var(--input-horizontal-padding);
    --button-icon-only-padding: 0.625rem;
    --button-icon-only-compact-padding: 0.4375rem;
    --input-font-size: 1rem;
    --input-label-font-size: 0.875rem;
    --input-line-height: 1;
    --input-element-gap: 0.5rem;
    --input-border-thickness: 1px;
    --input-height: calc(2.25rem + 2 * var(--input-border-thickness));
    --input-textarea-line-height: 1.5;
    --input-textarea-vertical-padding: 0.375rem;
    --input-textarea-padding: var(--input-textarea-vertical-padding) 0.75rem;
    --naked-input-font-weight: var(--font-weight-regular);
    --naked-input-line-height: var(--reduced-line-height);
    --naked-input-hover-bg-color: var(--opacity-light);
    --naked-input-hover-placeholder-color: var(--opacity-48);
    --naked-input-padding: 0;
    --naked-input-guidance-height: auto;
    --small-input-padding: 0.4375rem 0.625rem;
    --small-button-icon-only-padding: 0.4375rem;
    --small-button-icon-only-compact-padding: 0.3125rem;
    --small-input-font-size: 0.875rem;
    --small-input-label-font-size: 0.75rem;
    --small-input-element-gap: 0.375rem;
    --small-input-height: calc(1.75rem + 2 * var(--input-border-thickness));
    --large-input-horizontal-padding: 1.125rem;
    --large-input-vertical-padding: 0.75rem;
    --large-input-padding: var(--large-input-vertical-padding) var(--large-input-horizontal-padding);
    --large-button-icon-only-padding: 0.75rem;
    --large-button-icon-only-compact-padding: 0.5rem;
    --large-input-font-size: 1.125rem;
    --large-input-label-font-size: 1rem;
    --large-input-element-gap: 0.625rem;
    --large-input-height: calc(2.625rem + 2 * var(--input-border-thickness));
    --large-input-textarea-vertical-padding: 0.425rem;
    --large-input-textarea-padding: var(--large-input-textarea-vertical-padding) 1rem;
    --dot-size: 0.5rem;
    --small-dot-size: 0.375rem;
    --large-dot-size: 0.625rem;
    --segment-color: var(--tertiary-color-alpha);
    --segment-hover-color: var(--primary-color);
    --segment-gap: 0.25rem;
    --segment-padding: 0.25rem 0.75rem;
    --segment-icon-gap: 0.375rem;
    --small-segment-gap: 0.125rem;
    --small-segment-padding: 0.25rem 0.5rem;
    --small-segment-font-size: 0.8rem;
    --segment-selected-color: var(--primary-color);
    --segment-divider-color: var(--tertiary-divider-color);
    --segment-slider-bg-color: var(--primary-bg-color);
    --segment-bg-color: var(--opacity-light);
    --toggle-width: 2.375rem;
    --toggle-height: 1.5rem;
    --toggle-gap: 0.125rem;
    --small-toggle-width: 2rem;
    --small-toggle-height: 1.125rem;
    --small-toggle-gap: 0.125rem;
    --large-toggle-width: 2.75rem;
    --large-toggle-height: 1.75rem;
    --large-toggle-gap: 0.125rem
}

.theme-root,.theme-root.dark .tint-root.light,.tint-root {
    --input-color: var(--primary-color);
    --input-bg-color: var(--primary-bg-color);
    --input-hover-bg-color: var(--primary-bg-color);
    --input-box-shadow: none;
    --input-border-color: var(--secondary-border-color);
    --input-border: var(--input-border-thickness) solid var(--input-border-color);
    --input-disabled-color: var(--tertiary-color-alpha);
    --input-hover-box-shadow: none;
    --input-hover-border-color: var(--tertiary-color-alpha);
    --input-focus-bg-color: var(--primary-bg-color);
    --input-focus-box-shadow: none;
    --input-focus-border-color: var(--primary-color);
    --input-accessory-text-color: var(--secondary-color-alpha);
    --input-accessory-text-bg-color: var(--opacity-light);
    --solid-input-bg-color: var(--opacity-4);
    --solid-input-border-color: var(--opacity-0);
    --solid-input-hover-bg-color: var(--opacity-8);
    --disabled-background-color: var(--secondary-bg-color);
    --placeholder-color: var(--opacity-32);
    --error-placeholder-color: var(--half-red);
    --tagged-input-item-bg-color: var(--opacity-second-light);
    --primary-button-color: var(--white);
    --primary-button-bg-color: var(--gray-90);
    --primary-button-hover-bg-color: var(--gray-80);
    --primary-button-link-color: var(--gray-80);
    --primary-button-hover-link-color: var(--gray-90);
    --secondary-button-color: var(--white);
    --secondary-button-bg-color: var(--gray-60);
    --secondary-button-hover-bg-color: var(--gray-70);
    --secondary-button-link-color: var(--tertiary-color-alpha);
    --secondary-button-hover-link-color: var(--secondary-color-alpha);
    --light-button-color: var(--opacity-64);
    --light-button-bg-color: var(--opacity-light);
    --light-button-hover-color: var(--primary-bg-color);
    --light-button-hover-bg-color: var(--opacity-64);
    --light-button-hover-border-color: var(--opacity-0);
    --rich-button-bg-color: var(--opacity-light);
    --checkbox-border-color: var(--input-border-color);
    --checkbox-box-shadow: none;
    --checkbox-bg-color: var(--input-bg-color);
    --checkbox-check-color: var(--primary-bg-color);
    --checkbox-checked-bg-color: var(--primary-color);
    --checkbox-hover-border-color: var(--secondary-color);
    --select-menu-border-color: var(--border-color);
    --select-menu-hover-color: var(--hover-bg-color);
    --select-menu-focus-color: var(--tertiary-bg-color);
    --select-menu-selected-color: var(--brand-color);
    --toggle-bg-color: var(--opacity-16);
    --toggle-disabled-bg-color: var(--opacity-light);
    --toggle-active-bg-color: var(--primary-color);
    --toggle-active-disabled-bg-color: var(--tertiary-color);
    --toggle-success-active-bg-color: var(--success-content-color);
    --toggle-success-active-disabled-bg-color: var(--darker-pale-green);
    --toggle-error-active-bg-color: var(--error-content-color);
    --toggle-error-active-disabled-bg-color: var(--darker-pale-red)
}

.theme-root input,.theme-root.dark .tint-root.light input,.tint-root input {
    color-scheme: light
}

.theme-root.dark,.theme-root.dark .tint-root,.theme-root.light .tint-root.dark {
    --primary-button-color: var(--black);
    --primary-button-bg-color: var(--white);
    --primary-button-hover-bg-color: var(--gray-20);
    --primary-button-link-color: var(--gray-20);
    --primary-button-hover-link-color: var(--white);
    --secondary-button-bg-color: var(--gray-70);
    --secondary-button-hover-bg-color: var(--gray-80);
    --segment-slider-bg-color: var(--pale-white);
    --toggle-bg-color: var(--white-translucent);
    --toggle-active-bg-color: var(--success-content-color);
    --toggle-active-disabled-bg-color: var(--green-70);
    --toggle-success-active-disabled-bg-color: var(--green-70)
}

.theme-root.dark .tint-root input,.theme-root.dark input,.theme-root.light .tint-root.dark input {
    color-scheme: dark
}

.highlight-label:focus-within .lux-input-label {
    color: var(--input-focus-border-color)
}

.highlight-label.error .lux-input-label {
    color: var(--error-color)
}

.luma-input {
    transition: var(--transition);
    color: var(--input-color);
    line-height: var(--input-line-height);
    border-radius: var(--border-radius);
    overflow: hidden;
    border: 1px solid var(--input-border-color);
    background-color: var(--input-bg-color);
    height: var(--input-height);
    padding: var(--input-padding);
    font-size: var(--input-font-size);
    width: 100%;
    background-image: -webkit-linear-gradient(hsla(0,0%,100%,0),hsla(0,0%,100%,0))
}

.luma-input:not(:disabled):hover {
    border-color: var(--input-hover-border-color);
    background-color: var(--input-hover-bg-color)
}

.luma-input:disabled {
    background-color: var(--disabled-background-color);
    cursor: not-allowed
}

.luma-input:focus,.luma-input:focus:hover {
    background-color: var(--input-focus-bg-color);
    border-color: var(--input-focus-border-color);
    outline: 0
}

.luma-input::placeholder {
    color: var(--placeholder-color);
    opacity: 1
}

.luma-input:-ms-input-placeholder {
    color: var(--placeholder-color)
}

.luma-input::-ms-input-placeholder {
    color: var(--placeholder-color)
}

.luma-input:-moz-focusring {
    text-shadow: none
}

.lux-input-wrapper {
    max-width: var(--input-max-width,auto)
}

.lux-input-wrapper .inner-wrapper {
    display: inline-block;
    width: 100%
}

.lux-input-wrapper:focus-within .lux-input-label {
    color: var(--input-focus-border-color)
}

.lux-input-wrapper:focus-within:not(.error) .helper-text {
    color: var(--input-focus-border-color);
    border-color: var(--input-focus-border-color)
}

.lux-input-wrapper .helper-text {
    transition: var(--transition);
    font-size: var(--input-label-font-size)
}

.lux-input-wrapper.error .helper-text,.lux-input-wrapper.error .lux-input-label,.lux-input-wrapper.error .lux-input-label:hover {
    color: var(--error-color);
    border-color: var(--error-color)
}

.lux-input-wrapper.error .luma-input,.lux-input-wrapper.error .luma-input:focus,.lux-input-wrapper.error .luma-input:focus:hover,.lux-input-wrapper.error .luma-input:hover {
    border-color: var(--error-color)
}

.lux-input-wrapper .helper-text {
    color: var(--tertiary-color-alpha);
    max-height: 0;
    overflow: hidden;
    opacity: 0
}

.lux-input-wrapper.error .helper-text.show,.lux-input-wrapper:focus-within .helper-text.show {
    padding-top: .5rem;
    max-height: 50px;
    opacity: 1
}

.lux-input-wrapper.error .helper-text.show {
    border-color: var(--error-color)
}

.theme-root {
    --tiny-pill-padding: 0.25rem 0.4375rem;
    --tiny-pill-delete-margin: -0.25rem -0.5rem -0.25rem -0.1875rem;
    --tiny-pill-font-size: 0.75rem;
    --tiny-pill-element-gap: 0.1875rem;
    --small-pill-padding: 0.3125rem 0.5625rem;
    --small-pill-delete-margin: -0.3125rem -0.625rem -0.3125rem -0.25rem;
    --small-pill-font-size: 0.875rem;
    --small-pill-element-gap: 0.25rem;
    --medium-pill-padding: 0.4375rem 0.75rem;
    --medium-pill-delete-margin: -0.4375rem -0.875rem -0.4375rem -0.5rem;
    --medium-pill-font-size: 1rem;
    --medium-pill-element-gap: 0.3125rem
}

.dropzone-wrapper {
    height: 100%;
    width: 100%;
    position: relative;
    padding: 1.5rem;
    background-color: var(--opacity-4);
    border-radius: var(--border-radius);
    border: 1px dashed var(--divider-color);
    color: var(--secondary-color-alpha);
    cursor: pointer;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.dropzone-wrapper.collapsed {
    padding: .75rem
}

.dropzone-wrapper:hover {
    background-color: var(--opacity-8)
}

.dropzone-wrapper.active .label,.dropzone-wrapper.active .sublabel,.dropzone-wrapper.active svg,.dropzone-wrapper.dragging .label,.dropzone-wrapper.dragging .sublabel,.dropzone-wrapper.dragging svg {
    color: #fff
}

.dropzone-wrapper.dragging {
    background: var(--success-color)
}

.dropzone-wrapper.active {
    background: var(--warning-color)
}

.dropzone-wrapper.loading {
    animation: pulse 1s ease infinite alternate
}

.dropzone-wrapper .icon {
    padding-bottom: 1rem
}

.dropzone-wrapper svg {
    width: 2rem;
    height: 2rem;
    transition: var(--transition)
}

.dropzone-wrapper .sublabel {
    padding-top: .125rem
}

@keyframes pulse {
    0% {
        opacity: .8
    }

    to {
        opacity: 1
    }
}

.theme-root,.theme-root.dark .tint-root.light,.tint-root {
    --page-bg-color: var(--secondary-bg-color);
    --page-bg-color-translucent: var(--secondary-bg-color-translucent);
    --card-bg-color: var(--white-opacity-80);
    --card-border-color: #fff;
    --card-hover-border-color: var(--black-opacity-16);
    --card-hover-shadow: 0px 28px 17px rgba(0,0,0,.005),0px 12px 12px rgba(0,0,0,.01),0px 3px 7px rgba(0,0,0,.01),0px 0px 0px rgba(0,0,0,.01);
    --table-border-color: var(--divider-color);
    --rich-button-bg-color: var(--card-bg-color);
    --rich-button-border-color: var(--card-border-color);
    --nav-item-color: var(--primary-color);
    --nav-item-hover-color: var(--primary-color);
    --nav-item-hover-bg-color: var(--tertiary-bg-color);
    --nav-item-selected-color: var(--brand-color);
    --nav-link-color: var(--tertiary-color-alpha);
    --nav-link-hover-color: var(--primary-color);
    --nav-vertical-padding: 0.75rem;
    --nav-horizontal-padding: 1rem;
    --nav-padding: var(--nav-vertical-padding) var(--nav-horizontal-padding);
    --page-header-tab-color: var(--tertiary-color-alpha);
    --page-header-tab-color-hover: var(--secondary-color-alpha);
    --page-header-tab-color-selected: var(--primary-color);
    --tab-item-color: var(--secondary-color);
    --tab-item-hover-color: var(--primary-color);
    --tab-item-selected-color: var(--brand-color);
    --tabbar-side-offset: 1rem
}

.theme-root .tint-root.dark,.theme-root.dark,.theme-root.dark .tint-root {
    --page-bg-color: var(--primary-bg-color);
    --page-bg-color-translucent: var(--primary-bg-color-translucent);
    --card-bg-color: var(--white-opacity-4);
    --card-border-color: var(--white-opacity-4);
    --card-hover-border-color: var(--white-opacity-16);
    --card-hover-shadow: 0px 28px 17px rgba(0,0,0,.01),0px 12px 12px rgba(0,0,0,.02),0px 3px 7px rgba(0,0,0,.02),0px 0px 0px rgba(0,0,0,.02);
    --rich-button-bg-color: rgba(34,36,37,.8);
    --rich-button-border-color: var(--white-opacity-8)
}

.section-title-wrapper .section-title-row {
    margin-bottom: 1.25rem
}

.section-title-wrapper.small .section-title-row {
    margin-bottom: 1rem
}

.section-title-wrapper h2 {
    font-size: var(--section-title-font-size);
    font-weight: var(--font-weight-bold);
    color: var(--primary-color);
    margin-bottom: 0
}

.section-title-wrapper.small h2 {
    font-size: var(--small-section-title-font-size)
}

.section-title-wrapper .right-element {
    margin: -.25rem 0
}

.section-title-wrapper.small .right-element {
    margin: -.375rem 0
}

.section-title-wrapper .section-subtitle {
    margin-top: -.875rem;
    margin-bottom: 1.25rem;
    color: var(--secondary-color);
    font-size: var(--section-subtitle-font-size)
}

.section-title-wrapper.small .section-subtitle {
    font-size: var(--small-section-subtitle-font-size);
    margin-top: -.5rem;
    margin-bottom: 1rem
}

.can-divide+.with-divider {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid var(--divider-color)
}

@media(max-width: 450px) {
    .can-divide+.with-divider {
        margin-top:1.5rem;
        padding-top: 1.5rem
    }
}

.can-divide.small+.with-divider.small {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--divider-color)
}

.theme-root {
    --timeline-title-width: 7rem;
    --timeline-column-gap: 4rem;
    --timeline-section-gap: 0;
    --timeline-single-column-line-left-padding: 0.25rem;
    --timeline-single-column-line-width: 1.5rem;
    --timeline-sticky-header-offset: 1rem
}

.simple-drop-zone-container {
    position: relative;
    width: max-content;
    max-width: 100%
}

.simple-drop-zone-container .drop-zone {
    height: var(--size);
    width: var(--size);
    max-width: 100%;
    background-color: var(--tertiary-bg-color);
    cursor: pointer;
    transition: var(--transition);
    background-size: cover
}

.simple-drop-zone-container .drop-zone.rectangle,.simple-drop-zone-container .drop-zone.square,.simple-drop-zone-container .drop-zone.wide-rectangle {
    border-radius: var(--border-radius)
}

.simple-drop-zone-container .drop-zone.rectangle {
    width: calc(var(--size)*2)
}

.simple-drop-zone-container .drop-zone.wide-rectangle {
    width: calc(var(--size)*5)
}

.simple-drop-zone-container .drop-zone.circle {
    border-radius: 999px
}

.simple-drop-zone-container .drop-zone.active {
    background-color: var(--success-color)
}

.simple-drop-zone-container .drop-zone.contain {
    background-position: 50%;
    background-size: contain;
    background-repeat: no-repeat
}

.simple-drop-zone-container .image-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: var(--opacity-16)
}

.simple-drop-zone-container .image-icon svg {
    width: calc(var(--size)*.5);
    height: calc(var(--size)*.5)
}

.simple-drop-zone-container .has-image .image-icon {
    display: none
}

.simple-drop-zone-container .icon {
    position: absolute;
    bottom: -2px;
    right: -2px;
    height: 2rem;
    width: 2rem;
    border-radius: var(--border-radius);
    background-color: var(--primary-color);
    border: 2px solid var(--primary-bg-color);
    display: flex;
    place-items: center;
    transition: var(--transition);
    color: var(--primary-bg-color)
}

.simple-drop-zone-container .icon svg {
    margin: 0 auto;
    stroke-width: 3
}

.simple-drop-zone-container .drop-zone.active .icon,.simple-drop-zone-container .drop-zone:hover .icon {
    background-color: var(--brand-color);
    color: #fff
}

.simple-drop-zone-container .drop-zone.active.has-image .icon {
    background-color: var(--success-color)
}

.simple-drop-zone-container .remove-button {
    position: absolute;
    top: .25rem;
    right: .25rem
}

.simple-drop-zone-container .remove-button .luma-button {
    --padding: 0.1rem;
    --height: 1.2rem
}

.simple-drop-zone-container .remove-button .luma-button svg {
    stroke-width: 3
}

.ProseMirror {
    position: relative;
    word-wrap: break-word;
    white-space: pre-wrap;
    white-space: break-spaces;
    font-variant-ligatures: none;
    font-feature-settings: "liga" 0,none
}

.ProseMirror pre {
    white-space: pre-wrap
}

.ProseMirror li {
    position: relative
}

.ProseMirror-hideselection ::selection {
    background: transparent
}

.ProseMirror-hideselection ::-moz-selection {
    background: transparent
}

.ProseMirror-hideselection {
    caret-color: transparent
}

.ProseMirror-selectednode {
    outline: 2px solid #8cf
}

li.ProseMirror-selectednode {
    outline: none
}

li.ProseMirror-selectednode:after {
    content: "";
    position: absolute;
    left: -32px;
    right: -2px;
    top: -2px;
    bottom: -2px;
    border: 2px solid #8cf;
    pointer-events: none
}

img.ProseMirror-separator {
    display: inline!important;
    border: none!important;
    margin: 0!important
}

.lux-timeline-item {
    position: relative;
    --big-icon-size: 1.75rem;
    --small-icon-size: 1.25rem;
    --icon-margin-top: 0.25rem;
    --margin-between-items: 1rem;
    --icon-size: var(--big-icon-size)
}

.lux-timeline-item.small {
    --icon-size: var(--small-icon-size);
    --icon-margin-top: 0.125rem
}

.lux-timeline-item.small .icon svg {
    width: .625rem;
    height: .625rem
}

.lux-timeline-item.small .title {
    font-size: var(--font-size-sm);
    color: var(--secondary-color-alpha)
}

.lux-timeline-item .line {
    --width: 2px;
    --border-radius: calc(var(--width) / 2);
    position: absolute;
    width: var(--width);
    background-color: var(--divider-color);
    left: calc(var(--big-icon-size)/2 - var(--width)/2)
}

.lux-timeline-item .line-bottom {
    top: calc(var(--icon-margin-top) + var(--icon-size) + 2px);
    bottom: calc(-1*var(--margin-between-items));
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.lux-timeline-item .line-top {
    top: 0;
    height: calc(var(--icon-margin-top) - 2px);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.lux-timeline-item+.lux-timeline-item {
    margin-top: var(--margin-between-items)
}

.lux-timeline-item:first-child .line-top,.lux-timeline-item:last-child .line-bottom {
    display: none
}

.lux-button-switcher {
    overflow: hidden;
    border-radius: var(--border-radius);
    background-color: var(--segment-bg-color);
    padding: var(--segment-gap)
}

.lux-button-switcher.round,.lux-button-switcher.round .slider {
    border-radius: 100px
}

.lux-button-switcher .segments {
    display: grid;
    grid-template-columns: repeat(var(--option-length),minmax(0,1fr));
    position: relative
}

.lux-button-switcher .segment {
    padding: var(--segment-padding);
    position: relative;
    color: var(--segment-color);
    border-radius: 0;
    justify-content: center
}

.lux-button-switcher .segment:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: calc(var(--border-radius)/1.25);
    outline: 2px solid transparent;
    transition: var(--transition);
    z-index: 10
}

.lux-button-switcher .segment:focus-visible {
    outline: none
}

.lux-button-switcher .segment:focus-visible:after {
    outline: 2px solid var(--outline-color)
}

.lux-button-switcher .segment:hover {
    color: var(--segment-hover-color)
}

.lux-button-switcher .segment .icon:not(:last-child) svg {
    margin-right: var(--segment-icon-gap)
}

.lux-button-switcher .segment:not(:first-child):before {
    transition: var(--transition);
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;
    content: "";
    border-left: 1px solid var(--segment-divider-color);
    z-index: 0
}

.lux-button-switcher .segment.nodivider:not(:first-child):before {
    opacity: 0
}

.lux-button-switcher .segment * {
    z-index: 2;
    position: relative
}

.lux-button-switcher .segment.selected {
    color: var(--segment-selected-color)
}

.lux-button-switcher.round .segment:after {
    border-radius: 100px
}

.lux-button-switcher .segment.selected:focus-visible+.slider {
    outline: 1px solid var(--primary-color)
}

.lux-button-switcher .slider {
    pointer-events: none;
    background-color: var(--segment-slider-bg-color);
    border-radius: calc(var(--border-radius)/1.25);
    width: calc(100%/var(--option-length));
    box-shadow: var(--shadow-xs);
    position: absolute;
    height: 100%;
    z-index: 1
}

.lux-button-switcher.always {
    padding: var(--small-segment-gap)
}

.lux-button-switcher.always .segment {
    font-size: var(--small-segment-font-size);
    padding: var(--small-segment-padding)
}

.lux-button-switcher.always .segment svg {
    width: var(--small-segment-font-size);
    height: var(--small-segment-font-size)
}

@media(max-width: 650px) {
    .lux-button-switcher.small {
        padding:var(--small-segment-gap)
    }

    .lux-button-switcher.small .segment {
        font-size: var(--small-segment-font-size);
        padding: var(--small-segment-padding)
    }

    .lux-button-switcher.small .segment svg {
        width: var(--small-segment-font-size);
        height: var(--small-segment-font-size)
    }

    .lux-button-switcher.hide-icons-small .icon {
        display: none
    }
}

@media(max-width: 450px) {
    .lux-button-switcher.tiny {
        padding:var(--small-segment-gap)
    }

    .lux-button-switcher.tiny .segment {
        font-size: var(--small-segment-font-size);
        padding: var(--small-segment-padding)
    }

    .lux-button-switcher.tiny .segment svg {
        width: var(--small-segment-font-size);
        height: var(--small-segment-font-size)
    }

    .lux-button-switcher.hide-icons-tiny .icon {
        display: none
    }
}

.luma-button {
    font-weight: var(--font-weight-medium);
    border-radius: var(--border-radius);
    position: relative;
    white-space: nowrap;
    justify-content: center;
    outline-offset: .125rem;
    outline: 2px solid transparent;
    max-width: 100%;
    min-width: 0;
    --padding: var(--input-padding);
    --size: var(--input-font-size);
    --gap: var(--input-element-gap);
    --height: var(--input-height);
    font-size: var(--size);
    padding: var(--padding);
    height: var(--height);
    width: -moz-fit-content;
    width: fit-content
}

.luma-button.round {
    border-radius: calc(var(--input-height)/2)
}

.luma-button.icon-only,.luma-button.icon-only-compact {
    flex-shrink: 0
}

.luma-button.icon-only {
    --padding: var(--button-icon-only-padding)
}

.luma-button.icon-only-compact {
    --padding: var(--button-icon-only-compact-padding);
    --height: auto
}

.luma-button:disabled {
    cursor: not-allowed
}

.luma-button.small {
    --padding: var(--small-input-padding);
    --size: var(--small-input-font-size);
    --gap: var(--small-input-element-gap);
    --height: var(--small-input-height)
}

.luma-button.small.round {
    border-radius: calc(var(--small-input-height)/2)
}

.luma-button.small.icon-only {
    --padding: var(--small-button-icon-only-padding)
}

.luma-button.small.icon-only-compact {
    --padding: var(--small-button-icon-only-compact-padding);
    --height: auto
}

.luma-button.large {
    --padding: var(--large-input-padding);
    --size: var(--large-input-font-size);
    --gap: var(--large-input-element-gap);
    --height: var(--large-input-height)
}

.luma-button.large.round {
    border-radius: calc(var(--large-input-height)/2)
}

.luma-button.large.icon-only {
    --padding: var(--large-button-icon-only-padding)
}

.luma-button.large.icon-only-compact {
    --padding: var(--large-button-icon-only-compact-padding);
    --height: auto
}

.luma-button.full-width {
    width: 100%
}

.luma-button svg {
    width: var(--size);
    height: var(--size);
    flex-shrink: 0
}

.luma-button svg:not(.spinner) {
    stroke-width: 2.5
}

.luma-button .label {
    line-height: 1;
    margin: -4px 0;
    padding: 4px 0;
    overflow: hidden;
    text-overflow: ellipsis
}

.luma-button.no-icon.loading .label {
    opacity: 0
}

.luma-button.no-icon.loading svg {
    position: absolute;
    left: calc(50% - .5*var(--size))
}

.luma-button.icon-left svg {
    margin-right: var(--gap)
}

.luma-button.icon-right svg {
    margin-left: var(--gap)
}

.luma-button.link {
    padding: 0;
    height: auto;
    border: none;
    border-radius: 0;
    outline-offset: .375rem
}

.luma-button.link svg {
    width: calc(var(--size)/1.1);
    height: calc(var(--size)/1.1)
}

.luma-button.outline {
    background-color: transparent
}

.luma-button.outline.primary {
    color: var(--primary-button-bg-color)
}

.luma-button.outline.secondary {
    color: var(--secondary-button-bg-color)
}

.luma-button.outline.brand {
    color: var(--brand-color)
}

.luma-button.outline.success {
    color: var(--success-color)
}

.luma-button.outline.error {
    color: var(--error-color)
}

.luma-button.outline.warning {
    color: var(--warning-color)
}

.luma-button.outline.light {
    color: var(--light-button-color);
    border-color: var(--light-button-color)
}

.luma-button.outline.discord {
    color: var(--discord-fg-color)
}

.luma-button.outline.ethereum {
    color: var(--ethereum-fg-color)
}

.luma-button.outline.glow {
    color: var(--glow-fg-color)
}

.luma-button.outline.google {
    color: var(--google-fg-color)
}

.luma-button.outline.slack {
    color: var(--slack-fg-color)
}

.luma-button.outline.solana {
    color: var(--solana-fg-color)
}

.luma-button.outline.twitter {
    color: var(--twitter-fg-color)
}

.luma-button.outline.youtube {
    color: var(--youtube-fg-color)
}

.luma-button.outline.zoom {
    color: var(--zoom-fg-color)
}

.luma-button.outline.microsoft {
    color: var(--microsoft-fg-color)
}

.luma-button.outline.luma-color {
    color: var(--variant-color)
}

.luma-button.link,.luma-button.naked {
    background-color: transparent
}

.luma-button.link.primary,.luma-button.naked.primary {
    color: var(--primary-button-link-color)
}

.luma-button.link.secondary,.luma-button.naked.secondary {
    color: var(--secondary-button-link-color)
}

.luma-button.link.brand,.luma-button.naked.brand {
    color: var(--brand-color)
}

.luma-button.link.success,.luma-button.naked.success {
    color: var(--success-color)
}

.luma-button.link.error,.luma-button.naked.error {
    color: var(--error-color)
}

.luma-button.link.warning,.luma-button.naked.warning {
    color: var(--warning-color)
}

.luma-button.link.light,.luma-button.naked.light {
    color: var(--light-button-color)
}

.luma-button.link.discord,.luma-button.naked.discord {
    color: var(--discord-fg-color)
}

.luma-button.link.ethereum,.luma-button.naked.ethereum {
    color: var(--ethereum-fg-color)
}

.luma-button.link.glow,.luma-button.naked.glow {
    color: var(--glow-fg-color)
}

.luma-button.link.google,.luma-button.naked.google {
    color: var(--google-fg-color)
}

.luma-button.link.slack,.luma-button.naked.slack {
    color: var(--slack-fg-color)
}

.luma-button.link.solana,.luma-button.naked.solana {
    color: var(--solana-fg-color)
}

.luma-button.link.twitter,.luma-button.naked.twitter {
    color: var(--twitter-fg-color)
}

.luma-button.link.youtube,.luma-button.naked.youtube {
    color: var(--youtube-fg-color)
}

.luma-button.link.zoom,.luma-button.naked.zoom {
    color: var(--zoom-fg-color)
}

.luma-button.link.microsoft,.luma-button.naked.microsoft {
    color: var(--microsoft-fg-color)
}

.luma-button.link.luma-color,.luma-button.naked.luma-color {
    color: var(--variant-color)
}

.luma-button.naked,.luma-button.outline,.luma-button.solid {
    border: var(--input-border-thickness) solid
}

.luma-button.naked {
    border-color: transparent!important
}

.luma-button.primary {
    border-color: var(--primary-button-bg-color)
}

.luma-button.primary.solid {
    color: var(--primary-button-color);
    background-color: var(--primary-button-bg-color)
}

@media(hover: hover) {
    .luma-button.primary:not(.link):not(:disabled):hover {
        color:var(--primary-button-color);
        background-color: var(--primary-button-hover-bg-color);
        border-color: var(--primary-button-hover-bg-color)
    }

    .luma-button.primary.link:not(:disabled):hover {
        color: var(--primary-button-hover-link-color)
    }
}

.luma-button.secondary {
    border-color: var(--secondary-button-bg-color)
}

.luma-button.secondary.solid {
    color: var(--secondary-button-color);
    background-color: var(--secondary-button-bg-color)
}

@media(hover: hover) {
    .luma-button.secondary:not(.link):not(:disabled):hover {
        color:var(--secondary-button-color);
        background-color: var(--secondary-button-hover-bg-color);
        border-color: var(--secondary-button-hover-bg-color)
    }

    .luma-button.secondary.link:not(:disabled):hover {
        color: var(--secondary-button-hover-link-color)
    }
}

.luma-button.brand {
    border-color: var(--brand-color)
}

.luma-button.brand.solid {
    color: #fff;
    background-color: var(--brand-bg-color);
    border-color: var(--brand-bg-color)
}

@media(hover: hover) {
    .luma-button.brand:not(.link):not(:disabled):hover {
        color:#fff;
        background-color: var(--brand-active-bg-color);
        border-color: var(--brand-active-bg-color)
    }

    .luma-button.brand.link:not(:disabled):hover {
        color: var(--brand-active-color)
    }
}

.luma-button.success {
    border-color: var(--success-color)
}

.luma-button.success.solid {
    color: #fff;
    border-color: var(--success-bg-color);
    background-color: var(--success-bg-color)
}

@media(hover: hover) {
    .luma-button.success:not(.link):not(:disabled):hover {
        color:#fff;
        background-color: var(--success-active-bg-color);
        border-color: var(--success-active-bg-color)
    }

    .luma-button.success.link:not(:disabled):hover {
        color: var(--success-active-color)
    }
}

.luma-button.error {
    border-color: var(--error-color)
}

.luma-button.error.solid {
    color: #fff;
    border-color: var(--error-bg-color);
    background-color: var(--error-bg-color)
}

@media(hover: hover) {
    .luma-button.error:not(.link):not(:disabled):hover {
        color:#fff;
        background-color: var(--error-active-bg-color);
        border-color: var(--error-active-bg-color)
    }

    .luma-button.error.link:not(:disabled):hover {
        color: var(--error-active-color)
    }
}

.luma-button.warning {
    border-color: var(--warning-color)
}

.luma-button.warning.solid {
    color: #fff;
    border-color: var(--warning-bg-color);
    background-color: var(--warning-bg-color)
}

@media(hover: hover) {
    .luma-button.warning:not(.link):not(:disabled):hover {
        color:#fff;
        background-color: var(--warning-active-bg-color);
        border-color: var(--warning-active-bg-color)
    }

    .luma-button.warning.link:not(:disabled):hover {
        color: var(--warning-active-color)
    }
}

.luma-button.light {
    border-color: transparent
}

.luma-button.light.solid {
    color: var(--light-button-color);
    background-color: var(--light-button-bg-color)
}

@media(hover: hover) {
    .luma-button.light:not(.link):not(:disabled):hover {
        color:var(--light-button-hover-color);
        background-color: var(--light-button-hover-bg-color);
        border-color: var(--light-button-hover-border-color)
    }

    .luma-button.light.link:not(:disabled):hover {
        color: var(--light-button-hover-bg-color)
    }
}

.luma-button.light.focused:not(.link):not(:disabled) {
    color: var(--light-button-hover-color);
    background-color: var(--light-button-hover-bg-color);
    border-color: var(--light-button-hover-border-color)
}

.luma-button.light.active:not(.link):not(:disabled) {
    border-color: var(--opacity-64);
    background-color: transparent;
    color: var(--opacity-64)
}

.luma-button.light.active.focused {
    border-color: var(--opacity-80);
    color: var(--opacity-80)
}

@media(hover: hover) {
    .luma-button.light.active:hover:not(.link):not(:disabled) {
        border-color:var(--opacity-80);
        color: var(--opacity-80)
    }
}

.luma-button.discord {
    border-color: var(--discord-bg-color)
}

.luma-button.discord.solid {
    color: var(--discord-contrast-color);
    background-color: var(--discord-bg-color)
}

.luma-button.discord.outline {
    border-color: var(--discord-fg-color)
}

@media(hover: hover) {
    .luma-button.discord:not(.link):not(:disabled):hover {
        color:var(--discord-contrast-color);
        background-color: var(--discord-active-bg-color);
        border-color: var(--discord-active-bg-color)
    }

    .luma-button.discord.link:not(:disabled):hover {
        color: var(--discord-active-fg-color)
    }
}

.luma-button.ethereum {
    border-color: var(--ethereum-bg-color)
}

.luma-button.ethereum.solid {
    color: var(--ethereum-contrast-color);
    background-color: var(--ethereum-bg-color)
}

.luma-button.ethereum.outline {
    border-color: var(--ethereum-fg-color)
}

@media(hover: hover) {
    .luma-button.ethereum:not(.link):not(:disabled):hover {
        color:var(--ethereum-contrast-color);
        background-color: var(--ethereum-active-bg-color);
        border-color: var(--ethereum-active-bg-color)
    }

    .luma-button.ethereum.link:not(:disabled):hover {
        color: var(--ethereum-active-fg-color)
    }
}

.luma-button.glow {
    border-color: var(--glow-bg-color)
}

.luma-button.glow.solid {
    color: var(--glow-contrast-color);
    background-color: var(--glow-bg-color)
}

.luma-button.glow.outline {
    border-color: var(--glow-fg-color)
}

@media(hover: hover) {
    .luma-button.glow:not(.link):not(:disabled):hover {
        color:var(--glow-contrast-color);
        background-color: var(--glow-active-bg-color);
        border-color: var(--glow-active-bg-color)
    }

    .luma-button.glow.link:not(:disabled):hover {
        color: var(--glow-active-fg-color)
    }
}

.luma-button.google {
    border-color: var(--google-bg-color)
}

.luma-button.google.solid {
    color: var(--google-contrast-color);
    background-color: var(--google-bg-color)
}

.luma-button.google.outline {
    border-color: var(--google-fg-color)
}

@media(hover: hover) {
    .luma-button.google:not(.link):not(:disabled):hover {
        color:var(--google-contrast-color);
        background-color: var(--google-active-bg-color);
        border-color: var(--google-active-bg-color)
    }

    .luma-button.google.link:not(:disabled):hover {
        color: var(--google-active-fg-color)
    }
}

.luma-button.slack {
    border-color: var(--slack-bg-color)
}

.luma-button.slack.solid {
    color: var(--slack-contrast-color);
    background-color: var(--slack-bg-color)
}

.luma-button.slack.outline {
    border-color: var(--slack-fg-color)
}

@media(hover: hover) {
    .luma-button.slack:not(.link):not(:disabled):hover {
        color:var(--slack-contrast-color);
        background-color: var(--slack-active-bg-color);
        border-color: var(--slack-active-bg-color)
    }

    .luma-button.slack.link:not(:disabled):hover {
        color: var(--slack-active-fg-color)
    }
}

.luma-button.solana {
    border-color: var(--solana-bg-color)
}

.luma-button.solana.solid {
    color: var(--solana-contrast-color);
    background-color: var(--solana-bg-color)
}

.luma-button.solana.outline {
    border-color: var(--solana-fg-color)
}

@media(hover: hover) {
    .luma-button.solana:not(.link):not(:disabled):hover {
        color:var(--solana-contrast-color);
        background-color: var(--solana-active-bg-color);
        border-color: var(--solana-active-bg-color)
    }

    .luma-button.solana.link:not(:disabled):hover {
        color: var(--solana-active-fg-color)
    }
}

.luma-button.twitter {
    border-color: var(--twitter-bg-color)
}

.luma-button.twitter.solid {
    color: var(--twitter-contrast-color);
    background-color: var(--twitter-bg-color)
}

.luma-button.twitter.outline {
    border-color: var(--twitter-fg-color)
}

@media(hover: hover) {
    .luma-button.twitter:not(.link):not(:disabled):hover {
        color:var(--twitter-contrast-color);
        background-color: var(--twitter-active-bg-color);
        border-color: var(--twitter-active-bg-color)
    }

    .luma-button.twitter.link:not(:disabled):hover {
        color: var(--twitter-active-fg-color)
    }
}

.luma-button.youtube {
    border-color: var(--youtube-bg-color)
}

.luma-button.youtube.solid {
    color: var(--youtube-contrast-color);
    background-color: var(--youtube-bg-color)
}

.luma-button.youtube.outline {
    border-color: var(--youtube-fg-color)
}

@media(hover: hover) {
    .luma-button.youtube:not(.link):not(:disabled):hover {
        color:var(--youtube-contrast-color);
        background-color: var(--youtube-active-bg-color);
        border-color: var(--youtube-active-bg-color)
    }

    .luma-button.youtube.link:not(:disabled):hover {
        color: var(--youtube-active-fg-color)
    }
}

.luma-button.zoom {
    border-color: var(--zoom-bg-color)
}

.luma-button.zoom.solid {
    color: var(--zoom-contrast-color);
    background-color: var(--zoom-bg-color)
}

.luma-button.zoom.outline {
    border-color: var(--zoom-fg-color)
}

@media(hover: hover) {
    .luma-button.zoom:not(.link):not(:disabled):hover {
        color:var(--zoom-contrast-color);
        background-color: var(--zoom-active-bg-color);
        border-color: var(--zoom-active-bg-color)
    }

    .luma-button.zoom.link:not(:disabled):hover {
        color: var(--zoom-active-fg-color)
    }
}

.luma-button.microsoft {
    border-color: var(--microsoft-bg-color)
}

.luma-button.microsoft.solid {
    color: var(--microsoft-contrast-color);
    background-color: var(--microsoft-bg-color)
}

.luma-button.microsoft.outline {
    border-color: var(--microsoft-fg-color)
}

@media(hover: hover) {
    .luma-button.microsoft:not(.link):not(:disabled):hover {
        color:var(--microsoft-contrast-color);
        background-color: var(--microsoft-active-bg-color);
        border-color: var(--microsoft-active-bg-color)
    }

    .luma-button.microsoft.link:not(:disabled):hover {
        color: var(--microsoft-active-fg-color)
    }
}

.luma-button.luma-color.solid {
    color: var(--variant-color);
    background-color: var(--variant-color-pale);
    border-color: var(--variant-color-pale)
}

.luma-button.luma-color.outline {
    border-color: var(--variant-color)
}

@media(hover: hover) {
    .luma-button.luma-color:not(:disabled):hover {
        border-color:var(--variant-color)
    }

    .luma-button.luma-color.naked:not(:disabled):hover,.luma-button.luma-color.outline:not(:disabled):hover {
        color: #fff;
        background-color: var(--variant-color-bg);
        border-color: var(--variant-color-bg)
    }

    .luma-button.luma-color.link:not(:disabled):hover {
        color: var(--variant-color-active)
    }
}

.luma-button:focus-visible.primary,:focus-visible .luma-button.primary {
    outline: var(--primary-button-bg-color) solid 2px
}

.luma-button:focus-visible.secondary,:focus-visible .luma-button.secondary {
    outline: var(--secondary-button-bg-color) solid 2px
}

.luma-button:focus-visible.brand,:focus-visible .luma-button.brand {
    outline: var(--brand-bg-color) solid 2px
}

.luma-button:focus-visible.brand.link,.luma-button:focus-visible.brand.naked,.luma-button:focus-visible.brand.outline,:focus-visible .luma-button.brand.link,:focus-visible .luma-button.brand.naked,:focus-visible .luma-button.brand.outline {
    outline: var(--brand-color) solid 2px
}

.luma-button:focus-visible.success,:focus-visible .luma-button.success {
    outline: var(--success-bg-color) solid 2px
}

.luma-button:focus-visible.success.link,.luma-button:focus-visible.success.naked,.luma-button:focus-visible.success.outline,:focus-visible .luma-button.success.link,:focus-visible .luma-button.success.naked,:focus-visible .luma-button.success.outline {
    outline: var(--success-color) solid 2px
}

.luma-button:focus-visible.error,:focus-visible .luma-button.error {
    outline: var(--error-bg-color) solid 2px
}

.luma-button:focus-visible.error.link,.luma-button:focus-visible.error.naked,.luma-button:focus-visible.error.outline,:focus-visible .luma-button.error.link,:focus-visible .luma-button.error.naked,:focus-visible .luma-button.error.outline {
    outline: var(--error-color) solid 2px
}

.luma-button:focus-visible.warning,:focus-visible .luma-button.warning {
    outline: var(--warning-bg-color) solid 2px
}

.luma-button:focus-visible.warning.link,.luma-button:focus-visible.warning.naked,.luma-button:focus-visible.warning.outline,:focus-visible .luma-button.warning.link,:focus-visible .luma-button.warning.naked,:focus-visible .luma-button.warning.outline {
    outline: var(--warning-color) solid 2px
}

.luma-button:focus-visible.light,:focus-visible .luma-button.light {
    outline: var(--light-button-color) solid 2px
}

.luma-button:focus-visible.discord,:focus-visible .luma-button.discord {
    outline: var(--discord-fg-color) solid 2px
}

.luma-button:focus-visible.ethereum,:focus-visible .luma-button.ethereum {
    outline: var(--ethereum-fg-color) solid 2px
}

.luma-button:focus-visible.glow,:focus-visible .luma-button.glow {
    outline: var(--glow-fg-color) solid 2px
}

.luma-button:focus-visible.google,:focus-visible .luma-button.google {
    outline: var(--google-fg-color) solid 2px
}

.luma-button:focus-visible.slack,:focus-visible .luma-button.slack {
    outline: var(--slack-fg-color) solid 2px
}

.luma-button:focus-visible.twitter,:focus-visible .luma-button.twitter {
    outline: var(--twitter-fg-color) solid 2px
}

.luma-button:focus-visible.solana,:focus-visible .luma-button.solana {
    outline: var(--solana-fg-color) solid 2px
}

.luma-button:focus-visible.youtube,:focus-visible .luma-button.youtube {
    outline: var(--youtube-fg-color) solid 2px
}

.luma-button:focus-visible.zoom,:focus-visible .luma-button.zoom {
    outline: var(--zoom-fg-color) solid 2px
}

.luma-button:focus-visible.microsoft,:focus-visible .luma-button.microsoft {
    outline: var(--microsoft-fg-color) solid 2px
}

.luma-button:focus-visible.luma-color,:focus-visible .luma-button.luma-color {
    outline: var(--variant-color) solid 2px
}

.lux-checkbox {
    position: relative;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1.25rem;
    clear: both;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.lux-checkbox label {
    margin-bottom: 0
}

.lux-checkbox .text-label {
    flex: 1 1;
    cursor: pointer;
    line-height: 1.5;
    margin-left: .25rem
}

.lux-checkbox .checkbox-text {
    word-break: break-word
}

.lux-checkbox .checkbox-title {
    font-size: var(--font-size-md);
    margin-bottom: 1px
}

.lux-checkbox .checkbox-desc {
    font-size: var(--font-size-sm)
}

@media(max-width: 450px) {
    .lux-checkbox .checkbox-desc {
        font-size:var(--font-size-xs)
    }
}

.lux-checkbox .checkbox-icon {
    display: block;
    position: relative;
    margin-right: .5rem;
    font-size: .5rem;
    line-height: 1.25rem;
    height: 1.25rem;
    width: 1.25rem;
    clear: both
}

.lux-checkbox .checkbox-icon .input {
    opacity: 0;
    cursor: pointer
}

.lux-checkbox .checkbox-icon .checkbox-display,.lux-checkbox .checkbox-icon .input {
    position: absolute;
    top: 0;
    left: 0;
    height: 1.25rem;
    width: 1.25rem
}

.lux-checkbox .checkbox-icon .checkbox-display {
    cursor: pointer;
    transition: var(--fast-transition);
    transition-property: border-color;
    border-radius: .375rem;
    background-color: var(--checkbox-bg-color);
    border: .125rem solid var(--checkbox-border-color);
    box-shadow: var(--checkbox-box-shadow);
    padding: .25rem
}

.lux-checkbox .checkbox-icon .checkbox-display svg {
    transition: var(--fast-transition);
    width: .75rem;
    height: .75rem;
    opacity: 0;
    transform-origin: center;
    transform: scale(.5) rotate(-45deg);
    color: var(--checkbox-check-color)
}

.lux-checkbox .checkbox-icon input:checked~.checkbox-display {
    border: none;
    background-color: var(--checkbox-checked-bg-color)
}

.lux-checkbox .checkbox-icon input:checked~.checkbox-display svg {
    opacity: 1;
    transform: none
}

.lux-checkbox:hover .checkbox-icon .checkbox-display {
    border-color: var(--checkbox-hover-border-color)
}

.lux-checkbox:has(input:focus-visible) .checkbox-icon .checkbox-display {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px
}

.lux-checkbox.danger .checkbox-display svg {
    color: #fff
}

.lux-checkbox.danger label {
    color: var(--error-color)
}

.lux-checkbox.danger input:checked~.checkbox-display {
    background-color: var(--error-color)
}

.lux-checkbox.danger .checkbox-icon .checkbox-display {
    border-color: var(--error-pale-bg-color)
}

.lux-checkbox.danger:hover .checkbox-icon .checkbox-display {
    border-color: var(--error-color)
}

.lux-checkbox.danger:has(input:focus-visible) .checkbox-icon .checkbox-display {
    outline: 2px solid var(--error-color)
}

.lux-code-block {
    --code-block-bg-color: var(--elevated-primary-bg-color);
    --code-block-selection-bg-color: var(--opacity-8);
    --code-block-color: var(--primary-color)
}

.theme-root .lux-code-block code[class*=language-],.theme-root .lux-code-block pre[class*=language-] {
    background: var(--code-block-bg-color);
    color: var(--code-block-color);
    font-family: var(--mono-font);
    direction: ltr;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    line-height: 1.5;
    -webkit-hyphens: none;
    hyphens: none
}

.theme-root .lux-code-block pre[class*=language-] {
    padding: .75rem 1rem;
    margin: 0;
    overflow: auto;
    border-radius: var(--border-radius)
}

.theme-root .lux-code-block :not(pre)>code[class*=language-] {
    padding: .2rem .3rem;
    border-radius: .3rem;
    white-space: normal
}

.theme-root .lux-code-block .token.cdata,.theme-root .lux-code-block .token.comment,.theme-root .lux-code-block .token.prolog {
    color: #9fa0a6
}

.theme-root .lux-code-block .token.doctype,.theme-root .lux-code-block .token.entity,.theme-root .lux-code-block .token.punctuation {
    color: #383942
}

.theme-root .lux-code-block .token.atrule,.theme-root .lux-code-block .token.attr-name,.theme-root .lux-code-block .token.boolean,.theme-root .lux-code-block .token.class-name,.theme-root .lux-code-block .token.constant,.theme-root .lux-code-block .token.number {
    color: #b66a00
}

.theme-root .lux-code-block .token.keyword {
    color: #a625a4
}

.theme-root .lux-code-block .token.deleted,.theme-root .lux-code-block .token.important,.theme-root .lux-code-block .token.property,.theme-root .lux-code-block .token.symbol,.theme-root .lux-code-block .token.tag {
    color: #e35549
}

.theme-root .lux-code-block .token.attr-value,.theme-root .lux-code-block .token.attr-value>.token.punctuation,.theme-root .lux-code-block .token.builtin,.theme-root .lux-code-block .token.char,.theme-root .lux-code-block .token.inserted,.theme-root .lux-code-block .token.regex,.theme-root .lux-code-block .token.selector,.theme-root .lux-code-block .token.string {
    color: #50a04f
}

.theme-root .lux-code-block .token.function,.theme-root .lux-code-block .token.operator,.theme-root .lux-code-block .token.variable {
    color: #4078f1
}

.theme-root .lux-code-block .token.url {
    color: #0083bb
}

.theme-root .lux-code-block .token.attr-value>.token.punctuation.attr-equals,.theme-root .lux-code-block .token.special-attr>.token.attr-value>.token.value.css {
    color: #383942
}

.theme-root .lux-code-block .language-css .token.selector {
    color: #e35549
}

.theme-root .lux-code-block .language-css .token.property {
    color: #383942
}

.theme-root .lux-code-block .language-css .token.function,.theme-root .lux-code-block .language-css .token.url>.token.function {
    color: #0083bb
}

.theme-root .lux-code-block .language-css .token.url>.token.string.url {
    color: #50a04f
}

.theme-root .lux-code-block .language-css .token.atrule .token.rule,.theme-root .lux-code-block .language-css .token.important,.theme-root .lux-code-block .language-javascript .token.operator {
    color: #a625a4
}

.theme-root .lux-code-block .language-javascript .token.template-string>.token.interpolation>.token.interpolation-punctuation.punctuation {
    color: #c91142
}

.theme-root .lux-code-block .language-json .token.operator {
    color: #383942
}

.theme-root .lux-code-block .language-json .token.null.keyword {
    color: #b66a00
}

.theme-root .lux-code-block .language-markdown .token.url,.theme-root .lux-code-block .language-markdown .token.url-reference.url>.token.string,.theme-root .lux-code-block .language-markdown .token.url>.token.operator {
    color: #383942
}

.theme-root .lux-code-block .language-markdown .token.url>.token.content {
    color: #4078f1
}

.theme-root .lux-code-block .language-markdown .token.url-reference.url,.theme-root .lux-code-block .language-markdown .token.url>.token.url {
    color: #0083bb
}

.theme-root .lux-code-block .language-markdown .token.blockquote.punctuation,.theme-root .lux-code-block .language-markdown .token.hr.punctuation {
    color: #9fa0a6;
    font-style: italic
}

.theme-root .lux-code-block .language-markdown .token.code-snippet {
    color: #50a04f
}

.theme-root .lux-code-block .language-markdown .token.bold .token.content {
    color: #b66a00
}

.theme-root .lux-code-block .language-markdown .token.italic .token.content {
    color: #a625a4
}

.theme-root .lux-code-block .language-markdown .token.list.punctuation,.theme-root .lux-code-block .language-markdown .token.strike .token.content,.theme-root .lux-code-block .language-markdown .token.strike .token.punctuation,.theme-root .lux-code-block .language-markdown .token.title.important>.token.punctuation {
    color: #e35549
}

.theme-root .lux-code-block .token.bold {
    font-weight: 700
}

.theme-root .lux-code-block .token.comment,.theme-root .lux-code-block .token.italic {
    font-style: italic
}

.theme-root .lux-code-block .token.entity {
    cursor: help
}

.theme-root .lux-code-block .token.namespace {
    opacity: .8
}

.theme-root .lux-code-block .token.token.cr:before,.theme-root .lux-code-block .token.token.lf:before,.theme-root .lux-code-block .token.token.space:before,.theme-root .lux-code-block .token.token.tab:not(:empty):before {
    color: rgba(56,58,66,.2)
}

.theme-root .lux-code-block .line-highlight.line-highlight {
    background: rgba(56,58,66,.05)
}

.theme-root .lux-code-block .line-highlight.line-highlight:before,.theme-root .lux-code-block .line-highlight.line-highlight[data-end]:after {
    background: #e5e5e5;
    color: #383942;
    padding: .1rem .6rem;
    border-radius: .3rem;
    box-shadow: 0 2px 0 0 rgba(0,0,0,.2)
}

.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-1,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-5,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-9 {
    color: #e35549
}

.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-10,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-2,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-6 {
    color: #50a04f
}

.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-11,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-3,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-7 {
    color: #4078f1
}

.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-12,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-4,.theme-root .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-8 {
    color: #a625a4
}

.theme-root .lux-code-block .prism-previewer-gradient.prism-previewer-gradient div,.theme-root .lux-code-block .prism-previewer.prism-previewer:before {
    border-color: #f2f2f2
}

.theme-root .lux-code-block .prism-previewer-color.prism-previewer-color:before,.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing:before,.theme-root .lux-code-block .prism-previewer-gradient.prism-previewer-gradient div {
    border-radius: .3rem
}

.theme-root .lux-code-block .prism-previewer.prism-previewer:after {
    border-top-color: #f2f2f2
}

.theme-root .lux-code-block .prism-previewer-flipped.prism-previewer-flipped.after {
    border-bottom-color: #f2f2f2
}

.theme-root .lux-code-block .prism-previewer-angle.prism-previewer-angle:before,.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing,.theme-root .lux-code-block .prism-previewer-time.prism-previewer-time:before {
    background: #fff
}

.theme-root .lux-code-block .prism-previewer-angle.prism-previewer-angle circle,.theme-root .lux-code-block .prism-previewer-time.prism-previewer-time circle {
    stroke: #383942;
    stroke-opacity: 1
}

.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing circle,.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing line,.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing path {
    stroke: #383942
}

.theme-root .lux-code-block .prism-previewer-easing.prism-previewer-easing circle {
    fill: transparent
}

.theme-root.dark .lux-code-block code[class*=language-],.theme-root.dark .lux-code-block pre[class*=language-] {
    text-shadow: 0 1px rgba(0,0,0,.3)
}

.theme-root.dark .lux-code-block .token.cdata,.theme-root.dark .lux-code-block .token.comment,.theme-root.dark .lux-code-block .token.prolog {
    color: #5b6270
}

.theme-root.dark .lux-code-block .token.doctype,.theme-root.dark .lux-code-block .token.entity,.theme-root.dark .lux-code-block .token.punctuation {
    color: #aab1bf
}

.theme-root.dark .lux-code-block .token.atrule,.theme-root.dark .lux-code-block .token.attr-name,.theme-root.dark .lux-code-block .token.boolean,.theme-root.dark .lux-code-block .token.class-name,.theme-root.dark .lux-code-block .token.constant,.theme-root.dark .lux-code-block .token.number {
    color: #d19965
}

.theme-root.dark .lux-code-block .token.keyword {
    color: #c578dd
}

.theme-root.dark .lux-code-block .token.deleted,.theme-root.dark .lux-code-block .token.important,.theme-root.dark .lux-code-block .token.property,.theme-root.dark .lux-code-block .token.symbol,.theme-root.dark .lux-code-block .token.tag {
    color: #df6b75
}

.theme-root.dark .lux-code-block .token.attr-value,.theme-root.dark .lux-code-block .token.attr-value>.token.punctuation,.theme-root.dark .lux-code-block .token.builtin,.theme-root.dark .lux-code-block .token.char,.theme-root.dark .lux-code-block .token.inserted,.theme-root.dark .lux-code-block .token.regex,.theme-root.dark .lux-code-block .token.selector,.theme-root.dark .lux-code-block .token.string {
    color: #97c279
}

.theme-root.dark .lux-code-block .token.function,.theme-root.dark .lux-code-block .token.operator,.theme-root.dark .lux-code-block .token.variable {
    color: #61afef
}

.theme-root.dark .lux-code-block .token.url {
    color: #56b5c2
}

.theme-root.dark .lux-code-block .token.attr-value>.token.punctuation.attr-equals,.theme-root.dark .lux-code-block .token.special-attr>.token.attr-value>.token.value.css {
    color: #aab1bf
}

.theme-root.dark .lux-code-block .language-css .token.selector {
    color: #df6b75
}

.theme-root.dark .lux-code-block .language-css .token.property {
    color: #aab1bf
}

.theme-root.dark .lux-code-block .language-css .token.function,.theme-root.dark .lux-code-block .language-css .token.url>.token.function {
    color: #56b5c2
}

.theme-root.dark .lux-code-block .language-css .token.url>.token.string.url {
    color: #97c279
}

.theme-root.dark .lux-code-block .language-css .token.atrule .token.rule,.theme-root.dark .lux-code-block .language-css .token.important,.theme-root.dark .lux-code-block .language-javascript .token.operator {
    color: #c578dd
}

.theme-root.dark .lux-code-block .language-javascript .token.template-string>.token.interpolation>.token.interpolation-punctuation.punctuation {
    color: #be5046
}

.theme-root.dark .lux-code-block .language-json .token.operator {
    color: #aab1bf
}

.theme-root.dark .lux-code-block .language-json .token.null.keyword {
    color: #d19965
}

.theme-root.dark .lux-code-block .language-markdown .token.url,.theme-root.dark .lux-code-block .language-markdown .token.url-reference.url>.token.string,.theme-root.dark .lux-code-block .language-markdown .token.url>.token.operator {
    color: #aab1bf
}

.theme-root.dark .lux-code-block .language-markdown .token.url>.token.content {
    color: #61afef
}

.theme-root.dark .lux-code-block .language-markdown .token.url-reference.url,.theme-root.dark .lux-code-block .language-markdown .token.url>.token.url {
    color: #56b5c2
}

.theme-root.dark .lux-code-block .language-markdown .token.blockquote.punctuation,.theme-root.dark .lux-code-block .language-markdown .token.hr.punctuation {
    color: #5b6270
}

.theme-root.dark .lux-code-block .language-markdown .token.code-snippet {
    color: #97c279
}

.theme-root.dark .lux-code-block .language-markdown .token.bold .token.content {
    color: #d19965
}

.theme-root.dark .lux-code-block .language-markdown .token.italic .token.content {
    color: #c578dd
}

.theme-root.dark .lux-code-block .language-markdown .token.list.punctuation,.theme-root.dark .lux-code-block .language-markdown .token.strike .token.content,.theme-root.dark .lux-code-block .language-markdown .token.strike .token.punctuation,.theme-root.dark .lux-code-block .language-markdown .token.title.important>.token.punctuation {
    color: #df6b75
}

.theme-root.dark .lux-code-block .token.token.cr:before,.theme-root.dark .lux-code-block .token.token.lf:before,.theme-root.dark .lux-code-block .token.token.space:before,.theme-root.dark .lux-code-block .token.token.tab:not(:empty):before {
    color: rgba(171,178,191,.15)
}

.theme-root.dark .lux-code-block .line-highlight.line-highlight {
    background: rgba(153,187,255,.04)
}

.theme-root.dark .lux-code-block .line-highlight.line-highlight:before,.theme-root.dark .lux-code-block .line-highlight.line-highlight[data-end]:after {
    background: #393f4a;
    color: #aab1bf;
    box-shadow: 0 2px 0 0 rgba(0,0,0,.2)
}

.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-1,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-5,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-9 {
    color: #df6b75
}

.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-10,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-2,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-6 {
    color: #97c279
}

.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-11,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-3,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-7 {
    color: #61afef
}

.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-12,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-4,.theme-root.dark .lux-code-block .rainbow-braces .token.token.punctuation.brace-level-8 {
    color: #c578dd
}

.theme-root.dark .lux-code-block .prism-previewer-gradient.prism-previewer-gradient div,.theme-root.dark .lux-code-block .prism-previewer.prism-previewer:before {
    border-color: #252830
}

.theme-root.dark .lux-code-block .prism-previewer.prism-previewer:after {
    border-top-color: #252830
}

.theme-root.dark .lux-code-block .prism-previewer-flipped.prism-previewer-flipped.after {
    border-bottom-color: #252830
}

.theme-root.dark .lux-code-block .prism-previewer-angle.prism-previewer-angle:before,.theme-root.dark .lux-code-block .prism-previewer-easing.prism-previewer-easing,.theme-root.dark .lux-code-block .prism-previewer-time.prism-previewer-time:before {
    background: #30353f
}

.theme-root.dark .lux-code-block .prism-previewer-angle.prism-previewer-angle circle,.theme-root.dark .lux-code-block .prism-previewer-time.prism-previewer-time circle {
    stroke: #aab1bf;
    stroke-opacity: 1
}

.theme-root.dark .lux-code-block .prism-previewer-easing.prism-previewer-easing circle,.theme-root.dark .lux-code-block .prism-previewer-easing.prism-previewer-easing line,.theme-root.dark .lux-code-block .prism-previewer-easing.prism-previewer-easing path {
    stroke: #aab1bf
}

.lux-empty-state {
    text-align: center;
    margin-top: 4rem
}

.lux-empty-state.large h3 {
    font-size: var(--font-size-xxxl);
    font-weight: var(--font-weight-medium)
}

@media(max-width: 450px) {
    .lux-empty-state.large h3 {
        font-size:var(--font-size-lg);
        font-weight: var(--font-weight-bold)
    }
}

.lux-empty-state .icon.regular svg {
    width: 4rem;
    height: 4rem;
    color: var(--tertiary-color-alpha)
}

.lux-empty-state .icon.square-illustration svg {
    width: 4rem;
    height: 4rem
}

.lux-empty-state .icon.illustration svg {
    shape-rendering: crispEdges;
    width: 250px;
    height: auto
}

@media(max-width: 450px) {
    .lux-empty-state .icon.illustration svg {
        width:200px
    }
}

.lux-empty-state .icon.round {
    width: 4rem;
    height: 4rem;
    background-color: var(--secondary-bg-color);
    border-radius: 50%;
    overflow: hidden
}

.lux-empty-state .icon.round svg {
    width: 2rem;
    height: 2rem;
    color: var(--quaternary-bg-color)
}

.lux-empty-state .desc {
    padding-left: 3rem;
    padding-right: 3rem
}

@media(max-width: 650px) {
    .lux-empty-state .desc {
        padding-left:1rem;
        padding-right: 1rem
    }
}

.lux-empty-state img {
    max-width: 250px
}

@media(max-width: 450px) {
    .lux-empty-state img {
        max-width:200px
    }
}

.lux-input-label {
    display: block;
    margin-bottom: .375rem;
    font-weight: var(--font-weight-medium);
    color: var(--secondary-color-alpha);
    transition: var(--transition)
}

.lux-input-label.clickable {
    cursor: pointer
}

.lux-input-label.clickable:hover,.lux-input-label.focused {
    color: var(--input-focus-border-color)
}

.lux-input-label.no-margin {
    margin-bottom: 0
}

.lux-input-label.medium {
    font-size: var(--input-label-font-size)
}

.lux-input-label.large {
    font-size: var(--large-input-label-font-size)
}

.lux-input-wrapper .accessory-text {
    line-height: var(--input-line-height);
    color: var(--input-accessory-text-color);
    background-color: var(--input-accessory-text-bg-color);
    border: 1px solid var(--input-border-color);
    border-radius: var(--border-radius)
}

.lux-input-wrapper.accessory-left .accessory-text {
    border-right: 0;
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important
}

.lux-input-wrapper.accessory-left .luma-input {
    border-top-left-radius: 0!important;
    border-bottom-left-radius: 0!important
}

.lux-input-wrapper.accessory-right .accessory-text {
    border-left: 0;
    border-top-left-radius: 0!important;
    border-bottom-left-radius: 0!important
}

.lux-input-wrapper.accessory-right .luma-input {
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important
}

.lux-input-wrapper.solid .luma-input {
    background-color: var(--solid-input-bg-color);
    border-color: var(--solid-input-border-color)
}

.lux-input-wrapper.solid .luma-input:hover {
    background-color: var(--solid-input-hover-bg-color)
}

.lux-input-wrapper.solid .luma-input:focus {
    background-color: var(--input-focus-bg-color);
    border-color: var(--input-focus-border-color)
}

.lux-input-wrapper.solid .accessory-text {
    border-color: var(--solid-input-bg-color);
    background-color: var(--primary-bg-color)
}

.lux-input-wrapper textarea.luma-input {
    vertical-align: top;
    line-height: var(--input-textarea-line-height)
}

.lux-input-wrapper.medium .accessory-text,.lux-input-wrapper.medium .luma-input {
    font-size: var(--input-font-size);
    height: var(--input-height);
    padding: var(--input-padding)
}

.lux-input-wrapper.medium textarea.luma-input {
    padding: var(--input-textarea-padding);
    scroll-padding-block: var(--input-textarea-vertical-padding)
}

.lux-input-wrapper.medium.round .accessory-text,.lux-input-wrapper.medium.round .luma-input {
    border-radius: calc(var(--input-height)/2)
}

.lux-input-wrapper.large .helper-text {
    font-size: var(--large-input-label-font-size)
}

.lux-input-wrapper.large .accessory-text,.lux-input-wrapper.large .luma-input {
    font-size: var(--large-input-font-size);
    height: var(--large-input-height);
    padding: var(--large-input-padding)
}

.lux-input-wrapper.large textarea.luma-input {
    padding: var(--large-input-textarea-padding);
    scroll-padding-block: var(--large-input-textarea-vertical-padding)
}

.lux-input-wrapper.large.round .accessory-text,.lux-input-wrapper.large.round .luma-input {
    border-radius: calc(var(--large-input-height)/2)
}

.lux-input-wrapper .input-inner-wrapper {
    position: relative
}

.lux-input-wrapper .luma-input.align-right {
    text-align: right
}

.lux-input-wrapper .luma-input.monospace {
    font-family: var(--mono-font)
}

.lux-input-wrapper .clear-button {
    position: absolute;
    right: 0;
    bottom: 50%;
    transform: translateY(50%);
    padding: var(--input-vertical-padding) .6875rem;
    color: var(--opacity-24)
}

.lux-input-wrapper .clear-button.with-indicator {
    right: 1.5rem
}

.lux-input-wrapper .clear-button:not(.shown) {
    pointer-events: none;
    opacity: 0
}

.lux-input-wrapper .clear-button:hover {
    color: var(--secondary-color-alpha)
}

.lux-input-wrapper .clear-button:focus-visible {
    color: var(--primary-color);
    outline: none
}

.lux-input-wrapper .clear-button.invisible {
    pointer-events: none;
    opacity: 0
}

.lux-input-wrapper .clear-button svg {
    width: var(--clear-button-size,1rem);
    height: var(--clear-button-size,1rem)
}

.lux-input-wrapper .luma-input.align-right~.clear-button.with-indicator {
    right: 0
}

.lux-input-wrapper .indicator {
    position: absolute;
    right: .75rem;
    bottom: 50%;
    transform: translateY(50%);
    color: var(--warning-color);
    transition: opacity var(--transition-duration) var(--transition-fn);
    width: 1rem;
    height: 1rem;
    opacity: 1
}

.lux-input-wrapper .indicator.invisible {
    pointer-events: none;
    opacity: 0
}

.lux-input-wrapper .indicator svg {
    stroke-width: 3px
}

.lux-input-wrapper .indicator.success {
    color: var(--success-color)
}

.lux-input-wrapper .indicator.error {
    color: var(--error-color)
}

.lux-input-wrapper .indicator.custom {
    color: var(--input-indicator-color,var(--opacity-24))
}

.lux-input-wrapper .luma-input:not(.align-right).has-indicator {
    padding-right: 2.25rem
}

.lux-input-wrapper .luma-input:not(.align-right).clearable {
    padding-right: 2.5rem
}

.lux-input-wrapper .luma-input:not(.align-right).clearable.has-indicator {
    padding-right: 4rem
}

.lux-input-wrapper .luma-input.align-right.has-indicator {
    padding-left: 2.25rem
}

.lux-input-wrapper .luma-input.align-right.has-indicator~.indicator {
    right: auto;
    left: .75rem
}

.lux-input-wrapper .luma-input.align-right.clearable {
    padding-right: 2.5rem
}

.lux-input-wrapper input:disabled,.lux-input-wrapper textarea:disabled {
    background-color: var(--disabled-background-color)
}

.lux-input-wrapper .input-inner-wrapper.large .indicator,.lux-input-wrapper .input-inner-wrapper.large .indicator svg {
    width: var(--large-input-font-size);
    height: var(--large-input-font-size)
}

.lux-input-wrapper .input-inner-wrapper.large .luma-input.has-indicator:not(.align-right) {
    padding-right: 2.5rem
}

.lux-input-wrapper .input-inner-wrapper.large .luma-input.align-right.has-indicator {
    padding-left: 2.5rem
}

textarea.luma-input {
    transition: var(--transition),height 0s
}

.luma-input.luma-input-scrollable {
    overflow: auto
}

.lux-menu-trigger-wrapper {
    display: inline-flex;
    min-width: 0;
    scroll-margin-top: 4rem;
    outline: 0
}

.lux-menu-trigger-wrapper.disabled {
    pointer-events: none
}

.lux-menu {
    --lux-menu-horizontal-padding: 0.25rem;
    position: relative;
    border-radius: var(--menu-border-radius);
    outline: 1px solid var(--menu-border-color);
    max-height: inherit;
    background-color: var(--menu-bg-color)
}

.lux-menu-divider {
    height: 1px;
    background-color: var(--divider-color);
    margin: .25rem calc(-1*var(--lux-menu-horizontal-padding));
    width: calc(100% + 2*var(--lux-menu-horizontal-padding))
}

.lux-menu-arrow {
    position: absolute;
    -webkit-clip-path: polygon(100% 0,0 0,50% 100%);
    clip-path: polygon(100% 0,0 0,50% 100%);
    width: 10px;
    height: 5px;
    background-color: var(--menu-bg-color);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px)
}

.lux-menu-arrow:not(.flipped) {
    transform: rotate(180deg)
}

.lux-menu-wrapper {
    --menu-border-radius: var(--border-radius);
    z-index: 1001;
    border-radius: var(--menu-border-radius);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px)
}

@media(hover: none) {
    .lux-menu-wrapper.hover {
        display:none
    }
}

.lux-menu-wrapper.inverted {
    --menu-bg-color: var(--menu-inverted-bg-color);
    --menu-border-color: var(--menu-inverted-border-color)
}

.lux-menu-content:not(.full) {
    min-width: 120px;
    max-width: 260px
}

.lux-menu-content.full {
    width: var(--trigger-width)
}

.lux-menu-search-wrapper {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    background-color: var(--menu-search-bg-color);
    border-bottom: 1px solid var(--menu-search-divider-color);
    z-index: 2;
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.lux-menu-search-wrapper:last-child {
    border-bottom-color: var(--opacity-0)
}

.lux-menu-search-wrapper input {
    background-color: transparent;
    border: 0;
    padding: .375rem .75rem;
    outline: 0;
    width: 100%;
    color: var(--input-color)
}

.lux-menu-content .rows {
    padding: .25rem var(--lux-menu-horizontal-padding)
}

.lux-menu-content .create-row,.lux-menu-content .no-result {
    font-size: var(--font-size-sm);
    padding: .375rem .5rem;
    border-radius: var(--small-border-radius)
}

.lux-menu-content .no-result {
    color: var(--menu-no-result-color)
}

.lux-menu-content .create-row {
    cursor: pointer
}

.lux-menu-content .create-row .icon {
    margin-right: .625rem;
    width: 1rem;
    height: 1rem;
    color: var(--menu-item-icon-color)
}

.lux-menu-content .create-row .icon :global(svg) {
    width: 1rem;
    height: 1rem
}

.lux-menu-content .create-row span {
    font-weight: var(--font-weight-medium)
}

.lux-menu-content .create-row.selected {
    color: var(--menu-item-hover-color);
    background-color: var(--menu-item-hover-bg-color)
}

.lux-menu-content .create-row.selected .icon {
    color: var(--menu-item-icon-hover-color)
}

.lux-menu-footer,.lux-menu-header {
    padding: .25rem .5rem;
    color: var(--menu-header-color);
    font-size: var(--font-size-xs)
}

.lux-menu-item {
    padding: .375rem .5rem;
    color: var(--menu-item-color);
    font-size: var(--font-size-sm);
    border-radius: var(--small-border-radius);
    cursor: pointer;
    position: relative;
    z-index: 1
}

.lux-menu-item.focused {
    color: var(--menu-item-hover-color);
    background-color: var(--menu-item-hover-bg-color)
}

.lux-menu-item.focused .lux-menu-icon {
    color: var(--menu-item-icon-hover-color)
}

.lux-menu-item.focused .lux-menu-right-text {
    color: var(--menu-item-hover-color)
}

.lux-menu-item .icon-text {
    min-width: 0
}

.lux-menu-item .menu-icon {
    margin-right: .625rem;
    width: 1rem;
    height: 1rem;
    color: var(--menu-item-icon-color);
    justify-content: center;
    opacity: 1
}

.lux-menu-item .menu-icon :global(svg) {
    width: 1rem;
    height: 1rem
}

.lux-menu-item:not(.selected):not(.has-icon) .menu-icon {
    opacity: 0
}

.lux-menu-item .menu-text {
    min-width: 0
}

.lux-menu-item .menu-text .desc,.lux-menu-item .menu-text .title {
    overflow-wrap: break-word
}

.lux-menu-item .menu-right-text {
    white-space: nowrap;
    color: var(--menu-item-secondary-color);
    margin-left: 1rem;
    align-self: baseline
}

.lux-menu-item .menu-checkmark {
    width: 1rem
}

.lux-menu-item .menu-checkmark.left {
    margin-right: .625rem
}

.lux-menu-item .menu-checkmark.right {
    margin-left: .625rem
}

.lux-menu-item .menu-checkmark svg path {
    stroke-width: 2
}

.lux-naked-input {
    transition: var(--transition),height 0s;
    color: var(--input-color);
    line-height: var(--naked-input-line-height);
    overflow: hidden;
    border: none;
    background-color: transparent;
    padding: var(--naked-input-padding);
    font-size: var(--input-font-size);
    font-weight: var(--naked-input-font-weight);
    width: 100%;
    background-image: -webkit-linear-gradient(hsla(0,0%,100%,0),hsla(0,0%,100%,0))
}

.lux-naked-input:not(.mounted) {
    height: var(--naked-input-guidance-height)
}

.lux-naked-input.padded {
    --naked-input-padding: var(--input-padding);
    border-radius: var(--border-radius)
}

.lux-naked-input.padded:not(:disabled):hover {
    background-color: var(--naked-input-hover-bg-color)
}

.lux-naked-input.bordered {
    --naked-input-padding: var(--input-vertical-padding) 0;
    border-bottom: 1px solid var(--input-border-color)
}

.lux-naked-input.bordered:not(:disabled):hover {
    border-color: var(--input-hover-border-color)
}

.lux-naked-input.bordered:focus,.lux-naked-input.bordered:focus:hover {
    border-color: var(--input-focus-border-color)
}

.lux-naked-input.bordered.error {
    border-color: var(--error-color)
}

.lux-naked-input.invalid {
    color: var(--error-color);
    background-color: var(--error-pale-bg-color)
}

.lux-naked-input.invalid.bordered {
    border-color: var(--error-color)
}

.lux-naked-input.invalid::placeholder {
    color: var(--error-placeholder-color)!important
}

.lux-naked-input:disabled {
    cursor: not-allowed
}

.lux-naked-input:focus,.lux-naked-input:focus:hover {
    outline: 0
}

.lux-naked-input::placeholder {
    color: var(--placeholder-color);
    opacity: 1
}

.lux-naked-input:not(.padded):not(.bordered)::placeholder {
    transition: color var(--transition-duration) var(--transition-fn)
}

.lux-naked-input:not(.padded):not(.bordered):focus::placeholder,.lux-naked-input:not(.padded):not(.bordered):hover::placeholder {
    color: var(--naked-input-hover-placeholder-color)
}

.lux-naked-input:-moz-focusring {
    text-shadow: none
}

.lux-modal-root {
    position: relative;
    z-index: 1
}

.lux-modal-header {
    padding: var(--modal-header-footer-padding);
    background-color: var(--modal-header-bg-color);
    border-bottom: 1px solid var(--divider-color)
}

.lux-modal-header .title {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: var(--font-weight-bold)
}

.lux-modal-header .close {
    padding: 0;
    border: 0;
    border-radius: 100px;
    background-color: var(--secondary-color);
    color: var(--modal-bg-color);
    width: 1.25rem;
    height: 1.25rem;
    opacity: .75
}

.lux-modal-header .close:hover {
    opacity: 1
}

@media(max-width: 450px) {
    .lux-modal-header {
        background-color:var(--modal-header-bg-color)
    }
}

.lux-modal {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    position: relative;
    width: 480px;
    max-height: 75vh;
    border-radius: var(--modal-border-radius);
    box-shadow: var(--shadow-modal);
    background-color: var(--modal-bg-color);
    -webkit-backdrop-filter: var(--backdrop-blur);
    backdrop-filter: var(--backdrop-blur);
    --rich-button-border-color: var(--opacity-light)
}

.lux-modal.lux-alert {
    width: 340px;
    --input-border-color: var(--opacity-8);
    --input-bg-color: var(--bg-opacity-64)
}

.lux-modal.big {
    outline: 1px solid var(--opacity-light);
    border-radius: var(--large-border-radius);
    box-shadow: var(--shadow);
    background-color: var(--modal-bg-color);
    width: min(90vw,800px);
    -webkit-backdrop-filter: var(--backdrop-blur);
    backdrop-filter: var(--backdrop-blur);
    height: 80vh;
    max-height: min(80vh,1000px)
}

@media(max-width: 650px) {
    .lux-modal.big {
        height:100vh;
        max-height: 100vh
    }
}

.lux-modal.panel {
    margin-top: .5rem;
    margin-right: .5rem;
    border-radius: var(--border-radius);
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
    height: calc(100vh - 1rem);
    height: calc(100dvh - 1rem);
    width: 550px
}

.lux-modal.sheet {
    width: 100%;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    bottom: 0;
    background-color: var(--translucent-sheet-bg-color);
    box-shadow: var(--light-shadow-xs);
    padding-bottom: 200px;
    margin-bottom: -200px
}

@media(max-width: 650px) {
    .lux-modal:not(.lux-alert):not(.sheet):not(.big) {
        width:calc(100% - 40px);
        max-width: 480px
    }

    .lux-modal.panel {
        width: calc(450px - 1rem)
    }

    .lux-modal.big {
        width: 100%;
        height: 100%;
        border-radius: 0;
        max-width: 100%;
        max-height: 100%
    }
}

@media(max-width: 450px) {
    .lux-modal:not(.compact):not(.lux-alert):not(.sheet) {
        width:100%;
        height: 100%;
        border-radius: 0;
        max-width: 100%;
        max-height: 100%
    }

    .lux-modal.panel {
        margin: 0;
        max-height: 100vh;
        max-height: 100dvh;
        height: 100vh;
        height: 100dvh
    }

    .lux-modal.compact,.lux-modal.lux-alert {
        margin-top: 10vh
    }

    .lux-modal.lux-alert {
        width: calc(100% - 40px);
        max-width: 340px
    }
}

.lux-modal .lux-modal-body {
    width: 100%;
    padding: var(--modal-padding)
}

.lux-modal.panel .lux-modal-body {
    flex: 1 1
}

.lux-modal .lux-modal-footer {
    border-top: 1px solid var(--divider-color);
    background-color: var(--primary-bg-color);
    width: 100%;
    padding: var(--modal-header-footer-padding)
}

.theme-root .tint-root.dark .lux-modal,.theme-root.dark .lux-modal,.theme-root.dark .tint-root .lux-modal {
    --rich-button-bg-color: rgba(40,42,43,.8)
}

.lux-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--overlay-color);
    z-index: 1000;
    -webkit-backdrop-filter: grayscale(.3);
    backdrop-filter: grayscale(.3)
}

.lux-backdrop.glass {
    background-color: var(--primary-bg-color-thick-translucent);
    -webkit-backdrop-filter: var(--high-legibility-backdrop-blur);
    backdrop-filter: var(--high-legibility-backdrop-blur)
}

.lux-backdrop.transparent {
    background-color: transparent;
    -webkit-backdrop-filter: grayscale(.1);
    backdrop-filter: grayscale(.1)
}

.lux-overlay {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 15vh;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: var(--overlay-z-index);
    scrollbar-gutter: stable;
    --overlay-content-padding: 0
}

.lux-overlay.panel {
    padding-top: 0;
    justify-content: end
}

.lux-overlay.sheet {
    align-items: end
}

.lux-overlay.glass {
    padding-top: 0;
    align-items: center
}

.lux-overlay.big {
    padding-top: 5vh
}

@media(max-width: 650px) {
    .lux-overlay.big {
        padding-top:0
    }
}

@keyframes pop {
    50% {
        transform-origin: center;
        transform: scale(1.005)
    }
}

.lux-overlay.pop .lux-modal {
    animation: pop .3s cubic-bezier(.4,0,.2,1) 1
}

@media(max-width: 650px) {
    .lux-overlay.cmdk {
        padding:2.5rem;
        align-items: start
    }

    .lux-overlay.glass {
        padding: 0;
        align-items: start
    }
}

@media(max-width: 450px) {
    .lux-overlay {
        padding-top:0
    }

    .lux-overlay.cmdk {
        padding: 1.25rem
    }

    .lux-overlay.sheet {
        padding-top: inherit
    }
}

.lux-multi-step-modal .lux-modal-body {
    padding-top: .25rem
}

.lux-radio {
    position: relative;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1.25rem;
    clear: both;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: .75rem
}

.lux-radio.radio-right {
    flex-direction: row-reverse
}

.lux-radio .text-label {
    flex: 1 1
}

.lux-radio:has(input:focus-visible) .radio-icon {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    border-radius: 100%
}

.lux-radio .radio-icon {
    display: block;
    position: relative;
    font-size: .5rem;
    line-height: 1.25rem;
    height: 1.25rem;
    width: 1.25rem;
    clear: both
}

.lux-radio .radio-icon .input {
    opacity: 0
}

.lux-radio .radio-icon .input,.lux-radio .radio-icon .radio-display {
    position: absolute;
    top: 0;
    left: 0;
    height: 1.25rem;
    width: 1.25rem
}

.lux-radio .radio-icon .radio-display {
    transition: var(--fast-transition);
    border-radius: 100px;
    background-color: var(--primary-bg-color);
    border: .125rem solid var(--checkbox-border-color)
}

.lux-radio .radio-icon .radio-display:after {
    transition: var(--fast-transition);
    position: absolute;
    content: "";
    top: .375rem;
    left: .375rem;
    height: .5rem;
    width: .5rem;
    opacity: 0
}

.lux-radio .radio-icon input:checked~.radio-display {
    border: none;
    background-color: var(--primary-color)
}

.lux-radio .radio-icon input:checked~.radio-display:after {
    opacity: 1;
    border-radius: 100px;
    background-color: var(--primary-bg-color)
}

.lux-radio:hover .radio-display {
    border-color: var(--secondary-color)
}

.lux-spinner {
    animation: rotator 1.5s linear infinite
}

@keyframes rotator {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(270deg)
    }
}

.lux-spinner .path {
    stroke-dasharray: 175;
    stroke-dashoffset: 0;
    transform-origin: center;
    animation: dash 1.5s ease-in-out infinite
}

@keyframes dash {
    0% {
        stroke-dashoffset: 175
    }

    50% {
        stroke-dashoffset: 43.75;
        transform: rotate(135deg)
    }

    to {
        stroke-dashoffset: 175;
        transform: rotate(450deg)
    }
}

.lux-spinner.paused,.lux-spinner.paused .path {
    animation-play-state: paused
}

.lux-slider {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: var(--input-height);
    outline: none;
    background: none;
    --track-height: 0.375rem;
    --thumb-size: 1.25rem;
    --track-left-color: var(--primary-color);
    --track-active-color: var(--opacity-80);
    --track-right-color: var(--opacity-light);
    --thumb-color: var(--white);
    --thumb-border-width: 1px;
    --thumb-border-color: var(--black-opacity-8);
    --thumb-active-border-color: var(--black-opacity-64);
    --thumb-active-border-width: 2px
}

.lux-slider.brand {
    --track-left-color: var(--brand-content-color);
    --thumb-active-border-color: var(--brand-content-color)
}

.lux-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: var(--track-height);
    cursor: pointer;
    background: var(--track-left-color);
    border-radius: .25rem;
    border: none;
    -webkit-transition: background var(--transition-duration) var(--transition-fn);
    transition: background var(--transition-duration) var(--transition-fn)
}

.lux-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    height: var(--thumb-size);
    width: var(--thumb-size);
    border-radius: 100%;
    margin-top: calc((var(--track-height) - var(--thumb-size))/2);
    background-color: var(--thumb-color);
    outline: var(--thumb-border-width) solid var(--thumb-border-color);
    border: none;
    box-shadow: var(--shadow-xs);
    -webkit-transition-property: transform,box-shadow,outline;
    transition-property: transform,box-shadow,outline;
    transform-origin: center;
    transition-duration: var(--transition-duration);
    transition-timing-function: var(--transition-fn)
}

.lux-slider::-webkit-slider-thumb:hover {
    transform: scale(1.05);
    box-shadow: var(--shadow);
    outline: var(--thumb-active-border-width) solid var(--thumb-active-border-color)
}

.lux-slider::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    height: var(--thumb-size);
    width: var(--thumb-size);
    border-radius: 100%;
    margin-top: calc((var(--track-height) - var(--thumb-size))/2);
    background-color: var(--thumb-color);
    outline: var(--thumb-border-width) solid var(--thumb-border-color);
    border: none;
    box-shadow: var(--shadow-xs);
    -moz-transition-property: transform,box-shadow,outline;
    transition-property: transform,box-shadow,outline;
    transform-origin: center;
    transition-duration: var(--transition-duration);
    transition-timing-function: var(--transition-fn)
}

.lux-slider::-moz-range-thumb:hover {
    transform: scale(1.05);
    box-shadow: var(--shadow);
    outline: var(--thumb-active-border-width) solid var(--thumb-active-border-color)
}

.lux-slider::-moz-range-track {
    width: 100%;
    height: var(--track-height);
    cursor: pointer;
    background: var(--track-left-color);
    border-radius: .25rem;
    border: none;
    -moz-transition: background var(--transition-duration) var(--transition-fn);
    transition: background var(--transition-duration) var(--transition-fn);
    background: var(--track-right-color)
}

.lux-slider::-moz-range-progress {
    height: var(--track-height);
    border-radius: .25rem;
    background: var(--track-left-color)
}

.lux-toggle {
    flex-shrink: 0;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    --total-width: var(--toggle-width);
    --total-height: var(--toggle-height);
    --slider-gap: var(--toggle-gap)
}

.lux-toggle input {
    opacity: 0;
    width: 0;
    height: 0
}

.lux-toggle.small {
    --total-width: var(--small-toggle-width);
    --total-height: var(--small-toggle-height);
    --slider-gap: var(--small-toggle-gap)
}

.lux-toggle.large {
    --total-width: var(--large-toggle-width);
    --total-height: var(--large-toggle-height);
    --slider-gap: var(--large-toggle-gap)
}

.lux-toggle {
    width: var(--total-width);
    height: var(--total-height);
    --slider-size: calc(var(--total-height) - 2 * var(--slider-gap))
}

.lux-toggle .slider {
    transition: var(--transition);
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--toggle-bg-color);
    border-radius: calc(var(--total-height)/2)
}

.lux-toggle .slider:before {
    transition: var(--transition);
    position: absolute;
    content: "";
    height: var(--slider-size);
    width: var(--slider-size);
    left: var(--slider-gap);
    top: var(--slider-gap);
    background-color: #fff;
    border-radius: 100%;
    box-shadow: var(--shadow-xs)
}

.lux-toggle input:disabled+.slider {
    cursor: not-allowed;
    background-color: var(--toggle-disabled-bg-color)
}

.lux-toggle input:checked+.slider {
    background-color: var(--toggle-active-bg-color)
}

.lux-toggle input:disabled:checked+.slider {
    background-color: var(--toggle-active-disabled-bg-color)
}

.lux-toggle:has(input:focus-visible) {
    outline: 2px solid var(--toggle-active-bg-color);
    outline-offset: 2px;
    border-radius: calc(var(--total-height)/2)
}

.lux-toggle.success {
    --toggle-active-bg-color: var(--toggle-success-active-bg-color);
    --toggle-active-disabled-bg-color: var(--toggle-success-active-disabled-bg-color)
}

.lux-toggle.error {
    --toggle-active-bg-color: var(--toggle-error-active-bg-color);
    --toggle-active-disabled-bg-color: var(--toggle-error-active-disabled-bg-color)
}

.lux-toggle.brand {
    --toggle-active-bg-color: var(--brand-content-color);
    --toggle-active-disabled-bg-color: var(--brand-pale-bg-color)
}

.lux-toggle input:checked+.slider:before {
    transform: translateX(calc(var(--total-width) - var(--slider-size) - 2 * var(--slider-gap)))
}

.event-theme {
    --page-bg: var(--depressed-secondary-bg-color);
    --translucent-overlay-bg-color: var(--elevated-secondary-bg-color);
    --card-bg-color: var(--elevated-primary-bg-color);
    --card-bg-color-opaque: var(--card-bg-color);
    --card-backdrop-filter: none;
    --card-shadow: none;
    --one-to-one-card-shadow: var(--shadow-xs)
}

.event-theme:not(.tinted) {
    --tint-color: var(--secondary-color-alpha)
}

.event-theme .text-tinted {
    color: var(--tint-color)
}

.theme-root .event-theme .btn.luma-button.light.solid {
    -webkit-backdrop-filter: var(--backdrop-blur);
    backdrop-filter: var(--backdrop-blur)
}

.theme-root .event-theme .hover-brand-link:hover {
    color: var(--brand-active-color)
}

.theme-root .event-theme.high-contrast {
    --brand-color: var(--brand-color-high-contrast);
    --brand-active-color: var(--brand-color-high-contrast-active);
    --brand-pale-bg-color: var(--brand-pale-bg-color-high-contrast)
}

.theme-root .event-theme.tinted,.theme-root.dark .tint-root.light .event-theme.tinted {
    --page-bg: var(--meta-color,var(--brand-10,var(--depressed-secondary-bg-color)));
    --primary-button-bg-color: var(--brand-50,var(--gray-90));
    --primary-button-hover-bg-color: var(--brand-40,var(--gray-80))
}

.theme-root .tint-root.light .event-theme,.theme-root.light .event-theme {
    --one-to-one-card-bg-color: var(--bg-opacity-32);
    --one-to-one-card-border-color: var(--bg-opacity-16);
    --one-to-one-card-shadow: var(--light-shadow-xs)
}

.theme-root .tint-root.dark .event-theme,.theme-root.dark .event-theme {
    --one-to-one-card-bg-color: var(--opacity-4);
    --one-to-one-card-border-color: var(--opacity-4)
}

.theme-root .tint-root.dark .event-theme.shader-dark,.theme-root.dark .event-theme.shader-dark {
    --one-to-one-card-bg-color: var(--bg-opacity-16);
    --one-to-one-card-border-color: var(--bg-opacity-8)
}

.theme-root .tint-root.dark .event-theme.particles-champagne,.theme-root.dark .event-theme.particles-champagne {
    --one-to-one-card-bg-color: var(--bg-opacity-8);
    --one-to-one-card-border-color: var(--bg-opacity-8);
    --one-to-one-card-shadow: var(--light-shadow-xs)
}

.theme-root .tint-root.dark .event-theme.tinted,.theme-root.dark .event-theme.tinted {
    --page-bg: var(--meta-color,var(--brand-80,var(--depressed-secondary-bg-color)));
    --card-bg-color: var(--brand-70,var(--elevated-primary-bg-color));
    --primary-button-bg-color: var(--white);
    --primary-button-hover-bg-color: var(--gray-20);
    --primary-bg-color: var(--brand-80)
}

.theme-root .event-theme.confetti,.theme-root .event-theme.emoji {
    --card-backdrop-filter: var(--backdrop-blur)
}

.theme-root .tint-root.dark .event-theme.confetti.tinted,.theme-root .tint-root.dark .event-theme.emoji.tinted,.theme-root.dark .event-theme.confetti.tinted,.theme-root.dark .event-theme.emoji.tinted {
    --page-bg: var(--meta-color,var(--brand-70,var(--depressed-secondary-bg-color)));
    --card-bg-color: var(--brand-60,var(--elevated-primary-bg-color));
    --primary-bg-color: var(--brand-70)
}

.theme-root .event-theme.pattern,.theme-root.dark .event-theme.pattern {
    --card-bg-color: var(--bg-opacity-64);
    --card-backdrop-filter: var(--backdrop-blur);
    --card-shadow: 0px -4px 15px 0px hsla(0,0%,100%,.5) inset;
    --lightest-color: var(--brand-5,var(--opacity-4));
    --lighter-color: var(--brand-10,var(--depressed-secondary-bg-color));
    --darker-color: var(--brand-20,var(--gray-20))
}

@media(max-width: 650px) {
    .theme-root .event-theme.pattern,.theme-root.dark .event-theme.pattern {
        --card-backdrop-filter:blur(2px)
    }
}

.theme-root .event-theme.shader,.theme-root .event-theme.tinted.shader,.theme-root .tint-root .event-theme.shader {
    --card-bg-color: var(--bg-opacity-64);
    --card-backdrop-filter: var(--backdrop-blur);
    --card-shadow: 0px -4px 15px 0px hsla(0,0%,100%,.5) inset
}

.theme-root .event-theme.shader .btn.luma-button.light.solid,.theme-root .event-theme.tinted.shader .btn.luma-button.light.solid,.theme-root .tint-root .event-theme.shader .btn.luma-button.light.solid {
    -webkit-backdrop-filter: none;
    backdrop-filter: none
}

.theme-root.dark .event-theme.shader,.theme-root.dark .event-theme.tinted.shader,.theme-root.dark .tint-root .event-theme.shader {
    --card-bg-color: var(--bg-opacity-48);
    --card-backdrop-filter: var(--backdrop-blur);
    --card-shadow: 0px -4px 15px 0px rgba(0,0,0,.1) inset
}

.theme-root.dark {
    --shadow-xs: var(--medium-shadow-xs);
    --shadow-sm: var(--medium-shadow-sm);
    --shadow: var(--medium-shadow);
    --shadow-lg: var(--medium-shadow-lg);
    --shadow-xl: var(--medium-shadow-xl)
}

.theme-root .event-theme.tinted.warp,.theme-root .event-theme.warp,.theme-root .tint-root .event-theme.warp {
    --card-bg-color: var(--bg-opacity-48);
    --card-backdrop-filter: var(--backdrop-blur);
    --card-shadow: 0px -4px 15px 0px rgba(0,0,0,.1) inset
}

.theme-root .event-theme.tinted.warp .ticket-type-btn.selected:not(:disabled),.theme-root .event-theme.tinted.warp .ticket-type-btn.selected:not(:disabled):hover,.theme-root .event-theme.warp .ticket-type-btn.selected:not(:disabled),.theme-root .event-theme.warp .ticket-type-btn.selected:not(:disabled):hover,.theme-root .tint-root .event-theme.warp .ticket-type-btn.selected:not(:disabled),.theme-root .tint-root .event-theme.warp .ticket-type-btn.selected:not(:disabled):hover {
    background-color: var(--opacity-16);
    border-color: var(--opacity-32)
}

figure.preview .event-theme.pattern {
    --card-bg-color: #fff!important
}

figure.preview .event-theme .background {
    height: 100%
}

.pattern-zigzag,.theme-root .event-theme.zigzag .background {
    background-image: linear-gradient(135deg,var(--lighter-color) 25%,transparent 25%),linear-gradient(225deg,var(--lighter-color) 25%,transparent 25%),linear-gradient(45deg,var(--lighter-color) 25%,transparent 25%),linear-gradient(315deg,var(--lighter-color) 25%,var(--darker-color) 25%);
    background-position: 32px 0,32px 0,0 0,0 0;
    background-size: 64px 64px;
    background-repeat: repeat
}

.pattern-plus,.theme-root .event-theme.plus .background {
    background-color: var(--lighter-color);
    background: radial-gradient(circle,transparent 20%,var(--lighter-color) 20%,var(--lighter-color) 80%,transparent 80%,transparent),radial-gradient(circle,transparent 20%,var(--lighter-color) 20%,var(--lighter-color) 80%,transparent 80%,transparent) 50px 50px,linear-gradient(var(--darker-color) 4px,transparent 4px) 0 -2px,linear-gradient(90deg,var(--darker-color) 4px,var(--lighter-color) 4px) -2px 0;
    background-size: 100px 100px,100px 100px,50px 50px,50px 50px
}

.pattern-wave,.theme-root .event-theme.wave .background {
    background: radial-gradient(circle at top left,transparent 25%,var(--darker-color) 25.5%,var(--darker-color) 36%,transparent 37%,transparent 100%),radial-gradient(circle at bottom right,transparent 34%,var(--darker-color) 34.5%,var(--darker-color) 45.5%,transparent 46%,transparent 100%);
    background-size: 50px 50px;
    background-color: var(--lighter-color)
}

.pattern-polkadot,.theme-root .event-theme.polkadot .background {
    background: radial-gradient(circle,var(--darker-color) 10%,transparent 12%),radial-gradient(circle at bottom left,var(--darker-color) 5%,transparent 7%),radial-gradient(circle at bottom right,var(--darker-color) 5%,transparent 7%),radial-gradient(circle at top left,var(--darker-color) 5%,transparent 7%),radial-gradient(circle at top right,var(--darker-color) 5%,transparent 7%);
    background-size: 50px 50px;
    background-color: var(--lighter-color)
}

.pattern-cross,.theme-root .event-theme.cross .background {
    background: repeating-linear-gradient(transparent,transparent 8px,var(--lightest-color) 8px,var(--lightest-color) 12px,transparent 12px,transparent 16px,var(--lightest-color) 12px,var(--lightest-color) 32px,transparent 32px,transparent 36px,var(--lightest-color) 36px,var(--lightest-color) 40px,transparent 40px,transparent 64px),repeating-linear-gradient(90deg,transparent,transparent 8px,var(--lightest-color) 8px,var(--lightest-color) 12px,transparent 12px,transparent 16px,var(--lightest-color) 12px,var(--lightest-color) 32px,transparent 32px,transparent 36px,var(--lightest-color) 36px,var(--lightest-color) 40px,transparent 40px,transparent 64px),var(--lightest-color);
    background-blend-mode: multiply;
    background-color: var(--lightest-color)
}

.pattern-hypnotic,.theme-root .event-theme.hypnotic .background {
    background: radial-gradient(50% 50% at 100% 0,var(--darker-color) 0,var(--darker-color) 5%,var(--lighter-color) 6%,var(--lighter-color) 15%,var(--darker-color) 16%,var(--darker-color) 25%,var(--lighter-color) 26%,var(--lighter-color) 35%,var(--darker-color) 36%,var(--darker-color) 45%,var(--lighter-color) 46%,var(--lighter-color) 55%,var(--darker-color) 56%,var(--darker-color) 65%,var(--lighter-color) 66%,var(--lighter-color) 75%,var(--darker-color) 76%,var(--darker-color) 85%,var(--lighter-color) 86%,var(--lighter-color) 95%,transparent 96%),radial-gradient(50% 50% at 0 100%,var(--darker-color) 0,var(--darker-color) 5%,var(--lighter-color) 6%,var(--lighter-color) 15%,var(--darker-color) 16%,var(--darker-color) 25%,var(--lighter-color) 26%,var(--lighter-color) 35%,var(--darker-color) 36%,var(--darker-color) 45%,var(--lighter-color) 46%,var(--lighter-color) 55%,var(--darker-color) 56%,var(--darker-color) 65%,var(--lighter-color) 66%,var(--lighter-color) 75%,var(--darker-color) 76%,var(--darker-color) 85%,var(--lighter-color) 86%,var(--lighter-color) 95%,transparent 96%),radial-gradient(closest-side at 50% 50%,var(--darker-color) 0,var(--darker-color) 5%,var(--lighter-color) 6%,var(--lighter-color) 15%,var(--darker-color) 16%,var(--darker-color) 25%,var(--lighter-color) 26%,var(--lighter-color) 35%,var(--darker-color) 36%,var(--darker-color) 45%,var(--lighter-color) 46%,var(--lighter-color) 55%,var(--darker-color) 56%,var(--darker-color) 65%,var(--lighter-color) 66%,var(--lighter-color) 75%,var(--darker-color) 76%,var(--darker-color) 85%,var(--lighter-color) 86%,var(--lighter-color) 95%,transparent 96%),radial-gradient(closest-side at 50% 50%,var(--darker-color) 0,var(--darker-color) 5%,var(--lighter-color) 6%,var(--lighter-color) 15%,var(--darker-color) 16%,var(--darker-color) 25%,var(--lighter-color) 26%,var(--lighter-color) 35%,var(--darker-color) 36%,var(--darker-color) 45%,var(--lighter-color) 46%,var(--lighter-color) 55%,var(--darker-color) 56%,var(--darker-color) 65%,var(--lighter-color) 66%,var(--lighter-color) 75%,var(--darker-color) 76%,var(--darker-color) 85%,var(--lighter-color) 86%,var(--lighter-color) 95%,transparent 96%) 32px 32px;
    background-size: 64px 64px;
    background-color: var(--lighter-color)
}

.theme-root .event-theme.halloween,.theme-root .event-theme.holiday,.theme-root .event-theme.tinted.halloween,.theme-root .event-theme.tinted.holiday,.theme-root.dark .event-theme.halloween,.theme-root.dark .event-theme.holiday,.theme-root.dark .event-theme.tinted.halloween,.theme-root.dark .event-theme.tinted.holiday {
    --card-bg-color: var(--bg-opacity-32);
    --card-backdrop-filter: var(--backdrop-blur);
    --card-shadow: 0px -4px 15px 0px rgba(0,0,0,.1) inset;
    --one-to-one-card-shadow: 0 1px 4px rgba(0,0,0,.05)
}

.theme-root .event-theme.halloween .background,.theme-root .event-theme.tinted.halloween .background {
    background-size: 320px
}

.theme-root .event-theme.pumpkin .background {
    background-image: url(../image/pumpkin.png);
    filter: brightness(.9)
}

.theme-root .event-theme.candy .background {
    background-image: url(../image/candy.png)
}

.theme-root .event-theme.skull .background {
    background-image: url(../image/skull.png)
}

.theme-root .event-theme.coffin .background {
    background-image: url(../image/coffin.png)
}

.theme-root .event-theme.ghost .background {
    background-image: url(../image/ghost.png)
}

.theme-root .event-theme.bones .background {
    background-image: url(../image/bones.png)
}

.theme-root .event-theme.holiday-pie .background-overlay {
    background-image: url(../image/pie.jpg);
    opacity: .06;
    mix-blend-mode: luminosity
}

.theme-root .event-theme.holiday-pie .background-glow {
    background: radial-gradient(80% 80% at 30% 15%,#e18d21 0,#9b4714 65%)
}

@media(max-width: 650px) {
    .theme-root .event-theme.holiday-pie .background-glow {
        background:radial-gradient(100% 100% at 25% 25%,#e18d21 0,#9b4714 65%)
    }
}

.theme-root .event-theme.holiday-foliage .background-overlay {
    background-image: url(../image/foliage.jpg);
    opacity: .06;
    mix-blend-mode: luminosity;
    background-size: cover
}

.theme-root .event-theme.holiday-foliage .background-glow {
    background: linear-gradient(180deg,#948162 6%,rgba(128,101,72,.9) 35%,rgba(126,113,22,.9) 50%)
}

.theme-root .event-theme.holiday-turkey .background-overlay {
    background-image: url(../image/turkey-bg.jpg);
    background-size: 297px
}

.theme-root .event-theme.holiday-snow .background-glow {
    background: linear-gradient(180deg,#07243a 4.62%,#005587 97.11%)
}

.theme-root .event-theme.holiday-snow .background-overlay {
    background-image: url(../image/snow-top.png);
    background-size: 1201px;
    background-repeat: repeat-x;
    background-position: top;
    top: -30px!important;
    z-index: 100
}

.theme-root .event-theme.holiday-snow .background-overlay2 {
    background-image: url(../image/snow-bg.png);
    background-size: 1804px;
    background-repeat: repeat-x;
    background-position: top;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    mix-blend-mode: soft-light
}

.theme-root .event-theme.holiday-snow .background-overlay3,.theme-root .event-theme.holiday-snow .background-overlay4 {
    background-repeat: no-repeat;
    mix-blend-mode: soft-light;
    opacity: .7
}

.theme-root .event-theme.holiday-snow .background-overlay3 {
    background-image: url(../image/snow-left.png);
    bottom: 0;
    left: -280px;
    width: 100%;
    height: 716px;
    background-size: 568px;
    background-position: 0 100%
}

.theme-root .event-theme.holiday-snow .background-overlay4 {
    background-image: url(../image/snow-right.png);
    bottom: 0;
    right: -320px;
    width: 100%;
    height: 568px;
    background-size: 616px;
    background-position: 100% 100%
}

@media(max-width: 800px) {
    .theme-root .event-theme.holiday-snow .background-overlay3 {
        left:-180px;
        background-size: 350px
    }

    .theme-root .event-theme.holiday-snow .background-overlay4 {
        right: -200px;
        background-size: 500px
    }
}

@media(max-width: 650px) {
    .theme-root .event-theme.holiday-snow .background-overlay {
        background-position:0 0
    }

    .theme-root .event-theme.holiday-snow .background-overlay2 {
        background-size: 1200px
    }

    .theme-root .event-theme.holiday-snow .background-overlay3 {
        display: none
    }

    .theme-root .event-theme.holiday-snow .background-overlay4 {
        left: 0;
        right: 0;
        background-position: bottom
    }
}

.theme-root .event-theme.holiday-santa .background-overlay {
    background-image: url(../image/santa.jpg);
    opacity: .08;
    mix-blend-mode: lighten
}

.theme-root .event-theme.holiday-santa .background-glow {
    background: linear-gradient(180deg,#e03f42,#428195 35%,#1c8737 80%)
}

.theme-root .event-theme.holiday-sweater .background-glow {
    background: linear-gradient(180deg,#195f26,#002f00 95%)
}

.theme-root .event-theme.holiday-sweater .background-overlay,.theme-root .event-theme.holiday-sweater .background-overlay2,.theme-root .event-theme.holiday-sweater .background-overlay3,.theme-root .event-theme.holiday-sweater .background-overlay4 {
    mix-blend-mode: soft-light
}

.theme-root .event-theme.holiday-sweater .background-overlay {
    background-image: url(../image/sweater-top.png);
    background-size: 276px;
    height: 152px;
    width: 100%
}

.theme-root .event-theme.holiday-sweater .background-overlay2 {
    background-image: url(../image/sweater-middle.png);
    background-position: top;
    background-size: 1208px;
    background-repeat: repeat-x;
    top: 225px;
    height: 240px;
    width: 100%
}

.theme-root .event-theme.holiday-sweater .background-overlay3,.theme-root .event-theme.holiday-sweater .background-overlay4 {
    background-image: url(../image/sweater-bottom.png);
    background-size: 207px;
    bottom: 2rem;
    height: 201px;
    width: 207px
}

.theme-root .event-theme.holiday-sweater .background-overlay3 {
    transform: scaleX(-1);
    left: -50px
}

.theme-root .event-theme.holiday-sweater .background-overlay4 {
    right: -50px
}

@media(max-width: 800px) {
    .theme-root .event-theme.holiday-sweater .background-overlay {
        top:-50px!important
    }

    .theme-root .event-theme.holiday-sweater .background-overlay2 {
        background-size: 1000px
    }
}

@media(max-height: 800px) {
    .theme-root .event-theme.holiday-sweater .background-overlay {
        top:-50px!important
    }

    .theme-root .event-theme.holiday-sweater .background-overlay2 {
        top: 200px;
        background-size: 1000px
    }
}

@media(max-width: 650px) {
    .theme-root .event-theme.holiday-sweater .background-overlay2 {
        top:180px;
        background-size: 800px
    }

    .theme-root .event-theme.holiday-sweater .background-overlay3,.theme-root .event-theme.holiday-sweater .background-overlay4 {
        background-size: 150px;
        height: 150px;
        width: 150px
    }
}

.theme-root .event-theme.holiday-hanukkah .background-overlay {
    background-image: url(../image/hanukkah.jpg);
    opacity: .1;
    mix-blend-mode: luminosity
}

.theme-root .event-theme.holiday-hanukkah .background-glow {
    background: radial-gradient(100% 100% at 30% 15%,rgba(255,197,24,.6) 0,#06738e 65%)
}

@media(max-width: 650px) {
    .theme-root .event-theme.holiday-hanukkah .background-glow {
        background:radial-gradient(100% 100% at 25% 25%,rgba(255,197,24,.6) 0,#06738e 65%)
    }
}

.theme-root .event-theme.holiday-diwali .background-glow {
    background: radial-gradient(184% 87% at 55% 30%,#320b68 27%,#41045a 100%)
}

.theme-root .event-theme.holiday-diwali .background-overlay,.theme-root .event-theme.holiday-diwali .background-overlay2,.theme-root .event-theme.holiday-diwali .background-overlay3,.theme-root .event-theme.holiday-diwali .background-overlay4 {
    mix-blend-mode: luminosity;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: .6
}

.theme-root .event-theme.holiday-diwali .background-overlay {
    background-image: url(../image/diwali-1.png);
    width: 160px;
    top: 2rem!important;
    left: 2rem!important
}

.theme-root .event-theme.holiday-diwali .background-overlay2 {
    background-image: url(../image/diwali-2.png);
    width: 180px;
    height: 100%;
    top: 2rem;
    right: 2rem
}

.theme-root .event-theme.holiday-diwali .background-overlay3,.theme-root .event-theme.holiday-diwali .background-overlay4 {
    background-image: url(../image/diwali-3.png);
    width: 240px;
    height: 240px;
    background-position: 0 100%;
    bottom: 0
}

.theme-root .event-theme.holiday-diwali .background-overlay3 {
    left: 0
}

.theme-root .event-theme.holiday-diwali .background-overlay4 {
    transform: scaleX(-1);
    right: 0
}

@media(max-width: 800px) {
    .theme-root .event-theme.holiday-diwali .background-overlay {
        width:120px;
        left: 1.5rem!important
    }

    .theme-root .event-theme.holiday-diwali .background-overlay2 {
        width: 130px;
        right: 1rem
    }

    .theme-root .event-theme.holiday-diwali .background-overlay3,.theme-root .event-theme.holiday-diwali .background-overlay4 {
        width: 180px;
        height: 180px
    }
}

@media(max-width: 650px) {
    .theme-root .event-theme.holiday-diwali .background-overlay {
        top:.5rem!important;
        width: 100px
    }

    .theme-root .event-theme.holiday-diwali .background-overlay2 {
        top: .5rem;
        width: 110px
    }

    .theme-root .event-theme.holiday-diwali .background-overlay3,.theme-root .event-theme.holiday-diwali .background-overlay4 {
        width: 160px;
        height: 160px
    }
}

@media(max-height: 500px) {
    .theme-root .event-theme.holiday-diwali .background-overlay3,.theme-root .event-theme.holiday-diwali .background-overlay4 {
        display:none
    }
}

body,html {
    width: 100%;
    height: 100%;
    margin: 0;
    scrollbar-gutter: stable
}

@media screen and (max-device-width: 480px) {
    body {
        -webkit-text-size-adjust:100%
    }
}

.theme-root {
    color: var(--primary-color);
    background-color: var(--primary-bg-color)
}

.theme-root.light {
    color-scheme: light
}

.theme-root.dark {
    color-scheme: dark
}

pre {
    color: var(--primary-color)
}

.wide-page-wrapper,.wide-page-wrapper+footer {
    --max-width: var(--max-width-wide-page)
}

.animated,.btn,.collapsing,a {
    transition: var(--transition)
}

.btn {
    transition: var(--transition),outline 0s
}

.btn:focus {
    box-shadow: none
}

textarea {
    resize: none
}

.collapse:not(.show) {
    display: none!important
}

input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.cursor-pointer {
    cursor: pointer
}

.cursor-grab {
    cursor: -webkit-grab;
    cursor: grab
}

.cursor-copy {
    cursor: copy
}

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

.rounded-border {
    border-radius: var(--border-radius);
    border: 1px solid var(--divider-color);
    overflow: hidden
}

svg.walletconnect-qrcode__image {
    width: inherit;
    height: inherit
}