/* Generated by gen_theme.py from Zulip app_variables.css. */
html:root {
    --grey-0: light-dark(hsl(95deg 22% 97.8%), hsl(138deg 38% 97.8%));
    --grey-50: light-dark(hsl(95deg 22% 95.9%), hsl(138deg 24% 95.9%));
    --grey-100: light-dark(hsl(95deg 22% 93.1%), hsl(138deg 26% 93.1%));
    --grey-150: light-dark(hsl(95deg 22% 89.2%), hsl(138deg 16% 89.2%));
    --grey-200: light-dark(hsl(40deg 12% 81.8%), hsl(40deg 22% 81.8%));
    --grey-250: light-dark(hsl(40deg 12% 75.9%), hsl(40deg 22% 75.9%));
    --grey-300: light-dark(hsl(40deg 12% 69.8%), hsl(40deg 22% 69.8%));
    --grey-350: light-dark(hsl(40deg 12% 65.1%), hsl(40deg 22% 65.1%));
    --grey-400: light-dark(hsl(40deg 12% 60.4%), hsl(40deg 22% 62.0%));
    --grey-450: light-dark(hsl(40deg 12% 55.7%), hsl(40deg 22% 62.0%));
    --grey-500: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 6% 49.8%));
    --grey-550: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 6% 41.8%));
    --grey-600: light-dark(hsl(210deg 5% 39.3%), hsl(40deg 6% 35.7%));
    --grey-650: light-dark(hsl(210deg 5% 32.8%), hsl(40deg 6% 29.8%));
    --grey-700: light-dark(hsl(210deg 5% 28.0%), hsl(40deg 6% 25.5%));
    --grey-750: light-dark(hsl(210deg 5% 22.6%), hsl(40deg 6% 20.6%));
    --grey-800: light-dark(hsl(140deg 15% 18.0%), hsl(140deg 15% 62.0%));
    --grey-850: light-dark(hsl(140deg 21% 18.0%), hsl(140deg 20% 62.0%));
    --grey-900: light-dark(hsl(140deg 28% 18.0%), hsl(140deg 20% 62.0%));
    --grey-950: light-dark(hsl(140deg 39% 18.0%), hsl(140deg 20% 62.0%));
    --grey-1000: light-dark(hsl(140deg 44% 18.0%), hsl(140deg 20% 62.0%));
    --purple-0: light-dark(hsl(95deg 22% 97.1%), hsl(138deg 38% 97.1%));
    --purple-50: light-dark(hsl(95deg 22% 95.9%), hsl(138deg 38% 95.9%));
    --purple-100: light-dark(hsl(95deg 22% 94.3%), hsl(138deg 38% 94.3%));
    --purple-150: light-dark(hsl(95deg 22% 92.7%), hsl(138deg 38% 92.7%));
    --purple-200: light-dark(hsl(95deg 22% 88.6%), hsl(138deg 38% 88.6%));
    --purple-250: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 85.3%));
    --purple-300: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 82.0%));
    --purple-350: light-dark(hsl(140deg 25% 78.6%), hsl(138deg 38% 78.6%));
    --purple-400: light-dark(hsl(140deg 25% 75.3%), hsl(138deg 38% 75.3%));
    --purple-450: light-dark(hsl(140deg 25% 71.4%), hsl(138deg 38% 71.4%));
    --purple-500: light-dark(hsl(140deg 25% 66.1%), hsl(138deg 38% 66.1%));
    --purple-550: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 62.0%));
    --purple-600: light-dark(hsl(140deg 48% 30.2%), hsl(138deg 38% 62.0%));
    --purple-650: light-dark(hsl(140deg 48% 26.1%), hsl(138deg 38% 62.0%));
    --purple-700: light-dark(hsl(140deg 48% 21.6%), hsl(138deg 38% 62.0%));
    --purple-750: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --purple-800: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --purple-850: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --purple-900: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --purple-950: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --purple-1000: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-0: light-dark(hsl(95deg 22% 97.1%), hsl(138deg 38% 97.1%));
    --violet-50: light-dark(hsl(95deg 22% 95.7%), hsl(138deg 38% 95.7%));
    --violet-100: light-dark(hsl(95deg 22% 94.1%), hsl(138deg 38% 94.1%));
    --violet-150: light-dark(hsl(95deg 22% 91.8%), hsl(138deg 38% 91.8%));
    --violet-200: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 88.0%));
    --violet-250: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 84.5%));
    --violet-300: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 81.4%));
    --violet-350: light-dark(hsl(140deg 25% 78.4%), hsl(138deg 38% 78.4%));
    --violet-400: light-dark(hsl(140deg 25% 75.9%), hsl(138deg 38% 75.9%));
    --violet-450: light-dark(hsl(140deg 25% 73.1%), hsl(138deg 38% 73.1%));
    --violet-500: light-dark(hsl(140deg 25% 68.2%), hsl(138deg 38% 68.2%));
    --violet-550: light-dark(hsl(140deg 25% 61.6%), hsl(138deg 38% 62.0%));
    --violet-600: light-dark(hsl(140deg 48% 31.4%), hsl(138deg 38% 62.0%));
    --violet-650: light-dark(hsl(140deg 48% 27.4%), hsl(138deg 38% 62.0%));
    --violet-700: light-dark(hsl(140deg 48% 23.1%), hsl(138deg 38% 62.0%));
    --violet-750: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-800: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-850: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-900: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-950: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --violet-1000: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --blue-0: light-dark(hsl(95deg 22% 96.7%), hsl(138deg 38% 96.7%));
    --blue-50: light-dark(hsl(95deg 22% 94.7%), hsl(138deg 38% 94.7%));
    --blue-100: light-dark(hsl(95deg 22% 92.4%), hsl(138deg 38% 92.4%));
    --blue-150: light-dark(hsl(95deg 22% 89.4%), hsl(138deg 38% 89.4%));
    --blue-200: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 84.9%));
    --blue-250: light-dark(hsl(140deg 25% 79.4%), hsl(138deg 38% 79.4%));
    --blue-300: light-dark(hsl(140deg 25% 75.5%), hsl(138deg 38% 75.5%));
    --blue-350: light-dark(hsl(140deg 25% 72.0%), hsl(138deg 38% 72.0%));
    --blue-400: light-dark(hsl(140deg 25% 68.0%), hsl(138deg 38% 68.0%));
    --blue-450: light-dark(hsl(140deg 25% 64.7%), hsl(138deg 38% 64.7%));
    --blue-500: light-dark(hsl(140deg 25% 60.8%), hsl(138deg 38% 62.0%));
    --blue-550: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 62.0%));
    --blue-600: light-dark(hsl(140deg 48% 27.8%), hsl(138deg 38% 62.0%));
    --blue-650: light-dark(hsl(140deg 48% 24.4%), hsl(138deg 38% 62.0%));
    --blue-700: light-dark(hsl(140deg 48% 22.0%), hsl(138deg 38% 62.0%));
    --blue-750: light-dark(hsl(140deg 48% 19.2%), hsl(138deg 38% 62.0%));
    --blue-800: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --blue-850: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --blue-900: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --blue-950: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --blue-1000: light-dark(hsl(140deg 48% 18.0%), hsl(140deg 20% 62.0%));
    --green-0: light-dark(hsl(140deg 35% 96.1%), hsl(140deg 35% 96.1%));
    --green-50: light-dark(hsl(140deg 35% 90.6%), hsl(140deg 35% 90.6%));
    --green-100: light-dark(hsl(140deg 35% 85.3%), hsl(140deg 35% 85.3%));
    --green-150: light-dark(hsl(140deg 35% 80.8%), hsl(140deg 35% 80.8%));
    --green-200: light-dark(hsl(140deg 35% 71.0%), hsl(140deg 35% 71.0%));
    --green-250: light-dark(hsl(140deg 35% 62.7%), hsl(140deg 35% 62.7%));
    --green-300: light-dark(hsl(140deg 35% 55.1%), hsl(140deg 35% 62.0%));
    --green-350: light-dark(hsl(140deg 35% 46.9%), hsl(140deg 35% 62.0%));
    --green-400: light-dark(hsl(140deg 35% 40.4%), hsl(140deg 35% 62.0%));
    --green-450: light-dark(hsl(140deg 35% 32.2%), hsl(140deg 35% 62.0%));
    --green-500: light-dark(hsl(140deg 35% 27.1%), hsl(140deg 35% 62.0%));
    --green-550: light-dark(hsl(140deg 35% 24.9%), hsl(140deg 35% 62.0%));
    --green-600: light-dark(hsl(140deg 35% 22.0%), hsl(140deg 35% 62.0%));
    --green-650: light-dark(hsl(140deg 35% 18.0%), hsl(140deg 35% 62.0%));
    --green-700: light-dark(hsl(140deg 35% 16.5%), hsl(140deg 35% 62.0%));
    --green-750: light-dark(hsl(140deg 35% 13.5%), hsl(140deg 35% 62.0%));
    --green-800: light-dark(hsl(140deg 35% 9.8%), hsl(140deg 35% 62.0%));
    --green-850: light-dark(hsl(140deg 35% 8.0%), hsl(140deg 35% 62.0%));
    --green-900: light-dark(hsl(140deg 35% 5.7%), hsl(140deg 35% 62.0%));
    --green-950: light-dark(hsl(140deg 35% 4.3%), hsl(140deg 35% 62.0%));
    --green-1000: light-dark(hsl(140deg 35% 2.7%), hsl(140deg 35% 62.0%));
    --orange-0: light-dark(hsl(38deg 70% 94.3%), hsl(38deg 70% 94.3%));
    --orange-50: light-dark(hsl(37deg 70% 90.2%), hsl(37deg 70% 90.2%));
    --orange-100: light-dark(hsl(38deg 70% 80.4%), hsl(38deg 70% 80.4%));
    --orange-150: light-dark(hsl(39deg 70% 71.6%), hsl(39deg 70% 71.6%));
    --orange-200: light-dark(hsl(40deg 70% 61.8%), hsl(40deg 70% 62.0%));
    --orange-250: light-dark(hsl(40deg 70% 55.9%), hsl(40deg 70% 62.0%));
    --orange-300: light-dark(hsl(41deg 70% 46.5%), hsl(41deg 70% 62.0%));
    --orange-350: light-dark(hsl(39deg 70% 45.5%), hsl(39deg 70% 62.0%));
    --orange-400: light-dark(hsl(39deg 70% 41.8%), hsl(39deg 70% 62.0%));
    --orange-450: light-dark(hsl(37deg 70% 36.7%), hsl(37deg 70% 62.0%));
    --orange-500: light-dark(hsl(37deg 70% 34.1%), hsl(37deg 70% 62.0%));
    --orange-550: light-dark(hsl(35deg 70% 30.6%), hsl(35deg 70% 62.0%));
    --orange-600: light-dark(hsl(34deg 70% 29.0%), hsl(34deg 70% 62.0%));
    --orange-650: light-dark(hsl(34deg 70% 24.5%), hsl(34deg 70% 62.0%));
    --orange-700: light-dark(hsl(33deg 70% 21.6%), hsl(33deg 70% 62.0%));
    --orange-750: light-dark(hsl(33deg 70% 16.7%), hsl(33deg 70% 62.0%));
    --orange-800: light-dark(hsl(33deg 70% 13.1%), hsl(33deg 70% 62.0%));
    --orange-850: light-dark(hsl(31deg 70% 10.6%), hsl(31deg 70% 62.0%));
    --orange-900: light-dark(hsl(31deg 70% 8.4%), hsl(31deg 70% 62.0%));
    --orange-950: light-dark(hsl(27deg 70% 6.5%), hsl(27deg 70% 62.0%));
    --orange-1000: light-dark(hsl(26deg 70% 5.3%), hsl(26deg 70% 62.0%));
    --red-0: light-dark(hsl(10deg 40% 96.9%), hsl(8deg 50% 96.9%));
    --red-50: light-dark(hsl(10deg 40% 93.9%), hsl(8deg 50% 93.9%));
    --red-100: light-dark(hsl(10deg 40% 90.2%), hsl(8deg 50% 90.2%));
    --red-150: light-dark(hsl(10deg 40% 85.5%), hsl(8deg 50% 85.5%));
    --red-200: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 79.4%));
    --red-250: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 74.3%));
    --red-300: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 69.4%));
    --red-350: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 65.3%));
    --red-400: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 62.0%));
    --red-450: light-dark(hsl(8deg 55% 42.5%), hsl(8deg 50% 62.0%));
    --red-500: light-dark(hsl(8deg 55% 38.0%), hsl(8deg 50% 62.0%));
    --red-550: light-dark(hsl(8deg 55% 31.2%), hsl(8deg 50% 62.0%));
    --red-600: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-650: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-700: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-750: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-800: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-850: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-900: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-950: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --red-1000: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 62.0%));
    --color-border-message-group-spacer-line: light-dark(color-mix(in oklch, hsl(210deg 5% 0.0%) 15%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 15%, transparent));
    --color-date: light-dark(hsl(210deg 5% 16.5% / 75%), hsl(40deg 22% 90.0% / 75%));
    --color-background-private-message-header: light-dark(hsl(46deg 35% 93.0%), hsl(46deg 15% 20.0%));
    --color-background-private-message-content: light-dark(hsl(45deg 20% 96.0%), hsl(40deg 6% 16.0%));
    --color-background-stream-message-content: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 13.5%));
    --color-selected-message-outline: light-dark(hsl(140deg 48% 32.0% / 60%), hsl(138deg 38% 59.0% / 70%));
    --color-selected-gif-in-grid-picker: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 59.0%));
    --color-hovered-gif-in-grid-picker: light-dark(hsl(140deg 48% 32.0% / 50%), hsl(138deg 38% 59.0% / 60%));
    --color-message-list-border: light-dark(hsl(210deg 5% 0.0% / 16%), hsl(40deg 6% 0.0% / 40%));
    --color-message-header-contents-border: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 60%));
    --color-private-message-header-border: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 48%));
    --color-message-header-contents-border-bottom: light-dark(hsl(210deg 5% 0.0% / 5%), hsl(40deg 6% 0.0% / 50%));
    --color-private-message-header-border-bottom: light-dark(hsl(210deg 5% 0.0% / 7%), hsl(40deg 6% 0.0% / 37%));
    --color-message-header-icon-non-interactive: light-dark(hsl(210deg 5% 0.0% / 30%), hsl(40deg 22% 90.0% / 30%));
    --color-message-header-icon-interactive: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-background: light-dark(hsl(40deg 34% 93.4%), hsl(40deg 6% 11.0%));
    --color-background-widget-input: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 10.0%));
    --color-background-widget-button: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-navbar: light-dark(hsl(40deg 34% 95.2%), hsl(40deg 6% 13.0%));
    --color-text-sidebar-row: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 22% 90.0% / 85%));
    --color-text-active-narrow-filter: light-dark(hsl(210deg 5% 16.5%), hsl(40deg 22% 90.0%));
    --color-background-active-narrow-filter: light-dark(hsl(40deg 34% 97.0%), color-mix(in srgb, hsl(40deg 22% 90.0%) 8%, hsl(40deg 6% 11.0%)));
    --color-background-hover-narrow-filter: light-dark(hsl(40deg 34% 95.2%), color-mix(in srgb, hsl(40deg 22% 90.0%) 8%, hsl(40deg 6% 11.0%)));
    --color-shadow-sidebar-row-hover: light-dark(hsl(210deg 5% 0.0% / 30%), hsl(40deg 22% 90.0% / 30%));
    --color-sidebar-action: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-sidebar-action-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 90.0%));
    --color-background-sidebar-action-hover: light-dark(hsl(95deg 22% 93.0%), hsl(138deg 25% 35.0%));
    --color-background-navigation-item-hover: light-dark(hsl(140deg 48% 30.0% / 7%), hsl(138deg 38% 75.0% / 20%));
    --color-navbar-bottom-border: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-left-sidebar-direct-messages-bottom-divider: light-dark(hsl(210deg 5% 0.0% / 15%), hsl(40deg 22% 90.0% / 15%));
    --color-left-sidebar-inner-box-shadow: light-dark(hsl(210deg 5% 0.0% / 20%), hsl(40deg 6% 0.0% / 80%));
    --color-left-sidebar-outer-box-shadow: light-dark(hsl(40deg 34% 93.4% / 20%), hsl(40deg 6% 11.0% / 30%));
    --color-left-sidebar-middle-box-shadow-hover: light-dark(hsl(95deg 22% 91.0%), hsl(140deg 19% 24.0%));
    --color-left-sidebar-outer-box-shadow-hover: light-dark(hsl(140deg 48% 30.0% / 7%), hsl(138deg 38% 75.0% / 20%));
    --color-unread-marker: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 62.0%));
    --color-masked-unread-marker: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 30.0%));
    --color-failed-message-send-icon: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 66.3%));
    --color-active-row-modal: light-dark(hsl(40deg 34% 95.8%), hsl(40deg 6% 0.0% / 20%));
    --color-background-overlay: light-dark(hsl(210deg 5% 14.3% / 80%), hsl(140deg 20% 8.0% / 75%));
    --color-background-non-empty-overlay-indicator: light-dark(hsl(40deg 34% 97.0% / 90%), hsl(140deg 20% 8.0% / 75%));
    --color-modal-selectable-icon: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-modal-selectable-icon-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 90.0%));
    --background-color-modal-selectable-icon-hover: light-dark(hsl(140deg 48% 30.0% / 7%), hsl(138deg 38% 75.0% / 20%));
    --background-color-readonly-modal-input: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 17.0%));
    --background-color-textarea: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --background-color-disabled-textarea: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 20%));
    --background-color-view-only-textarea: light-dark(hsl(40deg 34% 97.0% / 60%), hsl(40deg 6% 0.0% / 30%));
    --border-color-textarea: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --focus-border-color-textarea: light-dark(hsl(140deg 25% 62.0% / 80%), hsl(40deg 6% 0.0% / 90%));
    --color-background-pill-container-without-placeholder: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-unmuted-or-followed-topic-list-item: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-topic-indent-border: light-dark(hsl(210deg 5% 0.0% / 19%), hsl(40deg 22% 90.0% / 19%));
    --color-outline-focus: light-dark(hsl(140deg 47% 30.0%), hsl(138deg 38% 62.0%));
    --color-background-search: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 17.0%));
    --color-background-search-collapsed: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 20.0%));
    --color-background-search-option-hover: light-dark(hsl(40deg 34% 93.4%), hsl(40deg 6% 20.0%));
    --color-search-box-hover-shadow: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 30%));
    --color-search-shadow-wide: light-dark(hsl(210deg 5% 0.0% / 25%), hsl(40deg 6% 0.0% / 25%));
    --color-search-shadow-tight: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 10%));
    --color-search-dropdown-top-border: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 35%));
    --color-search-icons: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 78.0%));
    --color-background-image-loader: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 22% 90.0% / 10%));
    --color-icon-purple: light-dark(hsl(140deg 25% 60.0%), hsl(138deg 35% 62.0%));
    --color-background-popover-menu: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 17.0%));
    --color-border-popover-menu-separator: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 40%));
    --color-hotkey-hint: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 84.0%));
    --color-popover-hotkey-hint: light-dark(hsl(210deg 5% 44.0%), hsl(40deg 22% 65.0%));
    --color-border-popover-hotkey-hint: light-dark(hsl(210deg 5% 44.0% / 50%), hsl(40deg 22% 65.0% / 50%));
    --color-background-hover-popover-menu: light-dark(hsl(210deg 5% 5.5% / 5%), hsl(40deg 22% 90.0% / 5%));
    --color-background-active-popover-menu: light-dark(hsl(210deg 5% 5.5% / 7%), hsl(40deg 22% 90.0% / 7%));
    --color-border-popover-menu: light-dark(hsl(210deg 5% 0.0% / 40%), hsl(40deg 6% 0.0%));
    --color-border-personal-menu-avatar: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 22% 90.0% / 20%));
    --color-background-unread-counter-prominent: light-dark(hsl(40deg 12% 50.0% / 70%), hsl(138deg 18% 34.4%));
    --color-background-unread-counter-normal: light-dark(hsl(40deg 12% 50.0% / 20%), hsl(40deg 22% 50.0% / 35%));
    --box-shadow-unread-counter-normal: inset 0 0 1px hsl(210deg 5% 0.0% / 30%);
    --color-unread-counter-prominent: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 22% 90.0%));
    --color-unread-counter-normal: light-dark(hsl(210deg 5% 0.0% / 90%), hsl(40deg 22% 90.0% / 85%));
    --color-unread-counter-quiet: light-dark(hsl(140deg 15% 30.0%), hsl(138deg 15% 65.0%));
    --color-unread-counter-muted: light-dark(hsl(40deg 12% 50.0% / 35%), hsl(40deg 22% 62.0% / 35%));
    --color-border-add-subscription-button-focus: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 22% 67.0%));
    --color-background-unread-counter-no-alpha: light-dark(color-mix(in srgb, hsl(40deg 12% 50.0%) 20%, hsl(40deg 34% 93.4%)), color-mix(in srgb, hsl(40deg 22% 50.0%) 35%, hsl(40deg 6% 11.0%)));
    --color-background-unread-counter-dot: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-border-unread-counter: light-dark(var(--color-background-unread-counter), hsl(40deg 22% 50.0%));
    --color-background-tab-picker-container: light-dark(hsl(210deg 5% 0.0% / 7%), hsl(40deg 6% 0.0% / 30%));
    --color-background-tab-picker-selected-tab: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 22% 90.0% / 7%));
    --color-outline-tab-picker-tab-option: light-dark(hsl(210deg 5% 0.0% / 30%), hsl(40deg 22% 90.0% / 12%));
    --color-background-tab-picker-tab-option-hover: light-dark(hsl(40deg 34% 97.0% / 60%), hsl(40deg 22% 90.0% / 5%));
    --color-background-tab-picker-tab-option-active: light-dark(hsl(40deg 34% 97.0% / 35%), hsl(40deg 22% 90.0% / 3%));
    --color-background-popover: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 17.0%));
    --color-background-alert-word: light-dark(hsl(18deg 70% 84.0%), hsl(22deg 70% 35.0%));
    --color-buddy-list-avatar-loading: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 22% 90.0% / 10%));
    --color-border-sidebar: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 20%));
    --color-text-sidebar-base: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-border-sidebar-subheader: light-dark(hsl(210deg 5% 0.0% / 15%), hsl(40deg 22% 90.0% / 15%));
    --color-request-progress-status-alert-text: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-background-tip: light-dark(hsl(46deg 63% 95.0%), hsl(46deg 28% 38.0% / 27%));
    --color-border-tip: light-dark(hsl(49deg 20% 84.0%), hsl(49deg 38% 46.0%));
    --color-box-shadow-animated-purple-button-focus: light-dark(hsl(140deg 18% 18.0%), hsl(40deg 22% 90.0% / 66.6%));
    --color-background-animated-button: light-dark(hsl(40deg 34% 91.0%), hsl(140deg 20% 14.0%));
    --color-animated-button-text: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-background-animated-button-hover: light-dark(hsl(140deg 25% 68.0%), hsl(138deg 38% 68.0%));
    --color-invalid-input-border: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 74.0%));
    --color-invalid-input-box-shadow: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 74.0%));
    --color-background-white-box: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-stream-group-row-checked-icon: light-dark(hsl(140deg 25% 68.0%), hsl(138deg 38% 68.0%));
    --color-stream-group-row-checked-icon-hover: light-dark(hsl(140deg 41% 30.0%), hsl(138deg 38% 62.0%));
    --color-stream-group-row-checked-icon-disabled: light-dark(hsl(140deg 25% 68.0% / 100%), hsl(138deg 38% 68.0% / 50%));
    --color-stream-group-row-plus-icon: light-dark(hsl(40deg 12% 72.0%), hsl(40deg 6% 33.0%));
    --color-stream-group-row-plus-icon-hover: light-dark(hsl(210deg 5% 29.7%), hsl(40deg 22% 67.0%));
    --color-stream-group-row-plus-icon-disabled: light-dark(hsl(40deg 34% 89.2% / 100%), hsl(40deg 6% 33.0% / 50%));
    --color-recent-view-link-unread: light-dark(hsl(210deg 5% 5.5%), hsl(40deg 22% 90.0% / 83%));
    --color-recent-view-link: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 22% 90.0% / 75%));
    --color-background-recent-filters-button-focus: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 50%));
    --color-background-recent-filters-button-disabled: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 50%));
    --color-border-recent-filters-button-disabled: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0%));
    --color-recent-view-participant-overflow-text: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-background-recent-view-participant-overflow: light-dark(hsl(40deg 34% 89.8%), hsl(140deg 18% 25.0%));
    --color-background-recent-view-table-thead-th: light-dark(hsl(40deg 34% 95.2%), hsl(40deg 6% 17.0%));
    --color-background-recent-view-table-thead-sort-header: light-dark(hsl(210deg 5% 39.6% / 7%), hsl(40deg 22% 60.0% / 14%));
    --color-arrow-recent-view-table-thead-th: light-dark(hsl(210deg 5% 39.6% / 50%), hsl(40deg 22% 70.0% / 50%));
    --color-text-recent-view-last-msg-time: light-dark(hsl(210deg 5% 16.5% / 75%), hsl(40deg 22% 90.0% / 50%));
    --color-text-recent-view-last-msg-time-unread: light-dark(hsl(210deg 5% 0.0% / 75%), hsl(40deg 22% 90.0% / 58%));
    --color-compose-box-background: light-dark(hsl(95deg 22% 92.0%), hsl(40deg 6% 17.0%));
    --color-compose-message-content-background: light-dark(hsl(40deg 34% 97.0%), color-mix(
            in srgb,
            var(--color-compose-box-background),
            hsl(40deg 6% 0.0%) 20%
        ));
    --color-compose-message-content-background-over-limit: light-dark(hsl(10deg 35% 90.0%), hsl(8deg 50% 12.0%));
    --color-compose-message-content-background-approaching-limit: light-dark(hsl(50deg 70% 92.0%), hsl(50deg 70% 12.0%));
    --color-border-compose-content: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 40%));
    --color-compose-send-button-icon-color: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 22% 90.0%));
    --color-compose-send-button-background: light-dark(hsl(140deg 25% 68.0%), hsl(138deg 38% 68.0%));
    --color-compose-send-button-background-interactive: light-dark(hsl(140deg 41% 30.0%), hsl(138deg 38% 62.0%));
    --color-compose-send-button-focus-border: light-dark(hsl(140deg 20% 18.0%), hsl(140deg 20% 62.0%));
    --color-compose-send-button-focus-shadow: light-dark(hsl(140deg 48% 18.0%), hsl(40deg 22% 90.0% / 80%));
    --color-compose-send-control-button: light-dark(hsl(140deg 30% 30.0% / 95%), hsl(138deg 30% 70.0%));
    --color-compose-send-control-button-interactive: light-dark(hsl(140deg 30% 30.0%), var(--color-compose-send-control-button));
    --color-compose-send-control-button-background-interactive: light-dark(hsl(140deg 48% 18.0% / 5%), hsl(138deg 38% 70.0% / 11%));
    --color-compose-recipient-box-background-color: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-compose-recipient-box-border-color: light-dark(color-mix(in srgb, hsl(210deg 5% 0.0%) 10%, hsl(95deg 22% 92.0%)), hsl(40deg 6% 0.0% / 80%));
    --color-compose-recipient-box-hover: light-dark(hsl(40deg 12% 69.0%), hsl(40deg 22% 90.0% / 12%));
    --color-compose-recipient-box-has-focus: light-dark(hsl(40deg 12% 57.0%), hsl(40deg 22% 90.0% / 27%));
    --color-compose-collapsed-reply-button-area-background: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-compose-collapsed-reply-button-area-background-interactive: light-dark(var(--color-compose-collapsed-reply-button-area-background), hsl(40deg 6% 0.0% / 15%));
    --color-compose-collapsed-reply-button-area-border: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-compose-collapsed-reply-button-area-border-interactive: light-dark(hsl(40deg 12% 60.0%), var(--color-compose-collapsed-reply-button-area-border));
    --color-compose-embedded-button-text-color: light-dark(hsl(140deg 20% 27.6%), hsl(138deg 30% 65.0%));
    --color-compose-embedded-button-text-color-hover: light-dark(hsl(140deg 20% 18.0%), hsl(138deg 30% 70.0%));
    --color-compose-embedded-button-background-hover: light-dark(hsl(95deg 22% 90.0% / 50%), hsl(138deg 38% 70.0% / 11%));
    --color-compose-embedded-button-background-interactive: light-dark(hsl(95deg 22% 90.0% / 90%), hsl(138deg 38% 70.0% / 20%));
    --color-background-compose-new-message-button: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-compose-new-message-button-hover: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 15%));
    --color-background-compose-new-message-button-active: light-dark(hsl(40deg 34% 94.0%), hsl(40deg 6% 0.0% / 20%));
    --color-border-compose-new-message-button: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-border-compose-new-message-button-hover: light-dark(hsl(40deg 12% 60.0%), hsl(40deg 6% 0.0% / 60%));
    --color-border-compose-new-message-button-active: light-dark(hsl(40deg 12% 60.0%), hsl(40deg 6% 0.0% / 60%));
    --color-compose-chevron-arrow: light-dark(hsl(40deg 12% 58.0%), hsl(40deg 22% 62.0%));
    --color-limit-indicator: light-dark(hsl(38deg 70% 36.0%), hsl(38deg 70% 70.0%));
    --color-limit-indicator-over-limit: light-dark(hsl(8deg 55% 32.0%), hsl(8deg 50% 60.0%));
    --color-narrow-to-compose-recipients-background: light-dark(hsl(140deg 25% 70.0% / 25%), hsl(138deg 38% 60.0% / 25%));
    --color-narrow-to-compose-recipients-background-hover: light-dark(hsl(140deg 25% 70.0% / 35%), hsl(138deg 38% 60.0% / 35%));
    --color-narrow-to-compose-recipients: light-dark(hsl(140deg 25% 64.0%), hsl(138deg 28% 81.0%));
    --color-narrow-to-compose-recipients-hover: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 95.0%));
    --color-composebox-button: light-dark(hsl(8deg 55% 30.0% / 55%), hsl(8deg 50% 100.0% / 55%));
    --color-composebox-button-background: light-dark(hsl(10deg 40% 100.0% / 60%), hsl(40deg 6% 13.5% / 80%));
    --color-composebox-button-background-hover: light-dark(hsl(40deg 34% 94.0%), hsl(40deg 6% 18.0%));
    --color-message-formatting-controls-container: light-dark(hsl(95deg 22% 96.0%), hsl(40deg 6% 0.0% / 8%));
    --color-message-content-container-border: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 6% 0.0% / 80%));
    --color-message-content-container-border-focus: light-dark(hsl(40deg 12% 57.0%), hsl(40deg 22% 90.0% / 27%));
    --color-message-content-container-border-over-limit: light-dark(hsl(8deg 55% 45.0%), hsl(8deg 50% 65.0%));
    --color-message-content-container-border-approaching-limit: light-dark(hsl(38deg 70% 50.0%), hsl(38deg 70% 62.0%));
    --color-compose-control-button-background-hover: light-dark(hsl(210deg 5% 0.0% / 5%), hsl(40deg 22% 90.0% / 5%));
    --color-compose-formatting-button-divider: light-dark(hsl(40deg 12% 75.0%), hsl(138deg 33% 90.0% / 25%));
    --color-compose-focus-ring: light-dark(var(--color-outline-focus), hsl(40deg 22% 67.0%));
    --color-compose-scroll-icon: light-dark(hsl(40deg 12% 50.0%), hsl(40deg 22% 62.0%));
    --gradient-compose-scroll-backward: linear-gradient(
        90deg,
        light-dark(hsl(95deg 22% 95.0%), hsl(140deg 21% 18.0%)) 35%,
        light-dark(hsl(95deg 22% 95.0%), hsl(140deg 21% 18.0% / 76.9%)) 50%,
        transparent 100%
    );
    --gradient-compose-scroll-backward-hover: linear-gradient(
        90deg,
        light-dark(hsl(95deg 22% 93.0%), hsl(140deg 30% 18.0%)) 35%,
        light-dark(hsl(95deg 22% 93.0%), hsl(140deg 30% 18.0% / 76.9%)) 50%,
        transparent 100%
    );
    --gradient-compose-scroll-backward-active: linear-gradient(
        90deg,
        light-dark(hsl(95deg 22% 90.0%), hsl(140deg 35% 18.0%)) 45%,
        transparent 100%
    );
    --gradient-compose-scroll-forward: linear-gradient(
        90deg,
        transparent 0%,
        light-dark(hsl(95deg 22% 95.0%), hsl(140deg 21% 18.0% / 76.9%)) 50%,
        light-dark(hsl(95deg 22% 95.0%), hsl(140deg 21% 18.0%)) 65%
    );
    --gradient-compose-scroll-forward-hover: linear-gradient(
        90deg,
        transparent 0%,
        light-dark(hsl(95deg 22% 93.0%), hsl(140deg 30% 18.0% / 76.9%)) 50%,
        light-dark(hsl(95deg 22% 93.0%), hsl(140deg 30% 18.0%)) 65%
    );
    --gradient-compose-scroll-forward-active: linear-gradient(
        90deg,
        transparent 0%,
        light-dark(hsl(95deg 22% 90.0%), hsl(140deg 35% 18.0%)) 55%
    );
    --color-text-default: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 22% 87.0%));
    --color-text-message-default: light-dark(hsl(210deg 5% 16.5%), var(--color-text-default));
    --color-text-message-blockquote-border: light-dark(hsl(210deg 5% 16.5% / 25%), hsl(40deg 22% 87.0% / 40%));
    --color-text-message-header-archived: light-dark(hsl(40deg 12% 50.0%), hsl(40deg 22% 62.0%));
    --color-text-message-view-header: light-dark(hsl(210deg 5% 22.0% / 100%), hsl(40deg 22% 90.0% / 85%));
    --color-text-message-header: light-dark(hsl(210deg 5% 16.5%), hsl(40deg 22% 90.0% / 85%));
    --color-text-sender-name-hover: light-dark(hsl(140deg 48% 24.0%), hsl(138deg 38% 62.0%));
    --color-text-dropdown-input: light-dark(hsl(210deg 5% 14.7%), hsl(40deg 22% 90.0%));
    --color-text-self-direct-mention: light-dark(hsl(140deg 48% 27.0% / 100%), hsl(138deg 38% 88.0% / 100%));
    --color-text-self-group-mention: light-dark(hsl(140deg 48% 18.0% / 100%), hsl(138deg 38% 63.0% / 100%));
    --color-text-show-more-less-button: light-dark(hsl(140deg 48% 31.8%), hsl(138deg 30% 65.0%));
    --color-text-search: light-dark(hsl(210deg 5% 38.5%), hsl(40deg 22% 90.0% / 75%));
    --color-text-search-hover: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-text-placeholder: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 22% 55.0%));
    --color-text-search-placeholder: light-dark(hsl(40deg 12% 50.0%), hsl(40deg 22% 90.0% / 50%));
    --color-text-popover-menu: light-dark(hsl(210deg 5% 16.5%), hsl(40deg 22% 90.0% / 80%));
    --color-text-full-name: light-dark(hsl(210deg 5% 16.5%), hsl(40deg 22% 90.0%));
    --color-text-item: light-dark(hsl(210deg 5% 44.0%), hsl(40deg 22% 50.0%));
    --color-text-personal-menu-no-status: light-dark(hsl(40deg 12% 50.0%), hsl(0deg 0% 100% 35%));
    --color-text-personal-menu-some-status: light-dark(hsl(210deg 5% 44.0%), hsl(0deg 0% 100% 50%));
    --color-text-sidebar-heading: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 75.0%));
    --color-text-sidebar-action-heading: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-text-sidebar-action-heading-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 90.0%));
    --color-text-sidebar-popover-menu: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-text-url: light-dark(hsl(140deg 48% 24.0%), hsl(138deg 38% 62.0%));
    --color-text-url-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 66.0%));
    --color-text-settings-field-hint: light-dark(hsl(40deg 12% 57.0%), hsl(40deg 22% 52.0%));
    --color-text-clear-search-button: light-dark(hsl(40deg 12% 80.0%), hsl(138deg 33% 80.0%));
    --color-text-clear-search-button-hover: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-text-settings-plus-button: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-background-settings-plus-button: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-border-settings-plus-button: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-user-profile-field-name: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-border-user-profile-table: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 40%));
    --color-border-manage-profile-footer: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 22% 90.0% / 20%));
    --color-border-user-profile-list-container: light-dark(hsl(210deg 5% 0.0% / 35%), hsl(40deg 22% 90.0% / 30%));
    --background-color-user-profile-list-container: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 17.0%));
    --color-text-link: light-dark(hsl(140deg 48% 25.2%), hsl(138deg 38% 50.0%));
    --color-text-link-decoration: light-dark(color-mix(in oklch, hsl(140deg 48% 25.2%) 20%, transparent), color-mix(in oklch, hsl(138deg 38% 50.0%) 20%, transparent));
    --color-text-link-hover: light-dark(hsl(140deg 48% 30.0%), hsl(138deg 38% 60.0%));
    --color-text-link-decoration-hover: light-dark(color-mix(in oklch, hsl(140deg 48% 30.0%) 70%, transparent), color-mix(in oklch, hsl(138deg 38% 60.0%) 70%, transparent));
    --color-text-link-active: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 50.0%));
    --color-text-generic-link: light-dark(hsl(140deg 48% 24.0%), hsl(138deg 38% 62.0%));
    --color-text-generic-link-interactive: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 66.0%));
    --color-background-tippy-box: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 6% 0.0%));
    --color-background-dropdown-widget: light-dark(hsl(95deg 22% 98.0%), hsl(40deg 6% 16.0%));
    --color-border-dropdown-widget: light-dark(hsl(210deg 5% 0.0% / 40%), hsl(40deg 6% 0.0%));
    --color-border-dropdown-widget-button: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-background-dropdown-widget-button: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-disabled-dropdown-widget-button: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 20%));
    --color-poll-vote: light-dark(hsl(140deg 35% 40.0%), hsl(138deg 35% 65.0%));
    --color-poll-vote-hover: light-dark(hsl(140deg 35% 40.0%), hsl(138deg 38% 70.0%));
    --color-poll-vote-focus: light-dark(hsl(140deg 35% 40.0%), hsl(138deg 38% 65.0%));
    --color-border-poll-vote: light-dark(hsl(140deg 28% 70.0%), hsl(138deg 35% 35.0%));
    --color-border-poll-vote-hover: light-dark(hsl(140deg 30% 50.0%), hsl(138deg 38% 40.0%));
    --color-border-poll-vote-focus: light-dark(hsl(140deg 30% 50.0%), hsl(138deg 38% 50.0%));
    --color-background-poll-vote-hover: light-dark(var(--color-background-widget-button), hsl(140deg 20% 20.0%));
    --color-background-poll-vote-focus: light-dark(hsl(140deg 35% 90.0%), hsl(138deg 38% 35.0%));
    --color-poll-names: light-dark(hsl(210deg 5% 45.0%), hsl(138deg 15% 70.0%));
    --color-border-todo-checkbox: light-dark(hsl(140deg 28% 70.0%), color-mix(in oklch, hsl(138deg 38% 45.0%) 70%, transparent));
    --color-border-todo-checkbox-hover: light-dark(hsl(140deg 30% 50.0%), hsl(138deg 38% 35.0%));
    --color-border-todo-checkbox-checked: light-dark(hsl(140deg 35% 40.0%), hsl(138deg 38% 45.0%));
    --color-background-todo-checkbox-hover: light-dark(transparent, hsl(140deg 20% 20.0%));
    --color-background-todo-checkbox-checked: light-dark(hsl(140deg 35% 40.0%), hsl(138deg 38% 45.0%));
    --color-kbd-background: light-dark(hsl(40deg 34% 95.8%), hsl(140deg 20% 14.0%));
    --color-kbd-border: light-dark(hsl(40deg 12% 80.0%), hsl(140deg 20% 14.0%));
    --color-kbd-text: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-kbd-enter-sends: light-dark(hsl(210deg 5% 44.0%), hsl(138deg 33% 90.0%));
    --color-realm-enable-spectator-access-link: light-dark(hsl(210deg 5% 22.0%), hsl(138deg 33% 90.0%));
    --color-background-stream-email: light-dark(hsl(40deg 34% 95.8%), hsl(40deg 6% 0.0% / 20%));
    --color-background-integration-url: light-dark(transparent, hsl(40deg 6% 0.0% / 20%));
    --color-background-tbody-th-odd: light-dark(transparent, hsl(40deg 6% 0.0% / 20%));
    --color-background-rendered-markdown-thead: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 50%));
    --color-border-rendered-markdown-table: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 33.0%));
    --color-background-tab-switcher-ind-tab: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-tab-switcher-ind-tab-selected: light-dark(hsl(40deg 12% 53.0%), hsl(40deg 6% 0.0% / 50%));
    --color-border-tab-switcher-ind-tab: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-border-tab-switcher-ind-tab-selected: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 6% 0.0% / 90%));
    --color-text-tab-switcher-ind-tab-disabled: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 42.0% / 90%));
    --color-border-tab-switcher-ind-tab-disabled: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 60%));
    --color-background-table-header: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0%));
    --color-background-table-header-sortable-hover: light-dark(hsl(40deg 34% 94.0%), hsl(140deg 20% 14.0%));
    --color-border-table-striped: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 20%));
    --color-border-table-bordered: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 20%));
    --color-border-table-subscriber-list: light-dark(hsl(40deg 34% 89.2%), hsl(40deg 6% 0.0% / 20%));
    --color-markdown-code-text: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0% / 85%));
    --color-markdown-code-background: light-dark(hsl(210deg 5% 0.0% / 6%), hsl(40deg 22% 90.0% / 8%));
    --color-markdown-code-background-mentions: light-dark(hsl(210deg 5% 0.0% / 7%), var(--color-markdown-code-background));
    --color-markdown-pre-background: light-dark(hsl(210deg 5% 0.0% / 4%), hsl(40deg 22% 90.0% / 4%));
    --color-markdown-pre-background-mentions: light-dark(hsl(210deg 5% 0.0% / 4%), hsl(40deg 22% 90.0% / 5%));
    --color-markdown-link: light-dark(hsl(140deg 48% 24.0%), var(--color-text-generic-link));
    --color-markdown-link-hover: light-dark(hsl(140deg 48% 18.0%), var(--color-text-generic-link-interactive));
    --color-background-image-thumbnail: light-dark(hsl(210deg 5% 0.0% / 3%), hsl(40deg 22% 90.0% / 3%));
    --color-background-image-thumbnail-hover: light-dark(hsl(210deg 5% 0.0% / 30%), hsl(40deg 22% 90.0% / 35%));
    --color-icon-bot: light-dark(hsl(40deg 12% 65.0% / 100%), hsl(40deg 22% 50.0% / 100%));
    --color-message-action-visible: light-dark(hsl(140deg 43% 18.0% / 50%), hsl(138deg 38% 90.0% / 50%));
    --color-message-action-interactive: light-dark(hsl(140deg 43% 18.0% / 100%), hsl(138deg 38% 90.0% / 100%));
    --color-message-star-action: light-dark(hsl(41deg 70% 47.0% / 100%), hsl(41deg 70% 62.0% / 100%));
    --color-left-sidebar-follow-icon-hover: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-left-sidebar-navigation-icon: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-left-sidebar-dm-partners-icon: light-dark(hsl(140deg 25% 60.0%), hsl(138deg 35% 58.0%));
    --color-vdots-hint: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 35% 38.0%));
    --color-vdots-visible: light-dark(hsl(140deg 30% 24.0%), hsl(138deg 35% 68.0%));
    --color-vdots-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 90.0%));
    --color-tab-picker-icon: light-dark(hsl(140deg 48% 24.0%), hsl(40deg 22% 80.0%));
    --color-user-circle-active: light-dark(hsl(140deg 35% 45.1%), hsl(140deg 35% 58.0%));
    --color-user-circle-idle: light-dark(hsl(32deg 70% 68.0%), hsl(33deg 70% 36.1%));
    --color-user-circle-offline: light-dark(hsl(140deg 17% 77.5%), hsl(40deg 6% 36.1%));
    --color-user-circle-offline-typeahead-highlight: light-dark(hsl(140deg 17% 72.5%), hsl(40deg 6% 41.8%));
    --color-user-circle-deactivated: light-dark(hsl(40deg 12% 50.0%), hsl(40deg 22% 62.0%));
    --color-copy-button: light-dark(/* hsl(210deg 5% 39.6%) corresponds to --grey-600.
           We use the hsl() equivalent directly since postcss-color-mix-function
           cannot dynamically resolve var() arguments. */
            color-mix(in oklch, hsl(210deg 5% 39.6%) 70%, transparent), /* hsl(40deg 22% 70.0%) corresponds to --grey-400. */
            color-mix(in oklch, hsl(40deg 22% 70.0%) 70%, transparent));
    --color-copy-button-square-bg-hover: light-dark(/* --grey-600, opacity 0.07 */
            color-mix(in oklch, hsl(40deg 6% 36.0%) 7%, transparent),
        /* --grey-400, opacity 0.14 */
            color-mix(in oklch, hsl(40deg 22% 60.0%) 14%, transparent));
    --color-copy-button-active: light-dark(/* --grey-600, opacity 0.7 */
            color-mix(in oklch, hsl(40deg 6% 36.0%) 70%, transparent),
        /* --grey-300, opacity 0.7 */
            color-mix(in oklch, hsl(40deg 22% 70.0%) 70%, transparent));
    --color-copy-button-square-bg-active: light-dark(/* --grey-600, opacity 0.11 */
            color-mix(in oklch, hsl(40deg 6% 36.0%) 11%, transparent),
        /* --grey-400, opacity 0.18 */
            color-mix(in oklch, hsl(40deg 22% 60.0%) 18%, transparent));
    --color-message-reaction-border: light-dark(hsl(210deg 5% 0.0% / 10%), hsl(40deg 22% 90.0% / 15%));
    --color-message-reaction-border-reacted: light-dark(hsl(210deg 5% 0.0% / 45%), hsl(40deg 22% 90.0% / 70%));
    --color-message-reaction-background: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 30%));
    --color-message-reaction-background-reacted: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 80%));
    --color-message-reaction-background-hover: light-dark(hsl(95deg 22% 96.0%), hsl(40deg 22% 90.0% / 10%));
    --color-message-reaction-shadow-inner: light-dark(hsl(140deg 48% 30.0% / 8%), transparent /* No shadow in dark mode. */);
    --color-message-reaction-text: light-dark(hsl(140deg 20% 18.0% / 100%), hsl(40deg 22% 90.0% / 75%));
    --color-message-reaction-text-reacted: light-dark(hsl(140deg 20% 18.0% / 100%), hsl(40deg 22% 90.0% / 85%));
    --color-message-reaction-button-text: light-dark(hsl(140deg 20% 18.0% / 60%), var(--color-message-reaction-text));
    --color-zulip-logo: light-dark(hsl(210deg 5% 0.0% / 34%), hsl(40deg 22% 90.0% / 50%));
    --color-zulip-logo-loading: light-dark(hsl(210deg 5% 29.7%), hsl(40deg 22% 90.0%));
    --color-recent-view-loading-spinner: light-dark(hsl(210deg 5% 29.7%), hsl(40deg 22% 90.0% / 60%));
    --color-zulip-logo-z: light-dark(hsl(40deg 34% 97.0%), hsl(140deg 20% 18.0%));
    --color-show-more-less-button-background: light-dark(hsl(140deg 44% 32.0% / 8%), hsl(138deg 38% 56.0% / 15%));
    --color-show-more-less-button-background-hover: light-dark(hsl(140deg 44% 32.0% / 15%), hsl(138deg 38% 56.0% / 25%));
    --color-show-more-less-button-background-active: light-dark(hsl(140deg 44% 32.0% / 20%), hsl(138deg 38% 56.0% / 15%));
    --color-message-edit-history-text-inserted: light-dark(hsl(140deg 35% 30.0%), hsl(140deg 35% 81.0%));
    --color-message-edit-history-background-inserted: light-dark(hsl(140deg 35% 95.0%), hsl(140deg 35% 95.0% / 30%));
    --color-message-edit-history-text-deleted: light-dark(hsl(8deg 55% 40.0%), hsl(8deg 50% 67.0%));
    --color-message-edit-history-background-deleted: light-dark(hsl(10deg 40% 92.0%), hsl(8deg 50% 62.0% / 38%));
    --color-background-direct-mention: light-dark(hsl(95deg 22% 95.0%), hsl(40deg 6% 16.0%));
    --color-background-group-mention: light-dark(hsl(95deg 22% 94.0%), hsl(40deg 6% 14.0%));
    --color-background-text-direct-mention: light-dark(hsl(140deg 25% 70.0% / 20%), hsl(138deg 38% 60.0% / 25%));
    --color-background-text-hover-direct-mention: light-dark(hsl(140deg 25% 70.0% / 30%), hsl(138deg 38% 60.0% / 45%));
    --color-background-text-group-mention: light-dark(hsl(140deg 48% 27.0% / 18%), hsl(138deg 38% 40.0% / 20%));
    --color-background-text-hover-group-mention: light-dark(hsl(140deg 48% 27.0% / 30%), hsl(138deg 38% 40.0% / 30%));
    --color-background-input-pill: light-dark(hsl(95deg 22% 94.0%), hsl(138deg 38% 60.0% / 38%));
    --color-background-input-pill-search: light-dark(hsl(95deg 22% 94.0%), hsl(138deg 38% 60.0% / 30%));
    --color-background-input-pill-hover: light-dark(hsl(140deg 25% 70.0% / 30%), hsl(138deg 38% 60.0% / 45%));
    --color-border-input-pill-image: light-dark(hsl(95deg 22% 94.0% / 50%), hsl(138deg 38% 60.0% / 60%));
    --color-outline-low-attention-input-pill: light-dark(hsl(95deg 22% 88.0%), hsl(138deg 38% 60.0% / 22%));
    --color-focus-outline-input-pill: light-dark(hsl(140deg 48% 30.0%), hsl(40deg 22% 90.0% / 60%));
    --color-input-pill-close: light-dark(hsl(140deg 25% 65.0%), hsl(138deg 38% 74.0%));
    --color-background-input-pill-exit-hover: light-dark(hsl(140deg 25% 70.0% / 15%), hsl(40deg 22% 90.0% / 7%));
    --color-background-deactivated-user-pill: light-dark(hsl(10deg 40% 91.0%), hsl(8deg 50% 25.0%));
    --color-focus-outline-deactivated-user-pill: light-dark(hsl(8deg 55% 42.4%), hsl(40deg 22% 90.0% / 70%));
    --color-close-deactivated-user-pill: light-dark(hsl(8deg 55% 42.4%), hsl(8deg 50% 74.0%));
    --color-background-exit-hover-deactivated-user-pill: light-dark(hsl(8deg 55% 42.4% / 15%), hsl(40deg 22% 90.0% / 7%));
    --color-background-user-pill: light-dark(hsl(40deg 34% 97.0% / 85%), hsl(40deg 6% 0.0% / 40%));
    --color-background-pill-container: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-pill-container-input-disabled: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 20%));
    --color-border-pill-container: light-dark(hsl(210deg 5% 0.0% / 15%), hsl(40deg 6% 0.0% / 60%));
    --color-background-inbox-no-unreads-illustration: light-dark(hsl(140deg 35% 25.0%), hsl(140deg 35% 55.0%));
    --color-border-inbox-folder-component: light-dark(hsl(210deg 5% 0.0% / 13%), hsl(40deg 6% 0.0% / 13%));
    --color-icon-search-inbox: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-inbox-search-text: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-border-inbox-search: light-dark(hsl(140deg 22% 18.0% / 30%), hsl(40deg 22% 90.0% / 20%));
    --color-border-inbox-search-hover: light-dark(hsl(140deg 22% 18.0% / 60%), hsl(40deg 22% 90.0% / 40%));
    --color-background-inbox-search: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 10.0%));
    --color-background-inbox-search-hover: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 8.0%));
    --color-background-inbox-search-focus: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 7.0%));
    --color-border-inbox-search-focus: light-dark(hsl(140deg 22% 18.0% / 80%), hsl(40deg 22% 90.0% / 50%));
    --color-box-shadow-inbox-search-focus: light-dark(hsl(210deg 5% 22.0% / 30%), hsl(40deg 22% 90.0% / 40%));
    --color-background-inbox-row: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 14.0%));
    --color-background-inbox-row-hover: light-dark(color-mix(in srgb, hsl(210deg 5% 0.0%) 5%, hsl(40deg 34% 97.0%)), color-mix(in srgb, hsl(40deg 22% 90.0%) 5%, hsl(40deg 6% 14.0%)));
    --color-background-button-inbox-selected: light-dark(hsl(210deg 5% 0.0% / 5%), hsl(40deg 22% 90.0% / 5%));
    --color-background-button-inbox-focus: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 20.0%));
    --color-icons-inbox: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-folder-header: light-dark(hsl(140deg 43% 18.0%), hsl(138deg 38% 75.0%));
    --color-inbox-row-chevron: light-dark(hsl(210deg 5% 39.3%), hsl(40deg 22% 69.8%));
    --box-shadow-popover-menu: 0 2.78px 4.11px 0 hsl(210deg 5% 0.0% / 6%),
        0 5.5113px 8.5783px 0 hsl(210deg 5% 0.0% / 7%),
        0 8.438px 13.9271px 0 hsl(210deg 5% 0.0% / 8%),
        0 12.177px 21.4737px 0 hsl(210deg 5% 0.0% / 9%),
        0 18.7257px 35.4802px 0 hsl(210deg 5% 0.0% / 9%),
        0 41px 80px 0 hsl(210deg 5% 0.0% / 13%);
    --box-shadow-gear-menu: 0 2.7798px 4.1129px 0 hsl(210deg 5% 0.0% / 10%),
        0 5.5113px 8.5783px 0 hsl(210deg 5% 0.0% / 9%),
        0 8.4377px 13.9271px 0 hsl(210deg 5% 0.0% / 11%),
        0 12.177px 21.4737px 0 hsl(210deg 5% 0.0% / 11%),
        0 18.7257px 35.4802px 0 hsl(210deg 5% 0.0% / 15%),
        0 41px 80px 0 hsl(210deg 5% 0.0% / 20%);
    --color-navbar-icon: light-dark(hsl(140deg 20% 30.0%), hsl(138deg 35% 60.0%));
    --color-navbar-spectator-low-attention-brand-button-text: light-dark(hsl(140deg 40% 30.0%), hsl(138deg 38% 72.0% / 100%));
    --color-navbar-spectator-low-attention-brand-button-background-hover: light-dark(hsl(140deg 48% 18.0% / 5%), hsl(138deg 38% 70.0% / 10%));
    --color-navbar-spectator-low-attention-brand-button-background-active: light-dark(hsl(140deg 48% 18.0% / 8%), hsl(138deg 38% 70.0% / 13%));
    --color-navbar-spectator-medium-attention-brand-button-text: light-dark(hsl(140deg 40% 24.0% / 100%), hsl(138deg 38% 76.0% / 100%));
    --color-navbar-spectator-medium-attention-brand-button-background: light-dark(hsl(140deg 48% 28.2% / 10%), hsl(138deg 38% 70.0% / 12%));
    --color-navbar-spectator-medium-attention-brand-button-background-hover: light-dark(hsl(140deg 48% 28.2% / 15%), hsl(138deg 38% 70.0% / 17%));
    --color-navbar-spectator-medium-attention-brand-button-background-active: light-dark(hsl(140deg 48% 28.2% / 18%), hsl(138deg 38% 70.0% / 12%));
    --color-gear-menu-lighter-text: light-dark(hsl(210deg 5% 44.0%), hsl(40deg 22% 50.0%));
    --color-gear-menu-blue-text: light-dark(hsl(140deg 48% 30.0%), hsl(138deg 38% 65.0%));
    --color-header-button-hover: light-dark(hsl(210deg 5% 0.0% / 5%), hsl(40deg 22% 90.0% / 4%));
    --color-header-button-hover-no-alpha: light-dark(color-mix(in srgb, hsl(210deg 5% 0.0%) 5%, hsl(40deg 34% 95.2%)), color-mix(in srgb, hsl(40deg 22% 90.0%) 4%, hsl(40deg 6% 13.0%)));
    --color-header-button-focus: light-dark(hsl(210deg 5% 0.0% / 8%), hsl(40deg 22% 90.0% / 7%));
    --color-header-button-focus-no-alpha: light-dark(color-mix(in srgb, hsl(210deg 5% 0.0%) 8%, hsl(40deg 34% 95.2%)), color-mix(in srgb, hsl(40deg 22% 90.0%) 7%, hsl(40deg 6% 13.0%)));
    --color-fill-hover-copy-icon: light-dark(hsl(140deg 48% 24.0%), hsl(138deg 38% 62.0%));
    --color-fill-user-invite-copy-icon: light-dark(hsl(210deg 5% 45.0%), hsl(138deg 33% 90.0%));
    --color-background-zulip-button: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-background-zulip-button-hover: light-dark(var(--color-background-zulip-button), hsl(40deg 6% 0.0% / 15%));
    --color-background-zulip-button-active: light-dark(hsl(40deg 34% 94.0%), var(--color-background-zulip-button-hover));
    --color-background-zulip-button-disabled: light-dark(hsl(40deg 34% 92.8%), var(--color-background-zulip-button));
    --color-border-zulip-button: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-border-zulip-button-interactive: light-dark(hsl(40deg 12% 60.0%), var(--color-border-zulip-button));
    --color-border-rendered-checkbox: light-dark(hsl(210deg 5% 0.0% / 60%), hsl(40deg 22% 90.0% / 40%));
    --color-background-emoji-picker-popover: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 20%));
    --color-background-emoji-picker-popover-tab-item-active: light-dark(hsl(40deg 34% 97.0% / 20%), hsl(40deg 6% 0.0% / 50%));
    --color-background-emoji-picker-emoji-focus: light-dark(hsl(40deg 34% 92.8%), hsl(140deg 20% 8.0% / 75%));
    --color-box-shadow-emoji-picker-emoji-focus: light-dark(transparent, hsl(40deg 22% 90.0%));
    --color-background-emoji-picker-emoji-reacted: light-dark(hsl(95deg 22% 95.0%), hsl(40deg 6% 0.0% / 50%));
    --color-border-emoji-picker-emoji-reacted: light-dark(hsl(140deg 25% 79.0%), hsl(40deg 6% 0.0% / 90%));
    --color-background-emoji-picker-emoji-reacted-focus: light-dark(hsl(95deg 22% 88.0%), hsl(40deg 6% 20.0% / 70%));
    --color-border-emoji-picker-tippy-arrow: light-dark(hsl(40deg 34% 92.8%), hsl(140deg 20% 11.2%));
    --color-dropdown-item: light-dark(hsl(210deg 5% 22.0%), hsl(40deg 22% 75.0%));
    --color-active-dropdown-item: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --background-color-active-dropdown-item: light-dark(hsl(210deg 5% 5.4% / 5%), hsl(40deg 22% 90.0% / 7%));
    --background-color-active-typeahead-item: light-dark(hsl(210deg 5% 5.4% / 5%), hsl(40deg 22% 90.0% / 7%));
    --color-outline-button-focus: light-dark(hsl(210deg 5% 0.0%), hsl(40deg 22% 90.0%));
    --color-inner-shadow-action-button: light-dark(color-mix(in oklch, hsl(210deg 5% 0.0%) 20%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 21%, transparent));
    --color-text-neutral-solid-action-button: light-dark(hsl(40deg 34% 97.0%), color-mix(in oklch, hsl(40deg 22% 90.0%) 85%, transparent));
    --color-background-neutral-solid-action-button: light-dark(hsl(40deg 12% 50.0%), hsl(40deg 6% 36.0%));
    --color-background-neutral-solid-action-button-hover: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 6% 42.0%));
    --color-background-neutral-solid-action-button-active: light-dark(hsl(210deg 5% 45.0%), hsl(40deg 6% 36.0%));
    --color-text-neutral-subtle-action-button: light-dark(hsl(210deg 5% 27.5%), hsl(40deg 22% 76.0%));
    --color-background-neutral-subtle-action-button: light-dark(color-mix(in oklch, hsl(40deg 12% 50.0%) 12%, transparent), color-mix(in oklch, hsl(40deg 22% 76.0%) 12%, transparent));
    --color-background-neutral-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(40deg 12% 50.0%) 17%, transparent), color-mix(in oklch, hsl(40deg 22% 76.0%) 17%, transparent));
    --color-background-neutral-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(40deg 12% 50.0%) 22%, transparent), color-mix(in oklch, hsl(40deg 22% 76.0%) 12%, transparent));
    --color-text-neutral-text-action-button: light-dark(hsl(210deg 5% 39.6%), hsl(40deg 22% 70.0%));
    --color-background-neutral-text-action-button-hover: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 7%, transparent), color-mix(in oklch, hsl(40deg 22% 60.0%) 14%, transparent));
    --color-background-neutral-text-action-button-active: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 11%, transparent), color-mix(in oklch, hsl(40deg 22% 60.0%) 18%, transparent));
    --color-text-brand-solid-action-button: light-dark(hsl(40deg 34% 97.0%), color-mix(in oklch, hsl(40deg 22% 90.0%) 85%, transparent));
    --color-background-brand-solid-action-button: light-dark(hsl(140deg 25% 68.0%), hsl(138deg 38% 43.0%));
    --color-background-brand-solid-action-button-hover: light-dark(hsl(140deg 25% 61.0%), hsl(138deg 38% 51.0%));
    --color-background-brand-solid-action-button-active: light-dark(hsl(140deg 48% 30.6%), hsl(138deg 38% 43.0%));
    --color-text-brand-subtle-action-button: light-dark(hsl(140deg 48% 20.4%), hsl(138deg 38% 82.0%));
    --color-background-brand-subtle-action-button: light-dark(color-mix(in oklch, hsl(140deg 25% 68.0%) 12%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 12%, transparent));
    --color-background-brand-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 25% 68.0%) 17%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 17%, transparent));
    --color-background-brand-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 25% 68.0%) 22%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 12%, transparent));
    --color-text-brand-text-action-button: light-dark(hsl(140deg 48% 30.0%), hsl(138deg 38% 79.0%));
    --color-background-brand-text-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 5%, transparent), color-mix(in oklch, hsl(138deg 38% 72.0%) 14%, transparent));
    --color-background-brand-text-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 10%, transparent), color-mix(in oklch, hsl(138deg 38% 72.0%) 18%, transparent));
    --color-text-info-solid-action-button: light-dark(hsl(40deg 34% 97.0%), color-mix(in oklch, hsl(40deg 22% 90.0%) 85%, transparent));
    --color-background-info-solid-action-button: light-dark(hsl(140deg 25% 62.0%), hsl(138deg 38% 47.0%));
    --color-background-info-solid-action-button-hover: light-dark(hsl(140deg 48% 32.0%), hsl(138deg 38% 62.0%));
    --color-background-info-solid-action-button-active: light-dark(hsl(140deg 48% 28.2%), hsl(138deg 38% 62.0%));
    --color-text-info-subtle-action-button: light-dark(hsl(140deg 48% 21.6%), hsl(138deg 38% 79.0%));
    --color-background-info-subtle-action-button: light-dark(color-mix(in oklch, hsl(140deg 25% 62.0%) 12%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 12%, transparent));
    --color-background-info-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 25% 62.0%) 17%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 17%, transparent));
    --color-background-info-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 25% 62.0%) 22%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 12%, transparent));
    --color-text-info-text-action-button: light-dark(hsl(140deg 48% 27.6%), hsl(138deg 38% 75.0%));
    --color-background-info-text-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 5%, transparent), color-mix(in oklch, hsl(138deg 38% 65.0%) 12%, transparent));
    --color-background-info-text-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 9%, transparent), color-mix(in oklch, hsl(138deg 38% 65.0%) 17%, transparent));
    --color-text-success-solid-action-button: light-dark(hsl(40deg 34% 97.0%), color-mix(in oklch, hsl(40deg 22% 90.0%) 85%, transparent));
    --color-background-success-solid-action-button: light-dark(hsl(140deg 35% 27.0%), hsl(140deg 35% 22.0%));
    --color-background-success-solid-action-button-hover: light-dark(hsl(140deg 35% 25.0%), hsl(140deg 35% 62.0%));
    --color-background-success-solid-action-button-active: light-dark(hsl(140deg 35% 22.0%), hsl(140deg 35% 62.0%));
    --color-text-success-subtle-action-button: light-dark(hsl(140deg 35% 16.0%), hsl(140deg 35% 63.0%));
    --color-background-success-subtle-action-button: light-dark(color-mix(in oklch, hsl(140deg 35% 27.0%) 13%, transparent), color-mix(in oklch, hsl(140deg 35% 47.0%) 12%, transparent));
    --color-background-success-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 35% 27.0%) 18%, transparent), color-mix(in oklch, hsl(140deg 35% 47.0%) 17%, transparent));
    --color-background-success-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 35% 27.0%) 23%, transparent), color-mix(in oklch, hsl(140deg 35% 47.0%) 12%, transparent));
    --color-text-success-text-action-button: light-dark(hsl(140deg 35% 27.0%), hsl(140deg 35% 55.0%));
    --color-background-success-text-action-button-hover: light-dark(color-mix(in oklch, hsl(140deg 35% 22.0%) 8%, transparent), color-mix(in oklch, hsl(140deg 35% 40.0%) 12%, transparent));
    --color-background-success-text-action-button-active: light-dark(color-mix(in oklch, hsl(140deg 35% 22.0%) 12%, transparent), color-mix(in oklch, hsl(140deg 35% 40.0%) 17%, transparent));
    --color-text-warning-solid-action-button: light-dark(color-mix(in oklch, hsl(210deg 5% 0.0%) 88%, transparent), color-mix(in oklch, hsl(40deg 6% 0.0%) 90%, transparent));
    --color-background-warning-solid-action-button: light-dark(hsl(40deg 70% 62.0%), hsl(39deg 70% 45.0%));
    --color-background-warning-solid-action-button-hover: light-dark(hsl(40deg 70% 56.0%), hsl(41deg 70% 46.0%));
    --color-background-warning-solid-action-button-active: light-dark(hsl(41deg 70% 46.0%), hsl(39deg 70% 45.0%));
    --color-text-warning-subtle-action-button: light-dark(hsl(34deg 70% 25.0%), hsl(40deg 70% 56.0%));
    --color-background-warning-subtle-action-button: light-dark(color-mix(in oklch, hsl(41deg 70% 46.0%) 18%, transparent), color-mix(in oklch, hsl(39deg 70% 45.0%) 12%, transparent));
    --color-background-warning-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(41deg 70% 46.0%) 23%, transparent), color-mix(in oklch, hsl(39deg 70% 45.0%) 17%, transparent));
    --color-background-warning-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(41deg 70% 46.0%) 28%, transparent), color-mix(in oklch, hsl(39deg 70% 45.0%) 12%, transparent));
    --color-text-warning-text-action-button: light-dark(hsl(37deg 70% 34.0%), hsl(41deg 70% 46.0%));
    --color-background-warning-text-action-button-hover: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 10%, transparent), color-mix(in oklch, hsl(39deg 70% 42.0%) 12%, transparent));
    --color-background-warning-text-action-button-active: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 14%, transparent), color-mix(in oklch, hsl(39deg 70% 42.0%) 17%, transparent));
    --color-text-danger-solid-action-button: light-dark(hsl(40deg 34% 97.0%), color-mix(in oklch, hsl(40deg 22% 90.0%) 85%, transparent));
    --color-background-danger-solid-action-button: light-dark(hsl(8deg 55% 42.4%), hsl(8deg 50% 47.0%));
    --color-background-danger-solid-action-button-hover: light-dark(hsl(8deg 55% 37.6%), hsl(8deg 50% 53.0%));
    --color-background-danger-solid-action-button-active: light-dark(hsl(8deg 55% 31.2%), hsl(8deg 50% 47.0%));
    --color-text-danger-subtle-action-button: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 74.0%));
    --color-background-danger-subtle-action-button: light-dark(color-mix(in oklch, hsl(8deg 55% 42.4%) 13%, transparent), color-mix(in oklch, hsl(8deg 50% 65.0%) 12%, transparent));
    --color-background-danger-subtle-action-button-hover: light-dark(color-mix(in oklch, hsl(8deg 55% 42.4%) 18%, transparent), color-mix(in oklch, hsl(8deg 50% 65.0%) 17%, transparent));
    --color-background-danger-subtle-action-button-active: light-dark(color-mix(in oklch, hsl(8deg 55% 42.4%) 23%, transparent), color-mix(in oklch, hsl(8deg 50% 65.0%) 12%, transparent));
    --color-text-danger-text-action-button: light-dark(hsl(8deg 55% 31.2%), hsl(8deg 50% 74.0%));
    --color-background-danger-text-action-button-hover: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 9%, transparent), color-mix(in oklch, hsl(8deg 50% 60.0%) 12%, transparent));
    --color-background-danger-text-action-button-active: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 13%, transparent), color-mix(in oklch, hsl(8deg 50% 60.0%) 17%, transparent));
    --color-text-neutral-icon-button: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 70%, transparent), color-mix(in oklch, hsl(40deg 22% 70.0%) 70%, transparent));
    --color-text-neutral-icon-button-hover: light-dark(hsl(210deg 5% 39.6%), hsl(40deg 22% 70.0%));
    --color-text-neutral-icon-button-active: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 70%, transparent), color-mix(in oklch, hsl(40deg 22% 70.0%) 70%, transparent));
    --color-text-neutral-icon-button-square-active: light-dark(hsl(210deg 5% 39.6%), hsl(40deg 22% 70.0%));
    --color-background-neutral-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 7%, transparent), color-mix(in oklch, hsl(40deg 22% 60.0%) 14%, transparent));
    --color-background-neutral-icon-button-square-active: light-dark(color-mix(in oklch, hsl(210deg 5% 39.6%) 11%, transparent), color-mix(in oklch, hsl(40deg 22% 60.0%) 18%, transparent));
    --color-text-brand-icon-button: light-dark(color-mix(in oklch, hsl(140deg 48% 30.0%) 70%, transparent), color-mix(in oklch, hsl(246deg 96 79%) 70%, transparent));
    --color-text-brand-icon-button-hover: light-dark(hsl(140deg 48% 30.0%), hsl(138deg 38% 79.0%));
    --color-text-brand-icon-button-active: light-dark(color-mix(in oklch, hsl(140deg 48% 30.0%) 70%, transparent), color-mix(in oklch, hsl(138deg 38% 79.0%) 70%, transparent));
    --color-text-brand-icon-button-square-active: light-dark(hsl(140deg 48% 30.0%), hsl(138deg 38% 79.0%));
    --color-background-brand-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 5%, transparent), color-mix(in oklch, hsl(138deg 38% 72.0%) 14%, transparent));
    --color-background-brand-icon-button-square-active: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 10%, transparent), color-mix(in oklch, hsl(138deg 38% 72.0%) 18%, transparent));
    --color-text-info-icon-button: light-dark(color-mix(in oklch, hsl(140deg 48% 27.6%) 70%, transparent), color-mix(in oklch, hsl(138deg 38% 75.0%) 70%, transparent));
    --color-text-info-icon-button-hover: light-dark(hsl(140deg 48% 27.6%), hsl(138deg 38% 75.0%));
    --color-text-info-icon-button-active: light-dark(color-mix(in oklch, hsl(140deg 48% 27.6%) 70%, transparent), color-mix(in oklch, hsl(138deg 38% 75.0%) 70%, transparent));
    --color-text-info-icon-button-square-active: light-dark(hsl(140deg 48% 27.6%), hsl(138deg 38% 75.0%));
    --color-background-info-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 5%, transparent), color-mix(in oklch, hsl(138deg 38% 65.0%) 12%, transparent));
    --color-background-info-icon-button-square-active: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 9%, transparent), color-mix(in oklch, hsl(138deg 38% 65.0%) 17%, transparent));
    --color-text-success-icon-button: light-dark(color-mix(in oklch, hsl(140deg 35% 27.0%) 70%, transparent), color-mix(in oklch, hsl(140deg 35% 55.0%) 70%, transparent));
    --color-text-success-icon-button-hover: light-dark(hsl(140deg 35% 27.0%), hsl(140deg 35% 55.0%));
    --color-text-success-icon-button-active: light-dark(color-mix(in oklch, hsl(140deg 35% 27.0%) 70%, transparent), color-mix(in oklch, hsl(140deg 35% 55.0%) 70%, transparent));
    --color-text-success-icon-button-square-active: light-dark(hsl(140deg 35% 27.0%), hsl(140deg 35% 55.0%));
    --color-background-success-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(140deg 35% 22.0%) 8%, transparent), color-mix(in oklch, hsl(140deg 35% 40.0%) 12%, transparent));
    --color-background-success-icon-button-square-active: light-dark(color-mix(in oklch, hsl(140deg 35% 22.0%) 12%, transparent), color-mix(in oklch, hsl(140deg 35% 40.0%) 17%, transparent));
    --color-text-warning-icon-button: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 70%, transparent), color-mix(in oklch, hsl(41deg 70% 46.0%) 70%, transparent));
    --color-text-warning-icon-button-hover: light-dark(hsl(37deg 70% 34.0%), hsl(41deg 70% 46.0%));
    --color-text-warning-icon-button-active: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 70%, transparent), color-mix(in oklch, hsl(41deg 70% 46.0%) 70%, transparent));
    --color-text-warning-icon-button-square-active: light-dark(hsl(37deg 70% 34.0%), hsl(41deg 70% 46.0%));
    --color-background-warning-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 10%, transparent), color-mix(in oklch, hsl(39deg 70% 42.0%) 12%, transparent));
    --color-background-warning-icon-button-square-active: light-dark(color-mix(in oklch, hsl(37deg 70% 34.0%) 14%, transparent), color-mix(in oklch, hsl(39deg 70% 42.0%) 17%, transparent));
    --color-text-danger-icon-button: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 70%, transparent), color-mix(in oklch, hsl(8deg 50% 74.0%) 70%, transparent));
    --color-text-danger-icon-button-hover: light-dark(hsl(8deg 55% 31.2%), hsl(8deg 50% 74.0%));
    --color-text-danger-icon-button-active: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 70%, transparent), color-mix(in oklch, hsl(8deg 50% 74.0%) 70%, transparent));
    --color-text-danger-icon-button-square-active: light-dark(hsl(8deg 55% 31.2%), hsl(8deg 50% 74.0%));
    --color-background-danger-icon-button-square-hover: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 9%, transparent), color-mix(in oklch, hsl(8deg 50% 60.0%) 12%, transparent));
    --color-background-danger-icon-button-square-active: light-dark(color-mix(in oklch, hsl(8deg 55% 31.2%) 13%, transparent), color-mix(in oklch, hsl(8deg 50% 60.0%) 17%, transparent));
    --color-text-link-banner: light-dark(hsl(140deg 48% 25.2%), hsl(138deg 38% 62.0%));
    --color-text-neutral-banner: light-dark(hsl(210deg 5% 27.5%), hsl(40deg 22% 76.0%));
    --color-border-neutral-banner: light-dark(color-mix(in oklch, hsl(210deg 5% 33.0%) 40%, transparent), color-mix(in oklch, hsl(40deg 22% 66.0%) 40%, transparent));
    --color-background-neutral-banner: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 17.0%));
    --color-text-brand-banner: light-dark(hsl(140deg 48% 20.4%), hsl(138deg 38% 82.0%));
    --color-border-brand-banner: light-dark(color-mix(in oklch, hsl(140deg 48% 30.0%) 40%, transparent), color-mix(in oklch, hsl(138deg 38% 89.0%) 40%, transparent));
    --color-background-brand-banner: light-dark(hsl(95deg 22% 94.0%), hsl(140deg 20% 16.0%));
    --color-text-info-banner: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 89.0%));
    --color-border-info-banner: light-dark(color-mix(in oklch, hsl(140deg 48% 18.0%) 40%, transparent), color-mix(in oklch, hsl(138deg 38% 69.0%) 40%, transparent));
    --color-background-info-banner: light-dark(hsl(95deg 22% 92.0%), hsl(140deg 20% 12.0%));
    --color-text-success-banner: light-dark(hsl(140deg 35% 16.0%), hsl(140deg 35% 63.0%));
    --color-border-success-banner: light-dark(color-mix(in oklch, hsl(140deg 35% 25.0%) 40%, transparent), color-mix(in oklch, hsl(140deg 35% 52.0%) 40%, transparent));
    --color-background-success-banner: light-dark(hsl(140deg 35% 92.0%), hsl(140deg 35% 7.0%));
    --color-text-warning-banner: light-dark(hsl(34deg 70% 25.0%), hsl(40deg 70% 56.0%));
    --color-border-warning-banner: light-dark(color-mix(in oklch, hsl(38deg 44% 27.0%) 40%, transparent), color-mix(in oklch, hsl(44deg 44% 66.0%) 40%, transparent));
    --color-background-warning-banner: light-dark(hsl(50deg 70% 92.0%), hsl(50deg 70% 10.0%));
    --color-text-danger-banner: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 74.0%));
    --color-border-danger-banner: light-dark(color-mix(in oklch, hsl(8deg 55% 30.0%) 40%, transparent), color-mix(in oklch, hsl(8deg 50% 74.0%) 40%, transparent));
    --color-background-danger-banner: light-dark(hsl(10deg 35% 92.0%), hsl(8deg 50% 18.0%));
    --color-background-legacy-input: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 0.0% / 20%));
    --color-border-legacy-input: light-dark(hsl(40deg 12% 80.0%), hsl(40deg 6% 0.0% / 60%));
    --color-border-legacy-input-focus: light-dark(hsl(140deg 25% 62.0% / 80%), hsl(40deg 6% 0.0% / 90%));
    --color-background-disabled-settings-select: light-dark(hsl(40deg 34% 92.8%), hsl(40deg 6% 0.0% / 20%));
    --color-background-disabled-modal-select: light-dark(hsl(40deg 34% 91.0%), hsl(40deg 6% 0.0% / 20%));
    --color-text-input: light-dark(hsl(210deg 5% 15.4%), hsl(40deg 22% 90.0%));
    --color-background-input: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 10.0%));
    --color-background-input-focus: light-dark(hsl(40deg 34% 97.0%), hsl(40deg 6% 7.0%));
    --color-outline-input: light-dark(color-mix(in oklch, hsl(140deg 22% 18.0%) 30%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 20%, transparent));
    --color-outline-input-hover: light-dark(color-mix(in oklch, hsl(140deg 22% 18.0%) 60%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 40%, transparent));
    --color-outline-input-focus: light-dark(color-mix(in oklch, hsl(140deg 22% 18.0%) 80%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 50%, transparent));
    --color-box-shadow-input-focus: light-dark(color-mix(in oklch, hsl(210deg 5% 22.0%) 30%, transparent), color-mix(in oklch, hsl(40deg 22% 90.0%) 40%, transparent));
    --color-success-main-view-banner: light-dark(hsl(140deg 35% 25.0%), hsl(140deg 35% 80.0%));
    --color-background-success-main-view-banner: light-dark(hsl(140deg 35% 92.0%), hsl(140deg 35% 8.0%));
    --color-border-success-main-view-banner: light-dark(hsl(140deg 35% 25.0% / 40%), hsl(140deg 35% 52.0% / 40%));
    --color-success-main-view-banner-close-button: light-dark(hsl(140deg 35% 25.0% / 50%), hsl(140deg 35% 55.0% / 50%));
    --color-success-main-view-banner-close-button-hover: light-dark(hsl(140deg 35% 25.0%), hsl(140deg 35% 55.0%));
    --color-success-main-view-banner-close-button-active: light-dark(hsl(140deg 35% 25.0% / 75%), hsl(140deg 35% 55.0% / 75%));
    --color-background-success-main-view-banner-action-button: light-dark(hsl(140deg 35% 25.0% / 10%), hsl(140deg 35% 55.0% / 10%));
    --color-background-success-main-view-banner-action-button-hover: light-dark(hsl(140deg 35% 25.0% / 12%), hsl(140deg 35% 55.0% / 15%));
    --color-background-success-main-view-banner-action-button-active: light-dark(hsl(140deg 35% 25.0% / 15%), hsl(140deg 35% 55.0% / 20%));
    --color-warning-main-view-banner: light-dark(hsl(38deg 44% 27.0%), hsl(50deg 45% 80.0%));
    --color-background-warning-main-view-banner: light-dark(hsl(50deg 70% 92.0%), hsl(53deg 70% 11.0%));
    --color-border-warning-main-view-banner: light-dark(hsl(38deg 44% 27.0% / 40%), hsl(38deg 44% 60.0% / 40%));
    --color-warning-main-view-banner-close-button: light-dark(hsl(38deg 44% 27.0% / 50%), hsl(50deg 45% 61.0% / 50%));
    --color-warning-main-view-banner-close-button-hover: light-dark(hsl(38deg 44% 27.0%), hsl(50deg 45% 61.0%));
    --color-warning-main-view-banner-close-button-active: light-dark(hsl(38deg 44% 27.0% / 75%), hsl(50deg 45% 61.0% / 75%));
    --color-warning-main-view-banner-action-button: light-dark(inherit, hsl(50deg 45% 61.0%));
    --color-background-warning-main-view-banner-action-button: light-dark(hsl(38deg 44% 27.0% / 10%), hsl(50deg 45% 61.0% / 10%));
    --color-background-warning-main-view-banner-action-button-hover: light-dark(hsl(38deg 44% 27.0% / 12%), hsl(50deg 45% 61.0% / 15%));
    --color-background-warning-main-view-banner-action-button-active: light-dark(hsl(38deg 44% 27.0% / 15%), hsl(50deg 45% 61.0% / 20%));
    --color-error-main-view-banner: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 80.0%));
    --color-background-error-main-view-banner: light-dark(hsl(10deg 35% 90.0%), hsl(8deg 50% 19.0%));
    --color-border-error-main-view-banner: light-dark(hsl(8deg 55% 30.0% / 40%), hsl(8deg 50% 74.0% / 40%));
    --color-error-main-view-banner-close-button: light-dark(hsl(8deg 55% 30.0% / 50%), hsl(8deg 50% 74.0% / 50%));
    --color-error-main-view-banner-close-button-hover: light-dark(hsl(8deg 55% 30.0%), hsl(8deg 50% 74.0%));
    --color-error-main-view-banner-close-button-active: light-dark(hsl(8deg 55% 30.0% / 75%), hsl(8deg 50% 74.0% / 75%));
    --color-error-main-view-banner-action-button: light-dark(inherit, hsl(8deg 50% 74.0%));
    --color-background-error-main-view-banner-action-button: light-dark(hsl(8deg 55% 30.0% / 10%), hsl(8deg 50% 74.0% / 10%));
    --color-background-error-main-view-banner-action-button-hover: light-dark(hsl(8deg 55% 30.0% / 12%), hsl(8deg 50% 74.0% / 15%));
    --color-background-error-main-view-banner-action-button-active: light-dark(hsl(8deg 55% 30.0% / 15%), hsl(8deg 50% 74.0% / 20%));
    --color-info-main-view-banner: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 80.0%));
    --color-background-info-main-view-banner: light-dark(hsl(95deg 22% 92.0%), hsl(140deg 20% 12.0%));
    --color-border-info-main-view-banner: light-dark(hsl(140deg 48% 18.0% / 40%), hsl(138deg 38% 69.0% / 40%));
    --color-info-main-view-banner-close-button: light-dark(hsl(140deg 48% 18.0% / 50%), hsl(138deg 38% 69.0% / 50%));
    --color-info-main-view-banner-close-button-hover: light-dark(hsl(140deg 48% 18.0%), hsl(138deg 38% 69.0%));
    --color-info-main-view-banner-close-button-active: light-dark(hsl(140deg 48% 18.0% / 75%), hsl(138deg 38% 69.0% / 75%));
    --color-info-main-view-banner-action-button: light-dark(inherit, hsl(138deg 38% 69.0%));
    --color-background-info-main-view-banner-action-button: light-dark(hsl(140deg 48% 18.0% / 10%), hsl(138deg 38% 69.0% / 10%));
    --color-background-info-main-view-banner-action-button-hover: light-dark(hsl(140deg 48% 18.0% / 12%), hsl(138deg 38% 69.0% / 15%));
    --color-background-info-main-view-banner-action-button-active: light-dark(hsl(140deg 48% 18.0% / 15%), hsl(138deg 38% 69.0% / 20%));
    --color-main-view-banner-action-link: light-dark(var(--color-text-generic-link), hsl(138deg 38% 50.0%));
    --color-background-main-view-banner-moving-bar: light-dark(hsl(95deg 22% 88.0%), hsl(140deg 20% 18.0%));
    --color-info-density-control-border: light-dark(hsl(210deg 5% 0.0% / 20%), hsl(40deg 22% 90.0% / 20%));
    --color-info-density-button-icon: light-dark(hsl(210deg 5% 39.6%), hsl(40deg 22% 90.0% / 80%));
    --color-info-density-button-hover-background: light-dark(hsl(210deg 5% 39.6% / 7%), hsl(40deg 22% 50.0% / 30%));
}

@media screen {
  html:root.dark-theme {
    --box-shadow-overlay: 0 0 30px hsl(140deg 20% 7.0%);
    --color-recipient-bar-controls-spinner: hsl(40deg 22% 90.0%);
    --color-text-sender-name: hsl(40deg 22% 90.0% / 85%);
    --color-text-other-mention: hsl(40deg 22% 90.0% / 80%);
    --color-text-empty-list-message: hsl(40deg 22% 67.0%);
    --color-background-notification-table-thead: hsl(40deg 6% 0.0% / 20%);
    --box-shadow-popover-menu: 0 2.78px 4.12px 0 hsl(40deg 6% 0.0% / 10%),
        0 5.5113px 8.5783px 0 hsl(40deg 6% 0.0% / 9%),
        0 8.4377px 13.9271px 0 hsl(40deg 6% 0.0% / 11%),
        0 12.177px 21.4737px 0 hsl(40deg 6% 0.0% / 11%),
        0 18.7257px 35.4802px 0 hsl(40deg 6% 0.0% / 15%),
        0 41px 80px 0 hsl(40deg 6% 0.0% / 20%);
    --color-exit-button-text: hsl(40deg 22% 90.0%);
    --color-exit-button-background: hsl(40deg 6% 30.0% / 50%);
    --color-exit-button-background-interactive: hsl(40deg 6% 30.0% / 65%);
  }
}
@media screen and (prefers-color-scheme: dark) {
  html:root.color-scheme-automatic {
    --box-shadow-overlay: 0 0 30px hsl(140deg 20% 7.0%);
    --color-recipient-bar-controls-spinner: hsl(40deg 22% 90.0%);
    --color-text-sender-name: hsl(40deg 22% 90.0% / 85%);
    --color-text-other-mention: hsl(40deg 22% 90.0% / 80%);
    --color-text-empty-list-message: hsl(40deg 22% 67.0%);
    --color-background-notification-table-thead: hsl(40deg 6% 0.0% / 20%);
    --box-shadow-popover-menu: 0 2.78px 4.12px 0 hsl(40deg 6% 0.0% / 10%),
        0 5.5113px 8.5783px 0 hsl(40deg 6% 0.0% / 9%),
        0 8.4377px 13.9271px 0 hsl(40deg 6% 0.0% / 11%),
        0 12.177px 21.4737px 0 hsl(40deg 6% 0.0% / 11%),
        0 18.7257px 35.4802px 0 hsl(40deg 6% 0.0% / 15%),
        0 41px 80px 0 hsl(40deg 6% 0.0% / 20%);
    --color-exit-button-text: hsl(40deg 22% 90.0%);
    --color-exit-button-background: hsl(40deg 6% 30.0% / 50%);
    --color-exit-button-background-interactive: hsl(40deg 6% 30.0% / 65%);
  }
}
/* Humanis identity for Zulip, after humanis.ai: sepia paper, slate ink,
   Computer Modern Serif, forest only as a light accent.
   Loaded after Zulip's own bundles (nginx injects the <link>). */

@font-face { font-family: "Computer Modern Serif"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/cmunrm.woff") format("woff"); }
@font-face { font-family: "Computer Modern Serif"; font-weight: 700; font-style: normal; font-display: swap; src: url("fonts/cmunbx.woff") format("woff"); }
@font-face { font-family: "Computer Modern Serif"; font-weight: 400; font-style: italic; font-display: swap; src: url("fonts/cmunti.woff") format("woff"); }
@font-face { font-family: "Computer Modern Serif"; font-weight: 700; font-style: italic; font-display: swap; src: url("fonts/cmunbi.woff") format("woff"); }
@font-face { font-family: "EB Garamond"; font-weight: 400 500; font-style: normal; font-display: swap; src: url("fonts/EBGaramond.woff2") format("woff2"); }

html:root {
    --h-serif: "Computer Modern Serif", "Crimson Text", Georgia, serif;
    --h-wordmark: "EB Garamond", Georgia, serif;
    --h-paper: light-dark(#f4f0e8, #1c1b18);
    --h-paper-2: light-dark(#ebe7df, #25231f);
    --h-sheet: light-dark(#faf8f4, #211f1c);
    --h-ink: light-dark(#383b3e, #ebe7df);
    --h-ink-2: light-dark(#5a5d60, #b9b3a6);
    --h-hair: light-dark(#d4cfc4, #3a3833);
    --h-forest: light-dark(#1e5631, #7fc48f);
    --h-forest-fill: light-dark(#1e5631, #2e6b44);
    --h-forest-fill-hover: light-dark(#174426, #357a4e);
    --h-button: light-dark(#383b3e, #ebe7df);
    --h-button-text: light-dark(#f4f0e8, #1c1b18);

    /* Calm surfaces: hairlines instead of drop shadows. */
    --box-shadow-popover-menu: 0 0 0 1px var(--h-hair);
    --box-shadow-overlay: 0 0 0 1px var(--h-hair);
    --box-shadow-unread-counter-normal: none;

    /* The one strong forest spot: sending a message. */
    --color-compose-send-button-background: var(--h-forest-fill);
    --color-compose-send-button-background-interactive: var(--h-forest-fill-hover);
    --color-compose-send-button-icon-color: #f4f0e8;
    --color-background-animated-button-hover: var(--h-forest-fill-hover);
    --color-stream-group-row-checked-icon: var(--h-forest-fill);
    --color-stream-group-row-checked-icon-hover: var(--h-forest-fill-hover);
}
html:root.dark-theme {
    --box-shadow-popover-menu: 0 0 0 1px var(--h-hair);
    --box-shadow-overlay: 0 0 0 1px var(--h-hair);
}
@media screen and (prefers-color-scheme: dark) {
    html:root.color-scheme-automatic {
        --box-shadow-popover-menu: 0 0 0 1px var(--h-hair);
        --box-shadow-overlay: 0 0 0 1px var(--h-hair);
    }
}

/* ---- Type ---- */
body,
.tippy-box,
input,
textarea,
select,
button {
    font-family: var(--h-serif) !important;
    /* Computer Modern has a small x-height; match Zulip's sizing. */
    font-size-adjust: 0.5;
}
/* Icon fonts must keep their own metrics. */
.zulip-icon,
[class^="zulip-icon"],
[class*=" zulip-icon"],
.fa,
[class^="fa-"],
[class*=" fa-"] {
    font-size-adjust: none !important;
}
/* Section labels in slate; forest is kept for links and actions. */
.left-sidebar-title,
.inbox-header-name-text,
.buddy-list-heading,
.buddy-list-heading-text,
[class*="buddy-list-section-header"] {
    color: var(--h-ink-2) !important;
}
h1,
h2,
h3,
.modal__title,
.settings-section-title,
.overlay-heading {
    font-family: var(--h-serif);
    font-weight: 400;
}
.rendered_markdown blockquote {
    font-style: italic;
    border-left-color: var(--h-hair);
}

/* ---- Wordmark: orbit mark + HUMANIS, as on humanis.ai ---- */
.header .brand .nav-logo,
#realm-navbar-wide-logo {
    display: none !important;
}
body:not(:has(.portico-container)) .header .brand,
body:has(.portico-container) .portico-header .brand a {
    display: inline-flex !important;
    align-items: center;
    gap: 0.55em;
    color: var(--h-ink);
    text-decoration: none;
}
body:not(:has(.portico-container)) .header .brand::before,
body:has(.portico-container) .portico-header .brand a::before {
    content: "";
    width: 30px;
    height: 30px;
    flex: none;
    background-color: currentColor;
    mask: url("mark.svg") center / contain no-repeat;
    -webkit-mask: url("mark.svg") center / contain no-repeat;
}
body:not(:has(.portico-container)) .header .brand::after,
body:has(.portico-container) .portico-header .brand a::after {
    content: "Humanis";
    font-family: var(--h-wordmark);
    font-weight: 400;
    font-size: 17px;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.22em;
}

/* ---- Channels: no per-channel color blocks; ink icons, paper rows ---- */
.inbox-header[style],
.message-header-contents[style] {
    background: var(--h-paper-2) !important;
}
.stream-privacy[style],
.channel-privacy-type-icon[style],
[class*="stream-privacy-original-color"],
[class*="stream-privacy-modified-color"] {
    color: var(--h-ink-2) !important;
}

/* ---- Shape: sharp paper edges, except things meant to be round ---- */
html:root
    *:not([class*="circle"]):not([class*="spinner"]):not([class*="loading"]):not(
        [class*="toggle"]
    ):not([class*="presence"]):not([class*="dot"]):not([class*="avatar"]),
html:root *::before,
html:root *::after {
    border-radius: 0 !important;
}
html:root img[class*="avatar"],
html:root [class*="avatar"] img {
    border-radius: 2px !important;
}
.popover-menu,
.tippy-box,
.modal__container,
.dropdown-menu,
.message_reactions .message_reaction {
    box-shadow: none !important;
}
.modal__container,
.popover-menu,
.tippy-box[data-theme="popover-menu"] {
    border: 1px solid var(--h-hair);
}

/* ---- Buttons: slate like the site's; forest stays for sending ---- */
.action-button-primary-brand,
.modal__button.dialog_submit_button,
.button.primary,
.new-style .button.primary {
    background-color: var(--h-button) !important;
    border-color: var(--h-button) !important;
    color: var(--h-button-text) !important;
}
.action-button-primary-brand:hover,
.modal__button.dialog_submit_button:hover,
.button.primary:hover {
    background-color: var(--h-ink-2) !important;
}

::selection {
    background: light-dark(hsl(95deg 22% 86%), hsl(140deg 25% 26%));
}

/* ---- Login, sign-up and other "portico" pages (light only upstream,
   hardcoded colors, so overridden element by element) ---- */
body:has(.portico-container) {
    background: #f4f0e8 !important;
    color: #383b3e;
}
body:has(.portico-container) .portico-header {
    background: #f4f0e8 !important;
    border-bottom: 1px solid #d4cfc4;
    box-shadow: none;
}
body:has(.portico-container) .portico-header .brand-logo {
    display: none;
}
body:has(.portico-container) .portico-header a,
body:has(.portico-container) .portico-header .dropdown-toggle {
    color: #383b3e !important;
}
body:has(.portico-container) h1,
body:has(.portico-container) .get-started {
    font-family: var(--h-serif);
    font-weight: 400;
    color: #383b3e !important;
}
body:has(.portico-container) .white-box,
body:has(.portico-container) .login-page-container {
    background: #faf8f4 !important;
    border: 1px solid #d4cfc4 !important;
    box-shadow: none !important;
}
body:has(.portico-container) input[type="text"],
body:has(.portico-container) input[type="email"],
body:has(.portico-container) input[type="password"],
body:has(.portico-container) input:not([type]),
body:has(.portico-container) select,
body:has(.portico-container) textarea {
    background: #faf8f4 !important;
    border: 1px solid #d4cfc4 !important;
    color: #383b3e !important;
    box-shadow: none !important;
}
body:has(.portico-container) input:focus,
body:has(.portico-container) select:focus,
body:has(.portico-container) textarea:focus {
    border-color: #1e5631 !important;
    outline: 1px solid #1e5631 !important;
}
body:has(.portico-container) a,
body:has(.portico-container) a.forgot-password {
    color: #1e5631 !important;
}
body:has(.portico-container) button,
body:has(.portico-container) .button,
body:has(.portico-container) input[type="submit"] {
    background: #383b3e !important;
    border: 1px solid #383b3e !important;
    color: #f4f0e8 !important;
    box-shadow: none !important;
    outline: none;
}
body:has(.portico-container) button:hover,
body:has(.portico-container) .button:hover,
body:has(.portico-container) input[type="submit"]:hover {
    background: #5a5d60 !important;
}
body:has(.portico-container) .anonymous-access-button,
body:has(.portico-container) button.full-width:not([type="submit"]),
body:has(.portico-container) .button.secondary {
    background: transparent !important;
    color: #383b3e !important;
    border: 1px solid #383b3e !important;
}
body:has(.portico-container) .anonymous-access-button:hover,
body:has(.portico-container) button.full-width:not([type="submit"]):hover {
    background: #ebe7df !important;
}
body:has(.portico-container) .or span {
    background: #faf8f4 !important;
}
body:has(.portico-container) .alert-error,
body:has(.portico-container) .text-error {
    color: #9b3b2e !important;
}
body:has(.portico-container) #footer {
    --color-footer-background: #ebe7df;
    --color-links: #383b3e;
    background: #ebe7df !important;
    color: #5a5d60 !important;
    border-top: 1px solid #d4cfc4;
}
body:has(.portico-container) #footer *,
body:has(.portico-container) #footer a {
    color: #383b3e !important;
}
