element.style {
    font-size: 100%;
    --saturation-factor: 1;
    dynamic-range-limit: no-limit;
    --custom-zoom: 100;
    --devtools-sidebar-width: 0px;
}
.mana-toggle-inputs .theme-darker, .mana-toggle-inputs .theme-midnight, .mana-toggle-inputs.theme-darker, .mana-toggle-inputs.theme-midnight {
    --checkbox-background-default: hsl(var(--opacity-black-8-hsl) / 0.0784313725490196);
    --checkbox-border-default: hsl(var(--opacity-64-hsl) / 0.6392156862745098);
}
.mana-toggle-inputs .theme-dark, .mana-toggle-inputs.theme-dark {
    --checkbox-background-default: hsl(var(--opacity-black-8-hsl) / 0.0784313725490196);
    --checkbox-border-default: hsl(var(--opacity-64-hsl) / 0.6392156862745098);
}
:root {
    --custom-bg-surface-overlay: rgba(33, 34, 41, .8);
}
:root {
    --custom-bg-surface-overlay: rgba(33, 34, 41, .8);
}
.theme-dark {
    --legacy-elevation-low: 0 1px 5px 0 var(--opacity-black-28);
    --legacy-elevation-high: 0 2px 10px 0 var(--opacity-black-20);
    --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6);
}
:root {
    --legacy-elevation-low: 0 1px 5px var(--opacity-black-20);
    --legacy-elevation-high: 0 2px 10px 0 var(--opacity-black-8);
    --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3);
}
:root {
    --custom-premium-marketing-hero-heading-padding-top: 120px;
}
:root {
    --custom-app-message-embed-base-info-gap: 4px;
    --custom-app-message-embed-base-info-top: calc(var(--custom-app-message-embed-base-info-gap) - 2px);
}
:root {
    --custom-app-message-embed-base-info-gap: 4px;
    --custom-app-message-embed-base-info-top: calc(var(--custom-app-message-embed-base-info-gap) - 2px);
}
:root {
    --custom-app-message-embed-base-info-gap: 4px;
    --custom-app-message-embed-base-info-top: calc(var(--custom-app-message-embed-base-info-gap) - 2px);
}
:root {
    --custom-app-message-embed-base-info-gap: 4px;
    --custom-app-message-embed-base-info-top: calc(var(--custom-app-message-embed-base-info-gap) - 2px);
}
:root {
    --custom-guild-list-padding: var(--space-md);
    --custom-guild-list-width: calc(var(--guildbar-avatar-size) + var(--custom-guild-list-padding) * 2);
    --custom-guild-sidebar-width: 268px;
    --custom-app-sidebar-target-width: calc(var(--custom-guild-sidebar-width) + var(--custom-guild-list-width));
    --custom-rtc-account-height: 44px;
    --custom-app-top-bar-height: 32px;
    --custom-app-top-bar-item-radius: 6px;
    --custom-channel-header-height: calc(var(--guildbar-avatar-size) + var(--space-xs));
    --custom-member-list-width: 264px;
    --custom-channel-textarea-text-area-height: 56px;
    --custom-chat-aligned-icon-offset: ((var(--chat-avatar-size) - var(--chat-input-icon-size)) / 2);
    --custom-message-margin-horizontal: var(--space-md);
}
:root {
    --custom-add-permissions-modal-focus-ring-width: 4px;
    --custom-custom-role-icon-form-item-role-icon-preview-size: 32px;
    --custom-guild-settings-roles-edit-shared-sidebar-width: 232px;
    --custom-guild-settings-roles-intro-roles-transition: 250ms;
    --custom-guild-settings-roles-intro-pause-transition: 166ms;
    --custom-guild-settings-roles-intro-background-transition: 500ms;
    --custom-guild-settings-roles-intro-banner-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + var(--custom-guild-settings-roles-intro-pause-transition));
    --custom-guild-settings-roles-intro-roles-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + var(--custom-guild-settings-roles-intro-pause-transition) * 2 + var(--custom-guild-settings-roles-intro-background-transition));
    --custom-guild-settings-community-intro-content-spacing: 32px;
    --custom-guild-settings-community-intro-hover-distance: -12px;
    --custom-guild-settings-community-intro-text-spacing: 8px;
    --custom-guild-settings-discovery-landing-page-max-width-tab: 905px;
    --custom-guild-settings-discovery-landing-page-settings-max-width: 520px;
    --custom-guild-settings-partner-content-spacing: 32px;
    --custom-event-detail-info-tab-base-spacing: 8px;
    --custom-subscription-listing-previews-carousel-cards-get-cut-off-width: 724px;
    --custom-editable-benefits-list-emoji-size: 24px;
    --custom-edit-benefit-modal-emoji-size: 22px;
    --custom-edit-benefit-modal-emoji-margin: 10px;
    --custom-guild-settings-role-subscriptions-max-width: 905px;
    --custom-guild-settings-role-subscriptions-overview-settings-max-width: 520px;
    --custom-guild-settings-store-page-settings-max-width: 520px;
    --custom-importable-benefits-list-listing-image-size: 40px;
    --custom-import-benefits-modal-icon-size: 24px;
    --custom-import-benefits-modal-role-icon-size: 40px;
    --custom-role-icon-uploader-icon-size: 24px;
    --custom-guild-role-subscription-style-constants-cover-image-aspect-ratio: 4;
    --custom-historic-earnings-table-toggle-expand-column-width: 30px;
    --custom-guild-role-subscription-card-basic-info-tier-image-size: 80px;
    --custom-guild-role-subscription-card-basic-info-tier-image-size-mobile: 48px;
    --custom-guild-role-subscriptions-overview-page-page-max-width: 1180px;
    --custom-guild-dialog-popout-width: 250px;
    --custom-guild-dialog-splash-ratio: 1.77778;
    --custom-guild-dialog-icon-size: 84px;
    --custom-guild-dialog-icon-padding: 4px;
    --custom-guild-product-download-modal-header-image-width: 119px;
    --custom-guild-onboarding-home-page-max-page-width: 1128px;
    --custom-guild-onboarding-home-page-max-single-column-width: 704px;
    --custom-home-resource-channels-obscured-blur-radius: 20px;
    --custom-guild-member-application-review-sidebar-width: 29vw;
    --custom-featured-items-popout-featured-items-popout-footer-height: 120px;
    --custom-guild-boosting-sidebar-display-conditional-bottom-margin: 12px;
    --custom-guild-boosting-marketing-progress-bar-marker-dimensions: 32px;
    --custom-guild-boosting-marketing-progress-bar-end-markers-margin: 4px;
    --custom-guild-boosting-marketing-progress-bar-marker-marker-dimensions: 32px;
    --custom-guild-boosting-marketing-tier-cards-tier-card-border-radius: 16px;
    --custom-go-live-modal-art-height: 112px;
    --custom-gif-picker-gutter-size: 0 16px 12px 16px;
    --custom-gif-picker-search-results-desired-item-width: 160px;
    --custom-forum-composer-attachments-attachment-size: 78px;
Show all properties (149 more)
}
:root {
    --custom-index-scrollbar-width: 10px;
    --custom-index-scrollbar-margin: 3px;
    --custom-auth-box-auth-box-padding: 32px;
    --custom-wave-splash-responsive-width-mobile: 485px;
    --custom-wave-splash-responsive-width-mobile-first: 486px;
    --custom-wave-splash-responsive-width-desktop: 1080px;
    --custom-wave-splash-max-qr-login-width: 830px;
    --custom-channel-text-area-button-hover-scale: 0.85714;
    --custom-drag-resize-container-handle-size: 8px;
    --custom-drag-resize-container-handle-bleed: 2px;
    --custom-drag-resize-container-handle-offset: calc(var(--custom-drag-resize-container-handle-bleed) - var(--custom-drag-resize-container-handle-size));
    --custom-embed-spoiler-blur-radius: 44px;
    --custom-gradient-progress-notch-width: 8px;
    --custom-gradient-progress-notch-height: 16px;
    --custom-gradient-progress-notch-margin: 2px;
    --custom-guild-discovery-card-card-height: 320px;
    --custom-guild-discovery-card-card-height-with-tags: 350px;
    --custom-icon-button-icon-lg-size: 36px;
    --custom-icon-button-icon-md-size: 24px;
    --custom-icon-button-icon-sm-size: 18px;
    --custom-icon-button-icon-xs-size: 12px;
    --custom-invite-button-resolving-background-width: 380px;
    --custom-keybind-space-around-key: 8px;
    --custom-keybind-shadow-width: 2px;
    --custom-keybind-vertical-padding-total-height: 8px;
    --custom-keybind-applied-vertical-padding: calc((var(--custom-keybind-vertical-padding-total-height) - var(--custom-keybind-shadow-width)) / 2);
    --custom-full-screen-layer-animation-duration: 150ms;
    --custom-layout-sidebar-width: 232px;
    --custom-message-avatar-size: 40px;
    --custom-message-avatar-decoration-size: calc(var(--custom-message-avatar-size) * var(--decoration-to-avatar-ratio));
    --custom-message-margin-compact-indent: 5rem;
    --custom-message-spacing-vertical-container-cozy: 0.125rem;
    --custom-message-padding-vertical-container-compact: 0.125rem;
    --custom-message-meta-space: 0.25rem;
    --custom-message-reply-indent: 0.625rem;
    --custom-message-margin-left-content-cozy: calc(var(--custom-message-avatar-size, 40px) + var(--custom-message-margin-horizontal) + var(--custom-message-margin-horizontal));
    --custom-message-reply-message-preview-line-height: 1.125rem;
    --custom-message-attachment-spoiler-blur-radius: 44px;
    --custom-user-premium-guild-subscription-easter-egg-size: 196px;
    --custom-notification-spacing: 12px;
    --custom-notification-container-width: 300px;
    --custom-notification-space-around-divider: 12px;
    --custom-notification-box-shadow-opacity: 0.8;
    --custom-notification-box-shadow-blur-radius: 7px;
    --custom-notification-box-shadow-spread-radius: 3px;
    --custom-widget-max-widget-height: 100vh;
    --custom-widget-bar-padding: 12px;
    --custom-widget-body-padding: 4px;
    --custom-widget-bar-height: 20px;
    --custom-premium-guild-progress-bar-progress-bar-width: 24px;
Show all properties (113 more)
}
.density-default {
    --channels-name-line-height: 24px;
    --channels-spine-inverted-offset-top: 6px;
    --channels-spine-offset-left: 24px;
}
:root {
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extra-bold: 800;
    --channels-name-line-height: 24px;
    --channels-spine-inverted-offset-top: 6px;
    --channels-spine-offset-left: 24px;
    --chat-avatar-size: 40px;
    --chat-input-icon-size: 20px;
    --chat-markup-line-height: 1.375rem;
    --chat-resize-handle-width: 8px;
    --control-input-height-md: 40px;
    --control-input-height-sm: 32px;
    --control-item-height-md: 40px;
    --control-item-height-sm: 32px;
    --form-input-height: 44px;
    --guildbar-avatar-size: 40px;
    --guildbar-folder-size: 48px;
    --icon-size-lg: 32px;
    --icon-size-md: 24px;
    --icon-size-sm: 18px;
    --icon-size-xs: 16px;
    --icon-size-xxs: 12px;
    --modal-horizontal-padding: 24px;
    --modal-vertical-padding: 16px;
    --modal-width-large: 800px;
    --modal-width-medium: 602px;
    --modal-width-small: 442px;
    --select-max-width: 248px;
    --select-option-height: 40px;
}
:root {
    --font-primary: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-display: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-headline: "ABC Ginto Nord", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-code: "gg mono", "Source Code Pro", Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
    --font-clan-body: Fraunces, "gg sans", serif, "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-clan-signature: Corinthia, "gg sans", cursive, "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-display-marketing: "ABC Ginto Discord", "gg sans", serif, "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-display-marketing-header: "ABC Ginto Nord Discord", "gg sans", serif, "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.theme-dark {
    --guild-header-text-shadow: 0 1px 1px hsl(var(--black-hsl) / 0.4);
    --elevation-stroke: 0 0 0 1px hsl(var(--primary-900-hsl) / 0.15);
    --elevation-low: 0 1px 0 hsl(var(--primary-900-hsl) / 0.2), 0 1.5px 0 hsl(var(--primary-860-hsl) / 0.05), 0 2px 0 hsl(var(--primary-900-hsl) / 0.05);
    --elevation-medium: 0 4px 4px hsl(var(--black-hsl) / 0.16);
    --elevation-high: 0 8px 16px hsl(var(--black-hsl) / 0.24);
}
:root {
    --radius-none: 0px;
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-xxl: 32px;
    --radius-round: 2147483647px;
}
.density-default {
    --space-xxs: var(--space-4);
    --space-xs: var(--space-8);
    --space-sm: var(--space-12);
    --space-md: var(--space-16);
    --space-lg: var(--space-20);
    --space-xl: var(--space-24);
    --space-xxl: var(--space-32);
}
:root {
    --size-0: 0px;
    --size-4: 4px;
    --size-8: 8px;
    --size-12: 12px;
    --size-16: 16px;
    --size-20: 20px;
    --size-24: 24px;
    --size-32: 32px;
    --size-48: 48px;
    --size-64: 64px;
    --size-80: 80px;
    --size-96: 96px;
    --size-128: 128px;
    --size-160: 160px;
    --size-192: 192px;
    --size-xxs: var(--size-4);
    --size-xs: var(--size-8);
    --size-sm: var(--size-12);
    --size-md: var(--size-16);
    --size-lg: var(--size-20);
    --size-xl: var(--size-24);
    --size-xxl: var(--size-32);
    --breakpoint-480: 480px;
    --breakpoint-640: 640px;
    --breakpoint-768: 768px;
    --breakpoint-1024: 1024px;
    --breakpoint-1280: 1280px;
    --breakpoint-1536: 1536px;
    --breakpoint-1800: 1800px;
    --breakpoint-2500: 2500px;
    --breakpoint-xxs: 480px;
    --breakpoint-xs: 640px;
    --breakpoint-sm: 768px;
    --breakpoint-md: 1024px;
    --breakpoint-lg: 1280px;
    --breakpoint-xl: 1536px;
    --breakpoint-xxl: 1800px;
    --breakpoint-max: 2500px;
    --space-0: 0px;
    --space-4: 4px;
    --space-6: 6px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-26: 26px;
    --space-30: 30px;
    --space-32: 32px;
Show all properties (15 more)
}
.theme-darker, .theme-midnight {
    --shadow-border: 0 0 0 1px hsl(none 0% 100% / 0.08);
    --shadow-border-filter: drop-shadow(0 0 1px hsl(none 0% 100% / 0.08));
    --shadow-button-overlay: 0 12px 24px 0 hsl(none 0% 0% / 0.24);
    --shadow-button-overlay-filter: drop-shadow(0 12px 24px hsl(none 0% 0% / 0.24));
    --shadow-high: 0 12px 24px 0 hsl(none 0% 0% / 0.24);
    --shadow-high-filter: drop-shadow(0 12px 24px hsl(none 0% 0% / 0.24));
    --shadow-ledge: 0 2px 0 0 hsl(none 0% 0% / 0.05), 0 1.5px 0 0 hsl(none 0% 0% / 0.05), 0 1px 0 0 hsl(none 0% 0% / 0.16);
    --shadow-ledge-filter: drop-shadow(0 1.5px 0 hsl(none 0% 0% / 0.24));
    --shadow-low: 0 1px 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-filter: drop-shadow(0 1px 4px hsl(none 0% 0% / 0.14));
    --shadow-low-active: 0 0 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-active-filter: drop-shadow(0 0 4px hsl(none 0% 0% / 0.14));
    --shadow-low-hover: 0 4px 10px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-hover-filter: drop-shadow(0 4px 10px hsl(none 0% 0% / 0.14));
    --shadow-medium: 0 4px 8px 0 hsl(none 0% 0% / 0.16);
    --shadow-medium-filter: drop-shadow(0 4px 8px hsl(none 0% 0% / 0.16));
    --shadow-mobile-navigator-x: 0 0 10px 0 hsl(none 0% 0% / 0.22);
    --shadow-mobile-navigator-x-filter: drop-shadow(0 0 10px hsl(none 0% 0% / 0.22));
    --shadow-top-high: 0 -12px 32px 0 hsl(none 0% 0% / 0.24);
    --shadow-top-high-filter: drop-shadow(0 -12px 32px hsl(none 0% 0% / 0.24));
    --shadow-top-ledge: 0 -2px 0 0 hsl(none 0% 0% / 0.05), 0 -1.5px 0 0 hsl(none 0% 0% / 0.05), 0 -1px 0 0 hsl(none 0% 0% / 0.16);
    --shadow-top-ledge-filter: drop-shadow(0 -1.5px 0 hsl(none 0% 0% / 0.24));
    --shadow-top-low: 0 -1px 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-top-low-filter: drop-shadow(0 -1px 4px hsl(none 0% 0% / 0.14));
}
.theme-dark {
    --shadow-border: 0 0 0 1px hsl(none 0% 100% / 0.08);
    --shadow-border-filter: drop-shadow(0 0 1px hsl(none 0% 100% / 0.08));
    --shadow-button-overlay: 0 12px 24px 0 hsl(none 0% 0% / 0.24);
    --shadow-button-overlay-filter: drop-shadow(0 12px 24px hsl(none 0% 0% / 0.24));
    --shadow-high: 0 12px 24px 0 hsl(none 0% 0% / 0.24);
    --shadow-high-filter: drop-shadow(0 12px 24px hsl(none 0% 0% / 0.24));
    --shadow-ledge: 0 2px 0 0 hsl(none 0% 0% / 0.05), 0 1.5px 0 0 hsl(none 0% 0% / 0.05), 0 1px 0 0 hsl(none 0% 0% / 0.16);
    --shadow-ledge-filter: drop-shadow(0 1.5px 0 hsl(none 0% 0% / 0.24));
    --shadow-low: 0 1px 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-filter: drop-shadow(0 1px 4px hsl(none 0% 0% / 0.14));
    --shadow-low-active: 0 0 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-active-filter: drop-shadow(0 0 4px hsl(none 0% 0% / 0.14));
    --shadow-low-hover: 0 4px 10px 0 hsl(none 0% 0% / 0.14);
    --shadow-low-hover-filter: drop-shadow(0 4px 10px hsl(none 0% 0% / 0.14));
    --shadow-medium: 0 4px 8px 0 hsl(none 0% 0% / 0.16);
    --shadow-medium-filter: drop-shadow(0 4px 8px hsl(none 0% 0% / 0.16));
    --shadow-mobile-navigator-x: 0 0 10px 0 hsl(none 0% 0% / 0.22);
    --shadow-mobile-navigator-x-filter: drop-shadow(0 0 10px hsl(none 0% 0% / 0.22));
    --shadow-top-high: 0 -12px 32px 0 hsl(none 0% 0% / 0.24);
    --shadow-top-high-filter: drop-shadow(0 -12px 32px hsl(none 0% 0% / 0.24));
    --shadow-top-ledge: 0 -2px 0 0 hsl(none 0% 0% / 0.05), 0 -1.5px 0 0 hsl(none 0% 0% / 0.05), 0 -1px 0 0 hsl(none 0% 0% / 0.16);
    --shadow-top-ledge-filter: drop-shadow(0 -1.5px 0 hsl(none 0% 0% / 0.24));
    --shadow-top-low: 0 -1px 4px 0 hsl(none 0% 0% / 0.14);
    --shadow-top-low-filter: drop-shadow(0 -1px 4px hsl(none 0% 0% / 0.14));
}
.visual-refresh {
    --blue-100: var(--blue-new-1);
    --blue-100-hsl: var(--blue-new-1-hsl);
    --blue-130: var(--blue-new-1);
    --blue-130-hsl: var(--blue-new-1-hsl);
    --blue-160: var(--blue-new-1);
    --blue-160-hsl: var(--blue-new-1-hsl);
    --blue-200: var(--blue-new-5);
    --blue-200-hsl: var(--blue-new-5-hsl);
    --blue-230: var(--blue-new-11);
    --blue-230-hsl: var(--blue-new-11-hsl);
    --blue-260: var(--blue-new-16);
    --blue-260-hsl: var(--blue-new-16-hsl);
    --blue-300: var(--blue-new-24);
    --blue-300-hsl: var(--blue-new-24-hsl);
    --blue-330: var(--blue-new-30);
    --blue-330-hsl: var(--blue-new-30-hsl);
    --blue-345: var(--blue-new-36);
    --blue-345-hsl: var(--blue-new-36-hsl);
    --blue-360: var(--blue-new-40);
    --blue-360-hsl: var(--blue-new-40-hsl);
    --blue-400: var(--blue-new-46);
    --blue-400-hsl: var(--blue-new-46-hsl);
    --blue-430: var(--blue-new-52);
    --blue-430-hsl: var(--blue-new-52-hsl);
    --blue-460: var(--blue-new-57);
    --blue-460-hsl: var(--blue-new-57-hsl);
    --blue-500: var(--blue-new-62);
    --blue-500-hsl: var(--blue-new-62-hsl);
    --blue-530: var(--blue-new-67);
    --blue-530-hsl: var(--blue-new-67-hsl);
    --blue-560: var(--blue-new-71);
    --blue-560-hsl: var(--blue-new-71-hsl);
    --blue-600: var(--blue-new-75);
    --blue-600-hsl: var(--blue-new-75-hsl);
    --blue-630: var(--blue-new-78);
    --blue-630-hsl: var(--blue-new-78-hsl);
    --blue-660: var(--blue-new-81);
    --blue-660-hsl: var(--blue-new-81-hsl);
    --blue-700: var(--blue-new-84);
    --blue-700-hsl: var(--blue-new-84-hsl);
    --blue-730: var(--blue-new-87);
    --blue-730-hsl: var(--blue-new-87-hsl);
    --blue-760: var(--blue-new-90);
    --blue-760-hsl: var(--blue-new-90-hsl);
    --blue-800: var(--blue-new-92);
    --blue-800-hsl: var(--blue-new-92-hsl);
    --blue-830: var(--blue-new-94);
    --blue-830-hsl: var(--blue-new-94-hsl);
    --blue-860: var(--blue-new-95);
    --blue-860-hsl: var(--blue-new-95-hsl);
Show all properties (422 more)
}
:root {
    --neutral-1: hsl(var(--neutral-1-hsl) / 1);
    --neutral-1-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 100%;
    --neutral-2: hsl(var(--neutral-2-hsl) / 1);
    --neutral-2-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 98.431%;
    --neutral-3: hsl(var(--neutral-3-hsl) / 1);
    --neutral-3-hsl: 240 calc(var(--saturation-factor, 1) * 6.667%) 97.059%;
    --neutral-4: hsl(var(--neutral-4-hsl) / 1);
    --neutral-4-hsl: 240 calc(var(--saturation-factor, 1) * 4.348%) 95.49%;
    --neutral-5: hsl(var(--neutral-5-hsl) / 1);
    --neutral-5-hsl: 240 calc(var(--saturation-factor, 1) * 6.667%) 94.118%;
    --neutral-6: hsl(var(--neutral-6-hsl) / 1);
    --neutral-6-hsl: 210 calc(var(--saturation-factor, 1) * 5.263%) 92.549%;
    --neutral-7: hsl(var(--neutral-7-hsl) / 1);
    --neutral-7-hsl: 240 calc(var(--saturation-factor, 1) * 4.545%) 91.373%;
    --neutral-8: hsl(var(--neutral-8-hsl) / 1);
    --neutral-8-hsl: 240 calc(var(--saturation-factor, 1) * 3.846%) 89.804%;
    --neutral-9: hsl(var(--neutral-9-hsl) / 1);
    --neutral-9-hsl: 240 calc(var(--saturation-factor, 1) * 5.085%) 88.431%;
    --neutral-10: hsl(var(--neutral-10-hsl) / 1);
    --neutral-10-hsl: 240 calc(var(--saturation-factor, 1) * 4.478%) 86.863%;
    --neutral-11: hsl(var(--neutral-11-hsl) / 1);
    --neutral-11-hsl: 225 calc(var(--saturation-factor, 1) * 5.405%) 85.49%;
    --neutral-12: hsl(var(--neutral-12-hsl) / 1);
    --neutral-12-hsl: 225 calc(var(--saturation-factor, 1) * 4.878%) 83.922%;
    --neutral-13: hsl(var(--neutral-13-hsl) / 1);
    --neutral-13-hsl: 240 calc(var(--saturation-factor, 1) * 4.545%) 82.745%;
    --neutral-14: hsl(var(--neutral-14-hsl) / 1);
    --neutral-14-hsl: 240 calc(var(--saturation-factor, 1) * 4.167%) 81.176%;
    --neutral-15: hsl(var(--neutral-15-hsl) / 1);
    --neutral-15-hsl: 228 calc(var(--saturation-factor, 1) * 4.854%) 79.804%;
    --neutral-16: hsl(var(--neutral-16-hsl) / 1);
    --neutral-16-hsl: 228 calc(var(--saturation-factor, 1) * 4.505%) 78.235%;
    --neutral-17: hsl(var(--neutral-17-hsl) / 1);
    --neutral-17-hsl: 240 calc(var(--saturation-factor, 1) * 4.274%) 77.059%;
    --neutral-18: hsl(var(--neutral-18-hsl) / 1);
    --neutral-18-hsl: 240 calc(var(--saturation-factor, 1) * 4%) 75.49%;
    --neutral-19: hsl(var(--neutral-19-hsl) / 1);
    --neutral-19-hsl: 230 calc(var(--saturation-factor, 1) * 4.545%) 74.118%;
    --neutral-20: hsl(var(--neutral-20-hsl) / 1);
    --neutral-20-hsl: 230 calc(var(--saturation-factor, 1) * 4.286%) 72.549%;
    --neutral-21: hsl(var(--neutral-21-hsl) / 1);
    --neutral-21-hsl: 240 calc(var(--saturation-factor, 1) * 4.11%) 71.373%;
    --neutral-22: hsl(var(--neutral-22-hsl) / 1);
    --neutral-22-hsl: 231.429 calc(var(--saturation-factor, 1) * 4.575%) 70%;
    --neutral-23: hsl(var(--neutral-23-hsl) / 1);
    --neutral-23-hsl: 231.429 calc(var(--saturation-factor, 1) * 4.348%) 68.431%;
    --neutral-24: hsl(var(--neutral-24-hsl) / 1);
    --neutral-24-hsl: 240 calc(var(--saturation-factor, 1) * 4.192%) 67.255%;
    --neutral-25: hsl(var(--neutral-25-hsl) / 1);
    --neutral-25-hsl: 231.429 calc(var(--saturation-factor, 1) * 4%) 65.686%;
Show all properties (2780 more)
}
@supports (color:color-mix(in lch,red,blue)) {
    .theme-darker {
        --app-frame-background:  color-mix(in oklab, var(--neutral-97) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --app-frame-border:  color-mix(in oklab, hsl(var(--opacity-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --app-message-embed-secondary-text:  color-mix(in oklab, hsl(var(--white-hsl) / 0.7) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7) var(--custom-theme-text-color-amount, 0%));
        --background-accent:  color-mix(in oklab, var(--plum-15) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-low:  color-mix(in oklab, var(--neutral-82) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-lower:  color-mix(in oklab, var(--neutral-86) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-lowest:  color-mix(in oklab, var(--neutral-92) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-code:  color-mix(in oklab, hsl(var(--opacity-blurple-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-code-addition:  color-mix(in oklab, hsl(var(--opacity-green-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-base-color-amount, 0%));
        --background-code-deletion:  color-mix(in oklab, hsl(var(--opacity-red-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-critical:  color-mix(in oklab, hsl(var(--opacity-red-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-info:  color-mix(in oklab, hsl(var(--opacity-blue-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-positive:  color-mix(in oklab, hsl(var(--opacity-green-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-warning:  color-mix(in oklab, hsl(var(--opacity-yellow-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-scrim:  color-mix(in oklab, hsl(var(--opacity-black-72-hsl) / 0.7215686274509804) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7215686274509804) var(--custom-theme-base-color-amount, 0%));
        --background-scrim-lightbox:  color-mix(in oklab, hsl(var(--opacity-black-92-hsl) / 0.9215686274509803) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.9215686274509803) var(--custom-theme-base-color-amount, 0%));
        --background-secondary-alt:  color-mix(in oklab, var(--plum-15) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-high:  color-mix(in oklab, var(--neutral-79) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-higher:  color-mix(in oklab, var(--neutral-76) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-highest:  color-mix(in oklab, var(--neutral-73) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-tile-gradient-pink-end:  color-mix(in oklab, hsl(var(--illo-pink-70-hsl) / 0.3) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.3) var(--custom-theme-base-color-amount, 0%));
        --background-tile-gradient-pink-start:  color-mix(in oklab, hsl(var(--illo-pink-50-hsl) / 0.3) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.3) var(--custom-theme-base-color-amount, 0%));
        --bg-surface-raised:  color-mix(in oklab, var(--plum-18) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --border-feedback-critical:  color-mix(in oklab, hsl(var(--opacity-red-20-hsl) / 0.2) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.2) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-focus:  color-mix(in oklab, var(--blue-new-30) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-muted:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-normal:  color-mix(in oklab, hsl(var(--opacity-20-hsl) / 0.2) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.2) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-strong:  color-mix(in oklab, hsl(var(--opacity-44-hsl) / 0.4392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.4392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-subtle:  color-mix(in oklab, hsl(var(--opacity-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --card-background-default:  color-mix(in oklab, var(--neutral-79) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --card-primary-pressed-bg:  color-mix(in oklab, var(--plum-19) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --card-secondary-bg:  color-mix(in oklab, hsl(var(--opacity-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --card-secondary-pressed-bg:  color-mix(in oklab, var(--plum-21) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --channel-icon:  color-mix(in oklab, var(--neutral-35) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channel-text-area-placeholder:  color-mix(in oklab, var(--plum-11) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channels-default:  color-mix(in oklab, var(--neutral-35) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channeltextarea-background:  color-mix(in oklab, var(--plum-15) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-background:  color-mix(in oklab, var(--plum-16) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-background-default:  color-mix(in oklab, var(--neutral-80) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-border:  color-mix(in oklab, var(--plum-20) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --chat-text-muted:  color-mix(in oklab, var(--neutral-35) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --content-inventory-media-seekbar-container:  color-mix(in oklab, hsl(var(--plum-6-hsl) / 0.24) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.24) var(--custom-theme-base-color-amount, 0%));
        --content-inventory-overlay-text-primary:  color-mix(in oklab, hsl(var(--white-hsl) / 0.85) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.85) var(--custom-theme-text-color-amount, 0%));
        --content-inventory-overlay-text-secondary:  color-mix(in oklab, hsl(var(--white-hsl) / 0.7) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7) var(--custom-theme-text-color-amount, 0%));
        --context-menu-backdrop-background:  color-mix(in oklab, hsl(var(--opacity-black-72-hsl) / 0.7215686274509804) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7215686274509804) var(--custom-theme-base-color-amount, 0%));
        --control-brand-foreground:  color-mix(in oklab, var(--brand-360) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --control-brand-foreground-new:  color-mix(in oklab, var(--brand-360) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --control-secondary-border-active:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --control-secondary-border-default:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --creator-revenue-icon-gradient-end:  color-mix(in oklab, var(--teal-430) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
Show all properties (171 more)
    }
}
.theme-darker {
    --app-frame-background: var(--neutral-97);
    --app-frame-border: hsl(var(--opacity-12-hsl) / 0.12156862745098039);
    --app-message-embed-secondary-text: hsl(var(--white-hsl) / 0.7);
    --background-accent: var(--plum-15);
    --background-base-low: var(--neutral-82);
    --background-base-lower: var(--neutral-86);
    --background-base-lowest: var(--neutral-92);
    --background-brand: var(--blurple-50);
    --background-code: hsl(var(--opacity-blurple-8-hsl) / 0.0784313725490196);
    --background-code-addition: hsl(var(--opacity-green-12-hsl) / 0.12156862745098039);
    --background-code-deletion: hsl(var(--opacity-red-12-hsl) / 0.12156862745098039);
    --background-feedback-critical: hsl(var(--opacity-red-8-hsl) / 0.0784313725490196);
    --background-feedback-info: hsl(var(--opacity-blue-8-hsl) / 0.0784313725490196);
    --background-feedback-notification: var(--red-new-46);
    --background-feedback-positive: hsl(var(--opacity-green-8-hsl) / 0.0784313725490196);
    --background-feedback-warning: hsl(var(--opacity-yellow-8-hsl) / 0.0784313725490196);
    --background-mod-muted: hsl(var(--opacity-4-hsl) / 0.0392156862745098);
    --background-mod-normal: hsl(var(--opacity-16-hsl) / 0.1607843137254902);
    --background-mod-strong: hsl(var(--opacity-20-hsl) / 0.2);
    --background-mod-subtle: hsl(var(--opacity-8-hsl) / 0.0784313725490196);
    --background-scrim: hsl(var(--opacity-black-72-hsl) / 0.7215686274509804);
    --background-scrim-lightbox: hsl(var(--opacity-black-92-hsl) / 0.9215686274509803);
    --background-secondary-alt: var(--plum-15);
    --background-surface-high: var(--neutral-79);
    --background-surface-higher: var(--neutral-76);
    --background-surface-highest: var(--neutral-73);
    --background-tile-gradient-pink-end: hsl(var(--illo-pink-70-hsl) / 0.3);
    --background-tile-gradient-pink-start: hsl(var(--illo-pink-50-hsl) / 0.3);
    --badge-background-brand: var(--blurple-50);
    --badge-background-default: hsl(var(--opacity-16-hsl) / 0.1607843137254902);
    --badge-expressive-background-default: var(--neutral-1);
    --badge-expressive-text-default: var(--neutral-71);
    --badge-notification-background: var(--red-new-46);
    --badge-text-brand: var(--neutral-1);
    --badge-text-default: var(--neutral-2);
    --bg-surface-raised: var(--plum-18);
    --border-feedback-critical: hsl(var(--opacity-red-20-hsl) / 0.2);
    --border-focus: var(--blue-new-30);
    --border-muted: hsl(var(--opacity-4-hsl) / 0.0392156862745098);
    --border-normal: hsl(var(--opacity-20-hsl) / 0.2);
    --border-strong: hsl(var(--opacity-44-hsl) / 0.4392156862745098);
    --border-subtle: hsl(var(--opacity-12-hsl) / 0.12156862745098039);
    --button-danger-background-disabled: var(--red-new-50);
    --button-outline-brand-background-hover: var(--brand-500);
    --button-outline-brand-border-active: var(--brand-560);
    --button-outline-primary-text: var(--white);
    --card-background-default: var(--neutral-79);
    --card-primary-pressed-bg: var(--plum-19);
    --card-secondary-bg: hsl(var(--opacity-8-hsl) / 0.0784313725490196);
    --card-secondary-pressed-bg: var(--plum-21);
Show all properties (396 more)
}
@supports (color:color-mix(in lch,red,blue)) {
    .theme-dark {
        --app-frame-background:  color-mix(in oklab, var(--neutral-78) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --app-frame-border:  color-mix(in oklab, hsl(var(--opacity-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --app-message-embed-secondary-text:  color-mix(in oklab, hsl(var(--white-hsl) / 0.7) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7) var(--custom-theme-text-color-amount, 0%));
        --background-accent:  color-mix(in oklab, var(--primary-530) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-low:  color-mix(in oklab, var(--neutral-66) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-lower:  color-mix(in oklab, var(--neutral-69) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-base-lowest:  color-mix(in oklab, var(--neutral-73) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-code:  color-mix(in oklab, hsl(var(--opacity-blurple-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-code-addition:  color-mix(in oklab, hsl(var(--opacity-green-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-base-color-amount, 0%));
        --background-code-deletion:  color-mix(in oklab, hsl(var(--opacity-red-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-critical:  color-mix(in oklab, hsl(var(--opacity-red-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-info:  color-mix(in oklab, hsl(var(--opacity-blue-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-positive:  color-mix(in oklab, hsl(var(--opacity-green-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-feedback-warning:  color-mix(in oklab, hsl(var(--opacity-yellow-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --background-scrim:  color-mix(in oklab, hsl(var(--opacity-black-72-hsl) / 0.7215686274509804) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7215686274509804) var(--custom-theme-base-color-amount, 0%));
        --background-scrim-lightbox:  color-mix(in oklab, hsl(var(--opacity-black-92-hsl) / 0.9215686274509803) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.9215686274509803) var(--custom-theme-base-color-amount, 0%));
        --background-secondary-alt:  color-mix(in oklab, var(--primary-660) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-high:  color-mix(in oklab, var(--neutral-64) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-higher:  color-mix(in oklab, var(--neutral-62) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-surface-highest:  color-mix(in oklab, var(--neutral-60) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --background-tile-gradient-pink-end:  color-mix(in oklab, hsl(var(--illo-pink-70-hsl) / 0.3) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.3) var(--custom-theme-base-color-amount, 0%));
        --background-tile-gradient-pink-start:  color-mix(in oklab, hsl(var(--illo-pink-50-hsl) / 0.3) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.3) var(--custom-theme-base-color-amount, 0%));
        --bg-surface-raised:  color-mix(in oklab, var(--primary-560) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --border-feedback-critical:  color-mix(in oklab, hsl(var(--opacity-red-20-hsl) / 0.2) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.2) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-focus:  color-mix(in oklab, var(--blue-new-30) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-muted:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-normal:  color-mix(in oklab, hsl(var(--opacity-20-hsl) / 0.2) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.2) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-strong:  color-mix(in oklab, hsl(var(--opacity-44-hsl) / 0.4392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.4392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --border-subtle:  color-mix(in oklab, hsl(var(--opacity-12-hsl) / 0.12156862745098039) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.12156862745098039) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --card-background-default:  color-mix(in oklab, var(--neutral-64) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --card-primary-pressed-bg:  color-mix(in oklab, var(--primary-645) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --card-secondary-bg:  color-mix(in oklab, hsl(var(--opacity-8-hsl) / 0.0784313725490196) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) var(--custom-theme-base-color-amount, 0%));
        --card-secondary-pressed-bg:  color-mix(in oklab, var(--primary-645) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --channel-icon:  color-mix(in oklab, var(--neutral-28) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channel-text-area-placeholder:  color-mix(in oklab, var(--primary-430) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channels-default:  color-mix(in oklab, var(--neutral-28) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --channeltextarea-background:  color-mix(in oklab, var(--primary-560) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-background:  color-mix(in oklab, var(--primary-600) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-background-default:  color-mix(in oklab, var(--neutral-64) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-base-color-amount, 0%));
        --chat-border:  color-mix(in oklab, var(--primary-700) 100%, var(--custom-theme-base-color, #000) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --chat-text-muted:  color-mix(in oklab, var(--neutral-27) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --content-inventory-media-seekbar-container:  color-mix(in oklab, hsl(var(--plum-6-hsl) / 0.24) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.24) var(--custom-theme-base-color-amount, 0%));
        --content-inventory-overlay-text-primary:  color-mix(in oklab, hsl(var(--white-hsl) / 0.85) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.85) var(--custom-theme-text-color-amount, 0%));
        --content-inventory-overlay-text-secondary:  color-mix(in oklab, hsl(var(--white-hsl) / 0.7) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7) var(--custom-theme-text-color-amount, 0%));
        --context-menu-backdrop-background:  color-mix(in oklab, hsl(var(--opacity-black-72-hsl) / 0.7215686274509804) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.7215686274509804) var(--custom-theme-base-color-amount, 0%));
        --control-brand-foreground:  color-mix(in oklab, var(--brand-360) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --control-brand-foreground-new:  color-mix(in oklab, var(--brand-360) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
        --control-secondary-border-active:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --control-secondary-border-default:  color-mix(in oklab, hsl(var(--opacity-4-hsl) / 0.0392156862745098) 100%, hsl(var(--custom-theme-base-color-hsl, 0 0% 0%) / 0.0392156862745098) var(--custom-theme-border-color-amount, var(--custom-theme-base-color-amount, 0%)));
        --creator-revenue-icon-gradient-end:  color-mix(in oklab, var(--teal-430) 100%, var(--custom-theme-text-color, #000) var(--custom-theme-text-color-amount, 0%));
Show all properties (171 more)
    }
}
.theme-dark {
    --app-frame-background: var(--neutral-78);
    --app-frame-border: hsl(var(--opacity-12-hsl) / 0.12156862745098039);
    --app-message-embed-secondary-text: hsl(var(--white-hsl) / 0.7);
    --background-accent: var(--primary-530);
    --background-base-low: var(--neutral-66);
    --background-base-lower: var(--neutral-69);
    --background-base-lowest: var(--neutral-73);
    --background-brand: var(--blurple-50);
    --background-code: hsl(var(--opacity-blurple-8-hsl) / 0.0784313725490196);
    --background-code-addition: hsl(var(--opacity-green-12-hsl) / 0.12156862745098039);
    --background-code-deletion: hsl(var(--opacity-red-12-hsl) / 0.12156862745098039);
    --background-feedback-critical: hsl(var(--opacity-red-8-hsl) / 0.0784313725490196);
    --background-feedback-info: hsl(var(--opacity-blue-8-hsl) / 0.0784313725490196);
    --background-feedback-notification: var(--red-new-46);
    --background-feedback-positive: hsl(var(--opacity-green-8-hsl) / 0.0784313725490196);
    --background-feedback-warning: hsl(var(--opacity-yellow-8-hsl) / 0.0784313725490196);
    --background-mod-muted: hsl(var(--opacity-4-hsl) / 0.0392156862745098);
    --background-mod-normal: hsl(var(--opacity-16-hsl) / 0.1607843137254902);
    --background-mod-strong: hsl(var(--opacity-20-hsl) / 0.2);
    --background-mod-subtle: hsl(var(--opacity-8-hsl) / 0.0784313725490196);
    --background-scrim: hsl(var(--opacity-black-72-hsl) / 0.7215686274509804);
    --background-scrim-lightbox: hsl(var(--opacity-black-92-hsl) / 0.9215686274509803);
    --background-secondary-alt: var(--primary-660);
    --background-surface-high: var(--neutral-64);
    --background-surface-higher: var(--neutral-62);
    --background-surface-highest: var(--neutral-60);
    --background-tile-gradient-pink-end: hsl(var(--illo-pink-70-hsl) / 0.3);
    --background-tile-gradient-pink-start: hsl(var(--illo-pink-50-hsl) / 0.3);
    --badge-background-brand: var(--blurple-50);
    --badge-background-default: hsl(var(--opacity-16-hsl) / 0.1607843137254902);
    --badge-expressive-background-default: var(--neutral-1);
    --badge-expressive-text-default: var(--neutral-71);
    --badge-notification-background: var(--red-new-46);
    --badge-text-brand: var(--neutral-1);
    --badge-text-default: var(--neutral-1);
    --bg-surface-raised: var(--primary-560);
    --border-feedback-critical: hsl(var(--opacity-red-20-hsl) / 0.2);
    --border-focus: var(--blue-new-30);
    --border-muted: hsl(var(--opacity-4-hsl) / 0.0392156862745098);
    --border-normal: hsl(var(--opacity-20-hsl) / 0.2);
    --border-strong: hsl(var(--opacity-44-hsl) / 0.4392156862745098);
    --border-subtle: hsl(var(--opacity-12-hsl) / 0.12156862745098039);
    --button-danger-background-disabled: var(--red-new-50);
    --button-outline-brand-background-hover: var(--brand-500);
    --button-outline-brand-border-active: var(--brand-560);
    --button-outline-primary-text: var(--white);
    --card-background-default: var(--neutral-64);
    --card-primary-pressed-bg: var(--primary-645);
    --card-secondary-bg: hsl(var(--opacity-8-hsl) / 0.0784313725490196);
    --card-secondary-pressed-bg: var(--primary-645);
Show all properties (396 more)
}
:root {
    --application-subscription-end: hsl(var(--application-subscription-end-hsl) / 1);
    --application-subscription-end-hsl: 196.564 calc(var(--saturation-factor, 1) * 98.788%) 32.353%;
    --application-subscription-start: hsl(var(--application-subscription-start-hsl) / 1);
    --application-subscription-start-hsl: 234.909 calc(var(--saturation-factor, 1) * 68.465%) 52.745%;
    --battlenet: hsl(var(--battlenet-hsl) / 1);
    --battlenet-hsl: 199.651 calc(var(--saturation-factor, 1) * 100%) 44.902%;
    --bg-animated-gradient-background-indigo-1: hsl(var(--bg-animated-gradient-background-indigo-1-hsl) / 1);
    --bg-animated-gradient-background-indigo-1-hsl: 241.5 calc(var(--saturation-factor, 1) * 57.143%) 27.451%;
    --bg-animated-gradient-background-indigo-2: hsl(var(--bg-animated-gradient-background-indigo-2-hsl) / 1);
    --bg-animated-gradient-background-indigo-2-hsl: 257.059 calc(var(--saturation-factor, 1) * 100%) 20%;
    --bg-animated-gradient-background-not-black: hsl(var(--bg-animated-gradient-background-not-black-hsl) / 1);
    --bg-animated-gradient-background-not-black-hsl: 240 calc(var(--saturation-factor, 1) * 7.143%) 5.49%;
    --bg-animated-gradient-background-pink-1: hsl(var(--bg-animated-gradient-background-pink-1-hsl) / 1);
    --bg-animated-gradient-background-pink-1-hsl: 327.831 calc(var(--saturation-factor, 1) * 80.583%) 59.608%;
    --bg-gradient-aurora-1: hsl(var(--bg-gradient-aurora-1-hsl) / 1);
    --bg-gradient-aurora-1-hsl: 219.74 calc(var(--saturation-factor, 1) * 86.517%) 17.451%;
    --bg-gradient-aurora-2: hsl(var(--bg-gradient-aurora-2-hsl) / 1);
    --bg-gradient-aurora-2-hsl: 237.778 calc(var(--saturation-factor, 1) * 76.415%) 41.569%;
    --bg-gradient-aurora-3: hsl(var(--bg-gradient-aurora-3-hsl) / 1);
    --bg-gradient-aurora-3-hsl: 183.556 calc(var(--saturation-factor, 1) * 78.035%) 33.922%;
    --bg-gradient-aurora-4: hsl(var(--bg-gradient-aurora-4-hsl) / 1);
    --bg-gradient-aurora-4-hsl: 169.2 calc(var(--saturation-factor, 1) * 60.241%) 32.549%;
    --bg-gradient-aurora-5: hsl(var(--bg-gradient-aurora-5-hsl) / 1);
    --bg-gradient-aurora-5-hsl: 229.839 calc(var(--saturation-factor, 1) * 92.537%) 26.275%;
    --bg-gradient-blurple-twilight-1: hsl(var(--bg-gradient-blurple-twilight-1-hsl) / 1);
    --bg-gradient-blurple-twilight-1-hsl: 233.904 calc(var(--saturation-factor, 1) * 79.574%) 53.922%;
    --bg-gradient-blurple-twilight-2: hsl(var(--bg-gradient-blurple-twilight-2-hsl) / 1);
    --bg-gradient-blurple-twilight-2-hsl: 245.294 calc(var(--saturation-factor, 1) * 63.75%) 31.373%;
    --bg-gradient-chroma-glow-1: hsl(var(--bg-gradient-chroma-glow-1-hsl) / 1);
    --bg-gradient-chroma-glow-1-hsl: 183.39 calc(var(--saturation-factor, 1) * 86.341%) 40.196%;
    --bg-gradient-chroma-glow-2: hsl(var(--bg-gradient-chroma-glow-2-hsl) / 1);
    --bg-gradient-chroma-glow-2-hsl: 258.113 calc(var(--saturation-factor, 1) * 89.831%) 46.275%;
    --bg-gradient-chroma-glow-3: hsl(var(--bg-gradient-chroma-glow-3-hsl) / 1);
    --bg-gradient-chroma-glow-3-hsl: 298.491 calc(var(--saturation-factor, 1) * 90.857%) 34.314%;
    --bg-gradient-chroma-glow-4: hsl(var(--bg-gradient-chroma-glow-4-hsl) / 1);
    --bg-gradient-chroma-glow-4-hsl: 264.767 calc(var(--saturation-factor, 1) * 100%) 66.275%;
    --bg-gradient-chroma-glow-5: hsl(var(--bg-gradient-chroma-glow-5-hsl) / 1);
    --bg-gradient-chroma-glow-5-hsl: 206.702 calc(var(--saturation-factor, 1) * 75.494%) 50.392%;
    --bg-gradient-citrus-sherbert-1: hsl(var(--bg-gradient-citrus-sherbert-1-hsl) / 1);
    --bg-gradient-citrus-sherbert-1-hsl: 39.683 calc(var(--saturation-factor, 1) * 88.732%) 58.235%;
    --bg-gradient-citrus-sherbert-2: hsl(var(--bg-gradient-citrus-sherbert-2-hsl) / 1);
    --bg-gradient-citrus-sherbert-2-hsl: 18 calc(var(--saturation-factor, 1) * 81.522%) 63.922%;
    --bg-gradient-cotton-candy-1: hsl(var(--bg-gradient-cotton-candy-1-hsl) / 1);
    --bg-gradient-cotton-candy-1-hsl: 349.315 calc(var(--saturation-factor, 1) * 76.842%) 81.373%;
    --bg-gradient-cotton-candy-2: hsl(var(--bg-gradient-cotton-candy-2-hsl) / 1);
    --bg-gradient-cotton-candy-2-hsl: 226.4 calc(var(--saturation-factor, 1) * 92.593%) 84.118%;
    --bg-gradient-crimson-moon-1: hsl(var(--bg-gradient-crimson-moon-1-hsl) / 1);
    --bg-gradient-crimson-moon-1-hsl: 0 calc(var(--saturation-factor, 1) * 88.608%) 30.98%;
    --bg-gradient-crimson-moon-2: hsl(var(--bg-gradient-crimson-moon-2-hsl) / 1);
    --bg-gradient-crimson-moon-2-hsl: 0 calc(var(--saturation-factor, 1) * 0%) 0%;
Show all properties (526 more)
}
.theme-dark {
    --legacy-elevation-low: 0 1px 5px 0 var(--opacity-black-28);
    --legacy-elevation-high: 0 2px 10px 0 var(--opacity-black-20);
    --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6);
}
:root {
    --legacy-elevation-low: 0 1px 5px var(--opacity-black-20);
    --legacy-elevation-high: 0 2px 10px 0 var(--opacity-black-8);
    --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3);
}
:root {
    --custom-paginator-round-button-size: 28px;
}
:root {
    --custom-app-launcher-sticky-header-height: 66px;
    --custom-app-launcher-container-border-radius: var(--radius-sm);
}
:root {
    --custom-app-launcher-sticky-header-height: 66px;
    --custom-app-launcher-container-border-radius: var(--radius-sm);
}
:root {
    --custom-channel-members-bg: var(--background-base-lower);
}
:root {
    --custom-user-profile-banner-height: 0;
    --custom-user-profile-theme-padding: 0;
    --custom-user-profile-base-layer-z-index: 0;
    --custom-user-profile-bottom-layer-z-index: 1;
    --custom-user-profile-middle-layer-z-index: 2;
    --custom-user-profile-top-layer-z-index: 3;
    --custom-user-profile-hoist-z-index: 4;
    --custom-user-profile-toast-z-index: 5;
}
.root, [data-popout-root], :root {
    --__spoiler-background-color--hidden: var(--spoiler-hidden-background);
    --__spoiler-background-color--hidden--hover: var(--spoiler-hidden-background-hover);
    --__spoiler-background-color--revealed: var(--background-mod-subtle);
    --__spoiler-text-color--hidden: transparent;
    --__spoiler-warning-text-color: var(--primary-200);
    --__spoiler-warning-text-color--hover: var(--white);
    --__spoiler-warning-background-color: var(--opacity-black-60);
    --__spoiler-warning-background-color--hover: var(--opacity-black-88);
    --__spoiler-container-box-shadow-color: var(--opacity-black-8);
    --__obscured-background-blur-radius: 40px;
    --__obscured-background-brightness: 0.55;
}
.theme-dark {
    --brightness: calc(1.5 - var(--saturation-factor, 1) * 0.5);
    --contrast: var(--saturation-factor, 1);
}
:root {
    --expand-structural-duration: 100ms;
    --expand-fade-duration: 200ms;
    --expand-easing-function: ease-out;
    --collapse-structural-duration: 150ms;
    --collapse-fade-duration: 150ms;
    --collapse-easing-function: ease-in;
}
.appMount__51fd7, body, html {
    height: 100%;
    width: 100%;
}
a, abbr, acronym, address, applet, big, blockquote, body, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, html, iframe, img, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, table, tbody, td, tfoot, th, thead, tr, tt, ul, var {
    border: 0;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
[data-popout-root], html {
    --brand-05a: hsla(var(--brand-500-hsl) / 0.05);
    --brand-10a: hsla(var(--brand-500-hsl) / 0.1);
    --brand-15a: hsla(var(--brand-500-hsl) / 0.15);
    --brand-20a: hsla(var(--brand-500-hsl) / 0.2);
    --brand-25a: hsla(var(--brand-500-hsl) / 0.25);
    --brand-30a: hsla(var(--brand-500-hsl) / 0.3);
    --brand-35a: hsla(var(--brand-500-hsl) / 0.35);
    --brand-40a: hsla(var(--brand-500-hsl) / 0.4);
    --brand-45a: hsla(var(--brand-500-hsl) / 0.45);
    --brand-50a: hsla(var(--brand-500-hsl) / 0.5);
    --brand-55a: hsla(var(--brand-500-hsl) / 0.55);
    --brand-60a: hsla(var(--brand-500-hsl) / 0.6);
    --brand-65a: hsla(var(--brand-500-hsl) / 0.65);
    --brand-70a: hsla(var(--brand-500-hsl) / 0.7);
    --brand-75a: hsla(var(--brand-500-hsl) / 0.75);
    --brand-80a: hsla(var(--brand-500-hsl) / 0.8);
    --brand-85a: hsla(var(--brand-500-hsl) / 0.85);
    --brand-90a: hsla(var(--brand-500-hsl) / 0.9);
    --brand-95a: hsla(var(--brand-500-hsl) / 0.95);
}
html[Attributes Style] {
    -webkit-locale: "en-US";
}
user agent stylesheet
:root {
    view-transition-name: root;
}
user agent stylesheet
html {
    display: block;
}
<style>
--custom-voice-invite-suggestions-timer-progress {
    syntax: "<number>";
    inherits: false;
    initial-value: 0;
}